關(guān)于async/await的總結(jié)
標(biāo)簽:
JavaScript
---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
需要引用插件
依赖generator3.async/await()----最好用!!!!
ES7 中更加标准的解决方案(需要babel)。
语法简洁,代码优雅
每次都能拿到异步函数的返回值,避免嵌套
作者:Mr无愧于心
链接:https://www.jianshu.com/p/0589cda11deb
點(diǎn)擊查看更多內(nèi)容
為 TA 點(diǎn)贊
評(píng)論
評(píng)論
共同學(xué)習(xí),寫下你的評(píng)論
評(píng)論加載中...
作者其他優(yōu)質(zhì)文章
正在加載中
感謝您的支持,我會(huì)繼續(xù)努力的~
掃碼打賞,你說多少就多少
贊賞金額會(huì)直接到老師賬戶
支付方式
打開微信掃一掃,即可進(jìn)行掃碼打賞哦