JavaScript:这个计时器可靠吗？

Question

今天我被介绍到 JavaScript 中的 Web Workers 世界。这让我重新考虑了定时器。我曾经像这样以丑陋的方式对计时器进行编程。

var time = -1;
function timerTick()
{
    time++;
    setTimeout("timerTick()",1000);
    $("#timeI").html(time);
}

我知道这可以通过在启动计时器时保存日期来改进，但我从来都不喜欢这样做。

现在我想到了一种使用 Web Workers 的方法，我做了一些基准测试，发现它更加可靠。由于我不是 JavaScript 专家，我想知道这个函数是否正常工作或者它可能有什么问题提前感谢。

我的 JavaScript 代码(请注意我使用的是 JQuery):

$(function() {
    //-- Timer using web worker. 
    var worker = new Worker('scripts/task.js'); //External script
    worker.onmessage = function(event) {    //Method called by external script
        $("#timeR").html(event.data)
    };
};

外部脚本('scripts/task.js'):

var time = -1;
function timerTick()
{
    time++;
    setTimeout("timerTick()",1000);
    postMessage(time);
}
timerTick();

您还可以在 my website 上观看现场演示.

Answer 1

如果您试图可靠地显示秒数，那么唯一可靠的方法是在开始时获取当前时间并仅使用计时器来更新屏幕。在每个滴答声中，您都会获得当前时间，计算实际经过的秒数并显示出来。 setTimeout() 和 setInterval() 都不能保证或不能用于准确计算时间。

你可以这样做:

var start = +(new Date);
setInterval(function() {
    var now = +(new Date);
    document.getElementById("time").innerHTML = Math.round((now - start)/1000);
}, 1000);

如果浏览器变得繁忙并且计时器间隔不规律，您可能会在屏幕上看到稍微不规则的更新，但耗时在屏幕更新时将保持准确。您的方法很容易在耗时内累积误差。

您可以在这里看到这项工作:http://jsfiddle.net/jfriend00/Gfwze/