请分析以下代码的输出结果

const p1 = new Promise((resolve) => {
  console.log('p1 constructor')
  resolve(1)
})

const p2 = new Promise((resolve) => {
  console.log('p2 constructor')
  setTimeout(() => resolve(2), 0)
})

console.log('start')

p1.then(v => console.log('p1 then:', v))
p2.then(v => console.log('p2 then:', v))

queueMicrotask(() => console.log('microtask'))

console.log('end')

输出结果

p1 constructor
p2 constructor
start
end
p1 then: 1
microtask
p2 then: 2

分析

同步阶段：

1. new Promise 的 executor 同步执行 → p1 constructor
2. p2 的 executor 同步执行 → p2 constructor，setTimeout 放入宏任务队列
3. start
4. p1.then 回调放入微任务队列（p1 已 resolve）
5. p2.then 回调暂不放入队列（p2 还在 pending）
6. queueMicrotask 放入微任务队列
7. end

微任务阶段：
8. p1 then: 1 — 先注册的先执行
9. microtask

宏任务阶段：
10. setTimeout 回调执行，p2 resolve
11. p2 resolve 触发 p2.then → 放入微任务队列
12. 本轮宏任务结束后执行微任务 → p2 then: 2

关键点

• new Promise 的 executor 是同步执行的
• then 回调只有当 Promise 状态变为 fulfilled/rejected 后才会进入微任务队列
• queueMicrotask 显式添加微任务

同分类其他题目