某天中午午饭前，11:48分，钉钉突然闪动了起来。消息如下：
一张答对就有午饭的图片，ps： 12:00午饭.png
代码如下：
(function() {
setTimeout(() => {
console.log(0);
});
new Promise(resolve => {
console.log(1);
setTimeout(() => {
resolve();
Promise.resolve().then(() => console.log(2));
console.log(3);
});
Promise.resolve().then(() => console.log(4));
}).then(() => {
console.log(5);
Promise.resolve().then(() => console.log(8)); //这句是多加的
setTimeout(() => console.log(6));
});
console.log(7);
})();
那么打印顺序是咋样的呢？我们来好好分析一下。
(╥╯^╰╥)emmmm,被批评了解释的不够简单易懂，我残忍的删掉了一大段解释
这里本来有一大段关于上面那个题目的解释
我决定了，上面那题你们自己做，做对了，就请我吃一顿午饭！！！！！！！！！！！
那咱们来一个更加复杂的来分析分析
下题的打印顺序是啥？
(function() {
setTimeout(() => {
console.log(0);
});
new Promise(resolve => {
console.log(1);
setTimeout(() => {
resolve();
Promise.resolve().then(() => {
console.log(2);
setTimeout(() => console.log(3));
Promise.resolve().then(() => console.log(4));
});
});
Promise.resolve().then(() => console.log(5));
}).then(() => {
console.log(6);
Promise.resolve().then(() => console.log(7));
setTimeout(() => console.log(8));
});
console.log(9);
})();
简单版理解
- js的执行顺序，先同步后异步
- 异步中任务队列的执行顺序： 先微任务
microtask队列，再宏任务macrotask队列
3.调用
Promise中的resolve，reject属于微任务队列，setTimeout属于宏任务队列
解释如下：【同步>异步；微任务>宏任务】
第一步：打印出1、9 ；如图：
图a.png
由图a中的任务队列可知：
第二步： 执行微任务3，打印出 5；
第三步：执行宏任务1，打印出 0，
第四步：开始执行宏任务2；如图：
图b.png
第五步：由图b中的任务队列可知， 执行微任务4，打印出 6，如图：
图c.png
第六步：由图c中的任务队列可知， 执行微任务5，打印出2；如图：
图d.png
由图d的任务队列可知，
第七步：执行微任务6，打印出7；
第八步：执行微任务9，打印出4；
第九步：执行宏任务7，打印出8；
第十步：执行宏任务8，打印出3；
所以最终结果为：
1、9、5、0、6、2、7、4、8、3
深入理解【参考】
https://blog.csdn.net/qingwenxiutong/article/details/52397676
后记
回到最开头，那顿饭，emmmmmmmmm，我并没有吃上，当时看到这题就懵逼了。如果当初的我可以找到像我这篇这么完美的文章，我一定吃他个十碗饭，使无人敢再出题。
后后记
如果有帮到你，就点个小爱心吧 (╹▽╹)
