async/await异步不阻塞调用

30次阅读

共计 848 个字符,预计需要花费 3 分钟才能阅读完成。

es6 有两个新的异步语法,一个是 async,await,一个是 promise,两者我更青睐于 async,await,原因很简单,async,await 语法糖让代码更清晰,更直观。简单的讲一下,async 函数返回一个 Promise 对象,可以使用 then 方法添加回调函数。当函数执行的时候,一旦遇到 await 就会先返回,等到异步操作完成,再接着执行函数体内后面的语句。那其实就是说在 async 函数内,每当遇到 await 关键字的时候,函数就是阻塞住,必须等到异步操作有结果时才会往下继续执行,思考下,我们关心的异步返回的结果,那么也就是说我们可以异步函数执行的结果储存起来,在需要的时候再去 await,看下面的代码
function asyncAfun() {
return new Promise((resolove)=>{
setTimeout(function() {
resolove(123);
}, 3000);
})
}
function asyncBfun() {
return new Promise((resolove)=>{
setTimeout(function() {
resolove(456);
}, 3000);
})
}
async function test () {
let a = asyncAfun();// 不阻塞
let b = asyncBfun();// 不阻塞
let _a = await a; // 这里等待 a 的返回 后面可以 do something
let _b = await b;// 这里等待 b 的返回 后面可以 do something
}
那么当你需要同时并发大量请求,并且等待所有的请求结果完成的时候可以这么写
async function test () {
let a = asyncAfun();
let b = asyncBfun();
let _a = await a;
let _b = await b;
Promise.all([_a,_b]).then(v=>{
console.log(v)
})
}
Promise.all 的作用可以去 MDN 查,类似的还有 Promise.race
学以致用,以上

正文完
 0