跳到主要内容

async/await 的顺序问题

来一道经典的异步题目

async function async1() {
console.log('async1 start') // step 2
await async2()
// await 后面的都作为回调内容 -微任务
console.log('async1 end') // step 6
}
async function async2() {
console.log('async2') // step 3
}
console.log('script start') // step 1
setTimeout(function () { // 宏任务
console.log('setTimeout') // step 8
}, 0)
async1()
//初始化 promise 时,传入的函数会立即执行
new Promise(function (resolve) {
console.log('promise1') // step 4
resolve()
}).then(function () { // 微任务
console.log('promise2') // step 7
})
console.log('script end') // step 5
// 同步代码执行完毕(event loop - call stack 被清空)
// 执行微任务
// (尝试触发 DOM 渲染)
// 触发 Event Loop, 执行宏任务

上面执行结果:

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