前两篇文章给大家介绍了Promise和如何实现一个简单的Promise,那么什么是Async await呢,他们又有什么关系呢
Async/await:是一个用同步思维解决异步问题的方案
- 会自动将常规函数转换成Promise,返回值也是一个Promise对象
- 只有async函数内部的异步操作执行完,才会执行then方法指定的回调函数
- 异步函数内部可以使用await
- await 放置在Promise调用之前,await 强制后面点代码等待,直到Promise对象resolve,得到resolve的值作为await表达式的运算结果
- await只能在async函数内部使用,用在普通函数里就会报错
和Promise相比较 相同点:
为了解决异步流程问题,promise是约定,而async更优雅
区别:
- Promise是ES6,而async是ES7
- Promise原来有规范的意义,Promise a,b,c,d 等规范,最终确定的是Promise a 规范
- Promise链式操作,自己catch异常。async则要在函数内catch,好在现在catch成本较低
- Promise有很多并行神器,比如Promise.allPromise.race等。这些是async没法搞定的
- Promise是显式的异步,而 Async/await 让你的代码看起来是同步的,你依然需要注意异步
- Promise即使不支持es6,你依然可以用promise的库或polyfil,而async就很难做,当然也不是不能,成本会高很多
- async functions 和Array.forEach等结合,很多tc39提案都在路上或者已经实现,处于上升期,而promise也就那样了
总结:Async/awati 简单好用,是大势,肯定得学,而async的使用绕不开Promise,所以Promise是必会的。
下面的例子简单介绍一下Async/await 使用方法;
代码语言:javascript复制 function a() {
return new Promise((resolve, reject) => {
setTimeout(() => { console.log('a执行'); resolve(3) }, 3000)
});
}
function b() {
return new Promise((resolve, reject) => {
setTimeout(() => { console.log('b执行'); resolve(20) }, 2000)
});
}
async function doIt() {
try { // async方法会吞掉所有报错信息,如果此例子中b()返回的是reject,不使用try...catch的话,无法获取到错误信息
const res1 = await a();
const res2 = await b(); // 这样的写法是不是很符合同步思维呢
console.log(res1 res2);
} catch (err) {
console.log(err)
}
}
// Promise 方法调用
// function doIt() {
// a().then(res1 => {
// return b().then(res2 => {
// console.log(res1 res2)
// })
// }).catch(err => {
// console.log(err)
// })
// }
doIt(); // a执行 b执行 23