一道async/await、promise和setTimeout的面试题

题目:
javascript

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')
复制代码

答案(chrome输出):
java

script start
async1 start
async2
promise1
script end
promise2
async1 end
settimeout
复制代码

在解这个以前咱们有几个知识点要清楚:
一、js是单线程的。
二、promise被定义后是当即执行的,可是他的resolve是异步的。
三、promise的异步优先级高于setTimeout
四、async会返回一个promise对象,await关键字会让出线程。

接下在咱们分析下代码执行流程:
一、执行console.log('script start'),输出script start
二、执行setTimeout,是一个异步动做,放入异步队列中;
三、执行async1(),输出async1 start,继续向下执行;
四、执行async2(),输出async2,并返回了一个promise对象,await让出了线程,把返回的promise加入了异步队列,因此async1()下面的代码也要等待上面完成后继续执行;
六、执行console.log('script end'),输出script end;
七、到此同步的代码就都执行完成了,而后去异步队列里去获取任务,如今队列中有一个promise(async2返回的),resolve(new Promise的),和setTimeout,先取出promise执行,默认返回resolve,再次加入了异步队列,如今就队列就变成了resolve(new Promise的),resolve(async2返回的promise返回的),setTimeout
八、而后执行resolve(new Promise的),输出了promise2
九、接下来执行resolve(async2返回的promise返回的),输出了async1 end
十、最后执行setTimeout,输出了settimeout
chrome

相关文章
相关标签/搜索