在研究“您不了解JS”的异步和性能时,我尝试了以下小代码段:

var t = [];
var c = 1;

function foo() {
  t.push((performance.now()).toString());
  if (c < 50) {
    setTimeout(foo, 0);
    c++;
  }
}


头几次,浏览器(我使用chrome)调用4ms的时间少于foo。后来花了比4ms多一点。



我想问一下,尽管在创建任务时被setTimeout()表示,为什么它在开始的3-4次中表现像微任务?

请帮我,
谢谢。

最佳答案

为了回答这个问题,setTimeout()是使用the message queue的示例。微任务是在每个函数运行之后,消息队列开始之前发生的任何事情。微任务队列实际上是es6 job queue,但是自v8起它被赋予了新的名称。

仅仅因为4ms下的任务并不能使它成为微任务。我有一个示例,其中第二个示例采用了5ms

javascript - 浏览器时间只需不到4毫秒即可执行setTimeout()的前几次-LMLPHP

您发现有趣趋势的原因很可能是Chrome优化。前几个调用几乎是立即完成的,并且随着调用堆栈的增加,它会更深入地挖掘以获取更多的RAM。

if (c < 50) {
  setTimeout(foo, 10);
  c++;
}


如果您尝试上述片段,您会发现时间戳更加一致。这是因为将以更规则的间隔添加调用堆栈。

10-06 00:09