JS异步之宏队列与微队列

有关宏队列与微队列具体请参考以下两篇文章：

• 宏任务和微任务到底是什么？
• JS异步之宏队列与微队列

这里主要说一道面试题：

setTimeout(() => {
  console.log("0")
}, 0)
new Promise((resolve, reject) => {
  console.log("1")
  resolve()
}).then(() => { // c1
  console.log("2")
  new Promise((resolve, reject) => {
    console.log("3")
    resolve()
  }).then(() => { //c4
    console.log("4")
  }).then(() => { //c5
    console.log("5")
  })
}).then(() => { //c2
  console.log("6")
})

new Promise((resolve, reject) => {
  console.log("7")
  resolve()
}).then(() => { //c3
  console.log("8")
})

输出是：

1 7 2 3 8 4 6 5 0

说明：

• 遇到定时器放入宏队列
• 遇到Promise立马执行输出"1"，并将回调函数c1放入微队列
• 遇到Promise立即执行输出"7"，并将回调函数c3放入微队列
• 所有的初始化同步任务代码执行完毕
• 接下来开始执行微队列中的任务
• 取出微任务队列队首c1执行，输出"2"，遇到Promise立即执行输出"3"，并将c1的回调函数c4放入微队列
• 取出微任务队列队首c3执行，输出"8"
• 取出微任务队列队首c4执行，输出"4"，并将c4的回调函数c5放入微队列
• 取出微任务队列队首c2执行，输出"6"
• 取出微任务队列队首c5执行，输出"5"
• 至此所有微任务执行完毕

是我自己学习时认为的一种合理解释，发出来记录一下，如果有误还望指正！