之前在面试过程中，有小伙们在写笔试题的时候遇到了一道代码阅读题，如下
[JavaScript]
纯文本查看
复制代码
01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 | //主线程直接执行console.log('1');//丢到宏事件队列中setTimeout(function() { console.log('2'); process.nextTick(function() { console.log('3'); }) new Promise(function(resolve) { console.log('4'); resolve(); }).then(function() { console.log('5') })})//微事件1process.nextTick(function() { console.log('6');})//主线程直接执行new Promise(function(resolve) { console.log('7'); resolve();}).then(function() { //微事件2 console.log('8')})//丢到宏事件队列中setTimeout(function() { console.log('9'); process.nextTick(function() { console.log('10'); }) new Promise(function(resolve) { console.log('11'); resolve(); }).then(function() { console.log('12') })}) |
这道题目就是主要考察的是面试者对宏任务和微任务的理解，以及执行顺序的阅读能力
针对这到代码阅读题，代码的执行顺序如下：
• 首先浏览器执行js进入第一个宏任务进入主线程, 直接打印console.log('1')
• 遇到 setTimeout 分发到宏任务Event Queue中
• 遇到 process.nextTick 丢到微任务Event Queue中
• 遇到 Promise， new Promise 直接执行 输出 console.log('7');
• 执行then 被分发到微任务Event Queue中
•第一轮宏任务执行结束，开始执行微任务 打印 6,8
•第一轮微任务执行完毕，执行第二轮宏事件，执行setTimeout
•先执行主线程宏任务，在执行微任务，打印'2,4,3,5'
•在执行第二个setTimeout,同理打印 ‘9,11,10,12’
•整段代码，共进行了三次事件循环，完整的输出为1，7，6，8，2，4，3，5，9，11，10，12。
