JavaScript中的eventloop，为什么setTimeout中的行为不一致

Question

我试图找出为什么这两个脚本的行为不同：

在第一种情况下，第一个函数的setTimeout为10毫秒。

这可以确保我的第二个函数（其setTimeout为0毫秒）首先执行：

 setTimeout(()=> { for(var x = 0; x < 1000000000; x ++) { Math.pow(32, 13); // time consuming operation if (x == 999999999) console.log('bla') } }, 10); setTimeout(()=> { console.log('test') }, 0); 

在秒示例中，我具有完全相同的功能，但setTimeout为1和0，而不是10和0。

与第一个片段不同，在第一个片段中，首先执行0的超时，而setTimeout的0实际上等待setTimeout的1完全执行。

 setTimeout(()=> { for(var x = 0; x < 1000000000; x ++) { Math.pow(32, 13); // time consuming operation if (x == 999999999) console.log('bla') } }, 1); setTimeout(()=> { console.log('test') }, 0); 

这意味着第一个函数的输出为：

测试

BLA

而第二个输出是

BLA

测试

是什么原因导致这种情况发生？

Answer 1

setTimeout函数的延迟值固定不变，这意味着将忽略0并将其设置为最小值（通常为4ms或10ms，具体取决于浏览器）。 此外，如果选项卡处于非活动状态，则超时可能会进一步延迟。

但是，当您给定setTimeout值1时，它将在1毫秒后调用它。 JavaScript不会忽略setTimeout值1，但可以忽略0。

postMessage是代替setTimeout为0的最佳方法。

当您使用这种小的时间差（一个值是零）时，还有一件事情，然后有时它会根据它们在代码中的顺序执行该函数。

为了进行检查，您可以将setTimeout值0放在setTimeout值1函数之前。 它将首先运行setTimeout值0，然后运行setTimeout值1。

有关4ms钳位详细信息的参考，您可以查看此https://developer.mozilla.org/zh-CN/docs/Web/API/WindowTimers/setTimeout#Reasons_for_delays_longer_than_specified