返回

深入剖析 setTimeout 的最小延时谜团：探寻源码揭秘

前端

在 JavaScript 的广袤天地中，setTimeout 闪耀着不可忽视的光芒，它赋予开发者延迟执行代码的超能力。然而，在 setTimeout 的背后，隐藏着一个令人困惑的谜团：它的最小延时究竟是多少？

为了解开这个谜团，我们必须踏入 JavaScript 引擎的神秘世界，审视 setTimeout 的源码。在 Chrome 浏览器中，setTimeout 的实现位于 V8 引擎的 v8/src/builtins/builtins-promise.cc 文件中。

// ... 代码片段省略 ...

// setTimeout 的 C++ 实现
Handle<Object> FastNewTimeout(Isolate* isolate, Handle<Function> callback,
                           double delay) {
  // ... 代码片段省略 ...
}

这段代码揭示了一个关键细节：setTimeout 的 delay 参数是一个 double 类型的值，这意味着它可以表示浮点数。然而，计算机在处理浮点数时存在精度限制，因此即使我们指定了一个微小的 delay 值，在实际执行时也可能存在误差。

最小延时的不确定性

为了证实这一推测，让我们进行一个简单的实验。我们将创建一个 setTimeout 并在其中打印当前时间戳：

console.log("开始时间：", Date.now());

setTimeout(() => {
  console.log("结束时间：", Date.now());
}, 1);

运行这段代码后，我们可能会看到如下输出：

开始时间：1677689844384
结束时间：1677689844400

尽管我们设置的延时为 1 毫秒，但实际的延时却超过了 15 毫秒。这种差异正是由于浮点数精度限制造成的。

如何解决

对于大多数情况，这种延时差异可以忽略不计。然而，在需要精确计时的情况下，我们需要采取额外的措施。一种方法是使用 performance.now() 来获取更精确的时间戳，如下所示：

console.log("开始时间：", performance.now());

setTimeout(() => {
  console.log("结束时间：", performance.now());
}, 1);

在某些情况下，使用 Web Workers 也可以提高定时器的准确性，因为它们在单独的线程中运行，不受主线程中其他脚本的影响。

结论

虽然 setTimeout 是一个强大的工具，但了解其最小延时的不确定性至关重要。通过深入探索其源码，我们揭示了计算机处理浮点数时的精度限制。对于要求精确计时的情况，可以使用性能 API 或 Web Workers 来提高准确性。