logo标签列表

HTML中多个内联脚本的执行顺序？

javascript
3
为什么控制台顺序是2 3 1？ 每个脚本似乎都在等待Promise任务。
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <script>
      setTimeout(() => console.log(1), 0);
      Promise.resolve(2).then(console.log);
    </script>
    <script>
      console.log(3);
    </script>
  </head>
  <body></body>
</html>

我以为会是3 2 1，但显然我错了

为什么2会在3之前输出，Promise中的then回调将在下一个tick执行，而console.log(3)是同步任务。

1
最有意义的事情是解释为什么setTimeout不会像某些人期望的那样立即执行代码。根据mdn的说明，"如果省略此参数，则使用0值，表示立即执行，或更准确地说，下一个事件循环。" 在stackoverflow上可以找到更多相关细节。进一步扩展“下一个事件循环”的含义是，该函数将在当前脚本完成执行后立即排队执行。 - Diego D
1个回答
0
在宏任务中，事件循环包括渲染。你可以查看处理模型的标准。
所以顺序是： setTimeout => 微任务Promise => 渲染脚本 => setTimeout函数执行
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接