如何建立避免漂移的準確 JavaScript 計時器？

創建準確的 JavaScript 計時器

計時器在 JavaScript 中調度任務和實現實時功能方面發揮著至關重要的作用。然而，由於 JavaScript 執行的非同步特性，確保計時器的準確性可能具有挑戰性。

setInterval/setTimeout 不準確

您提供的程式碼片段利用 setInterval 函數每隔一段時間遞增一個計數器第二。然而，您觀察到，3600 秒後，計數器僅達到約 3500 秒。這是因為 setInterval 和 setTimeout 本質上並不準確。隨著時間的推移，它們很容易出現延遲和漂移。

使用 Date 物件精確計時

要建立準確的計時器，建議使用 Date 物件。 Date 物件可讓您取得毫秒精確度的目前時間。您可以將計時器的邏輯基於當前時間和開始時間之間的差異，如下所示：

var start = Date.now();
setInterval(function() {
    var delta = Date.now() - start; // milliseconds elapsed since start
    ...
    output(Math.floor(delta / 1000)); // in seconds
}, 1000); // update about every second

自調整計時器

適用於需要恆定間隔而不漂移的計時器應用程序，自調節定時器是更好的選擇。它們根據實際經過的時間動態調整超時之間的延遲。此方法可確保計時器保持在正軌上：

var interval = 1000; // ms
var expected = Date.now() + interval;
setTimeout(step, interval);
function step() {
    var dt = Date.now() - expected; // the drift (positive for overshooting)
    ... // do what is to be done
    expected += interval;
    setTimeout(step, Math.max(0, interval - dt)); // take into account drift
}

以上是如何建立避免漂移的準確 JavaScript 計時器？的詳細內容。更多資訊請關注PHP中文網其他相關文章！