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/

Answer 2

最准确的计时器是两个时间戳的比较。您可以通过更频繁地更新（例如每100毫秒）来提高计时器的精度。我更喜欢使用setInterval()而不是setTimeout()。

JavaScript：这个计时器可靠吗？

2 个答案: