new Promise((resolve, reject) => {
console.log("外部promise");
resolve();
})
.then(() => {
console.log("外部第一个then");
return new Promise((resolve, reject) => {
console.log("内部promise");
resolve();
})
.then(() => {
console.log("内部第一个then");
})
.then(() => {
console.log("内部第二个then");
});
})
.then(() => {
console.log("外部第二个then");
});
解析:
执行过程:
1. 执行同步任务,打印出"外部promise" -> 遇到resolve,改变promise状态,并且调用第一个then方法,将第一个then中的callback注册到微任务队列>
2. 此时执行栈清空,微任务队列中的callback推入执行栈
3. 执行同步任务,打印"外部第一个then", 接着遇到了return,所以要等到当前第一个then中的所有代码执行完毕,才能调用外部第二个then
4. 执行同步代码,打印出"内部promise",遇到resolve改变状态,调用内部第一个then,此时同步任务结束
5. 微任务队列中的callback被推入执行栈,打印出"内部第一个then",此时内部第一个then中的同步任务完成,调用内部第二个then方法,将其callback注册到微任务
6. 同步任务执行完毕,查询微任务,打印"内部第二个then",此时外部第一个then中的所有代码执行完毕,返回,于是调用外部第二个then方法,注册内部的callback
7.打印"外部第二个then"
!!!注意,resolve执行时做两件事:1,改变当前promise的状态,2. 调用紧跟在其后的then方法,then方法是同步执行的,callback会被注册在微任务队列中,微任务队列的执行顺序是先进先出。
|
|