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实际上等待1的setTimeout完全执行。

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时，它会在1ms之后调用它。 Javascript不会忽略setTimeout中的值1，但可以忽略0。

postMessage是代替setTimeout到0的最佳方式。

当你使用这个小的时间差（一个值为零）时，还有一件事，那么有时它会根据代码中的顺序执行函数。

要检查，您可以在setTimeout值1功能之前将setTimeout值设置为0。它将首先运行setTimeout值0，然后运行setTimeout值1。

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

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

1 个答案: