关于async/await的总结
2018-06-08 本文已影响74人
Mr无愧于心
---async和await是干什么用的---
-
一句话:是用来解决异步流程问题的。
-
避免回调地狱(callback hell),且以最接近同步代码的方式编写异步代码
-
async/await是对co模块的升级,内置生成器函数的执行器,不再依赖co模块。
---语义---
async 可以声明一个异步函数,此函数需要返回一个 Promise 对象。await可以等待一个 Promise 对象 resolve,并拿到结果。
function aaa(){
return new Promise((resolve) => {//返回一个promise对象
setTimeout(function(){//这里使用计时器模拟异步,也可以使用ajax,node异步读写等。。
resolve(123); //异步执行resolve函数
},2000)
})
}
async function getaaa(){
let a=await aaa();//等待aaa函数的执行结果
console.log(a)//拿到执行的返回值
}
getaaa()//调用这个函数
---async和await的用法---
- 一般用法(模拟同步写法)
var sleep = function (time) {
return new Promise(function (resolve, reject) {
setTimeout(function () {
resolve();//也可以把resolve写在sjax的sussess的回调中,都是异步调取
}, time);
})
};
var start = async function () {
// 在这里使用起来就像同步代码那样直观
console.log('start');//立即打印start
await sleep(3000);//等待三秒
console.log('end');//三秒后打印end
};
start();
- async函数捕捉异常(也可以用promise对象链上的catch方法)
var sleep = function (time) {
return new Promise(function (resolve, reject) {
setTimeout(function () {
// 模拟出错了,返回 ‘error’
reject('error');
}, time);
})
};
var start = async function () {
try {
console.log('start');
await sleep(3000); // 这里得到了一个返回错误
// 所以以下代码不会被执行了,会走catch
console.log('end');
} catch (err) {
console.log(err); // 这里捕捉到错误 `error`
}
};
- 并行(依赖于Promise.all方法)
let count = ()=>{
return new Promise((resolve,reject) => {
setTimeout(()=>{
resolve(100);
},500);
});
}
let list = ()=>{
return new Promise((resolve,reject)=>{
setTimeout(()=>{
resolve([1,2,3]);
},500);
});
}
let getList = async ()=>{
let result = await Promise.all([count(),list()]);
return result;
}
//调用
getList().then(result=> {
console.timeEnd('begin'); //begin: 505.557ms后才执行
console.log(result); //[ 100, [ 1, 2, 3 ] ]
}).catch(err=> {
console.timeEnd('begin');
console.log(err);
});
对比Promise,co,async/await的区别
-
1.promise
链式调用
避免回调地狱(连环嵌套)
每次then拿取返回值不能跨then拿取数据,只能拿到当前的上一个传下来的
new Promise(...).then(res1=>{}).then(res2=>{}).then(res3=>{这里想要用res1需要一步一步传下来才行})
-
2.co
需要引用插件
依赖generator -
3.async/await()----最好用!!!!
ES7 中更加标准的解决方案(需要babel)。
语法简洁,代码优雅
每次都能拿到异步函数的返回值,避免嵌套