js宏任务顺序，两个脚本标签，第一个带有settimout，仍然在第二个脚本之后

Question

查看代码

<script>
console.log('first script')
setTimeout(() => {
console.log('settimout');
}, 0);
</script>
<script>
console.log('second script')
</script>

输出为

first script
second script
settimout

我的理解是一个宏然后所有可用的微。然后是第二个宏。

所以当js看到第一个脚本标签时，它将脚本添加到宏队列中，然后将第一项(第一个脚本标记)从队列中取出并运行。在第一个脚本中，它看到第一个日志，然后运行它。

然后它看到setTimeout，它是宏，所以把它添加到宏队列。

第一个标签完成。看看有没有微信号?不。然后运行第二个宏，即settimeout。

然后运行第二个脚本

所以我认为输出应该是

first script
settimout
second script

我错在哪里?

感谢您的帮助

Answer 1

首先，默认情况下，JavaScript没有setTimeout, fetch等web API功能，这些功能是内置在浏览器中的。JavaScript首先推动像控制台这样的JavaScript特性。登录调用栈，然后检查微任务队列和宏任务队列中是否有其他东西

setTimeout、setInterval等方法将默认添加到宏任务中。以同样的方式，fetch、promises等方法也会被添加到微任务队列中。

在这种情况下，首先Js引擎执行console.log('first script')并遇到setTimeout方法，setTimeout方法将被推送到宏任务队列，然后Js引擎继续执行console.log('second script')并执行它。Js引擎检查宏任务队列中是否有任何东西。由于setTimeout方法有一个宏任务队列，它将被添加到调用堆栈JavaScript引擎执行它。

因此，输出将是第一个脚本，第二个脚本，settimeout