async/await执行顺序面试题

async function async1 () {
  console.log('async1 start')
  await async2();
  console.log('async1 end')
}
 
async function async2 () {
  console.log('async2')
}
 
console.log('script start')
 
setTimeout(function () {
  console.log('setTimeout')
}, 0)
 
async1();
 
new Promise (function (resolve) {
  console.log('promise1')
  resolve();
}).then (function () {
  console.log('promise2')
})
 
console.log('script end')

结果:

script start
async1 start
async2
promise1
script end
promise2
async1 end
setTimeout

解析:
先执行主代码块,所以第一行打印script start

setTimeout()是另一个宏任务,所以先放在宏任务队列。

然后执行async1async1里先打印async1 start
执行await async2 , 先执行async2,打印async2, 返回promise对象。await会阻塞async1后面的代码执行,所以先跳出来继续执行后面的代码。

然后执行new Promise 打印promise1
then里面的函数加入微任务队列

打印script end
到这里第一个宏任务执行完毕,开始执行微任务then,打印promise2

then执行完后,await才算是执行结束了,后面的代码不再被阻塞,所以打印async1 end
这时候继续执行第二个宏任务setTimeout,打印setTimeout

©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页