宏任务队列和微任务队列优先级

Question

与macrotask和microtask macrotask队列的这种描述有点混淆。

对于“事件循环”的每个循环，从宏任务队列中完成一个宏任务。 宏任务完成后，事件循环访问微任务队列。 整个微任务队列在继续之前完成。

 setTimeout(function() { console.log('macrotask'); }, 0); Promise.resolve().then(function() { console.log('microtask 1'); }).then(function() { console.log('microtask 2'); });

这段代码不应该先输出'macrotask'吗？ 因为 setTimeout 是在循环进入微任务队列之前完成的宏任务队列的一部分？

Answer 1

在执行任何 JS 文件时，JS 引擎将内容包装在一个函数中，并将该函数与启动或启动事件相关联。 JS 引擎发出开始事件，这些事件被添加到任务队列中（作为一个宏任务）。

初始化时，JS 引擎首先拉出宏任务队列中的第一个任务并执行回调处理程序。 这样，我们的代码就运行起来了。

所以我们看到运行的脚本是第一个排队的macrotask 。 所以首先 JSEngine 将脚本中的所有同步代码作为macrotask到事件循环队列中。 然后它看到setTimeout这是另一个macrotask因此它被记录在事件循环队列中的一个单独任务中。 然后它看到 Promise 是一个microtask ，并将其添加到微任务队列中。

只要没有其他 JavaScript 在执行中间和每个任务结束，微任务队列就会在回调之后处理。

所以任务队列的顺序，在这种情况下，是Script=>Promise1=>Promise2=>setTimeout

由于脚本中没有同步代码，因此脚本的执行不会打印任何内容。 然后引擎执行微任务队列（promise-1，promise-2），最后是setTimeout宏任务。

注意：- 这是默认行为，在不同的浏览器中可能会有所不同。

Answer 2

您的代码正在运行的macrotask实际上是一个macrotask 。

完成后（这意味着评估并运行代码）事件循环将执行队列中的微任务。 这是第一个承诺，但是这个承诺为微任务q增加了另一个承诺，并且执行了第二个承诺。

在微任务q被清除之后，挑选另一个宏任务，并最终执行timeout 。