【学习笔记】我以为已经理解了的Event Loop

直接进入主题

今天看了下面的例子，我裂开了。

console.log('script start')

async function async1() {
  await async2()
  console.log('async1 end')
}
function async2() {
  console.log('async2 end')
}
async1()

Promise.resolve().then(() => {
  console.log('p1')
})

console.log('script end')

我以为输出的顺序是：
script start
async2 end
async1 end
script end
p1

但正确的输出顺序是：
script start
async2 end
script end
async1 end
p1

这是为什么呢？

这里先理解下async/await，调用async修饰的函数后返回的是一个Promise对象，那其中await等待的是什么的？如果await后面是一个Promise对象，那它等待的就是Promise对象的resolve，然后再去执行后面的代码。

async修饰函数中的执行过程都是被封装在一个Promise对象中异步执行的。

看了下面的代码相信就能理解啦！

async function async1() {
  await async2()
  console.log('async1 end')
}

// 可以把这个async1函数写成这样
async function async1(){
  new Promise(resolve => {
    async2()
    resolve()
  }).then(() => {
    console.log('async1 end')
  })
}

新知识get！

Event Loop 参考链接：juejin.cn/post/684490…
async/await参考链接：segmentfault.com/a/119000000…