有没有一种优雅的方式来实现时钟更新事件？

Question

据我所知(并且我知道相对较少),例如秒针滴答时没有发出本机事件.我想出的最好的方法是反复检查Date对象(例如,每隔333ms;较短的间隔会导致更高的精度,但也会占用更多的资源).不知何故,如果我反复使用相同的Date对象,则时间不会更新

Date.prototype.getSeconds()

记录'NaN'虽然typeof是'number'.

    function clock(interval) {
    var d = new Date();
    var secondsOld = d.getSeconds();
    d = null;

    setInterval(function() {
        var d = new Date();
        var secondsNew = d.getSeconds();
        if ( secondsNew !== secondsOld ) {
            secondsOld = secondsNew;
            // trigger something
            console.log(secondsOld);
        }
        d = null;
    }, interval);
}

Answer 1

你没错,因为没有本地时钟滴答事件.我能解决这个问题的最精确的方法是使用setTimeout()和Date.now().

创建一个setTimeout()每秒调用的递归函数.确切地说,将超时设置为该函数调用的下一个确切秒数.这是一个例子.

// milliseconds per second
var SECOND = 1000;

function bindClockTick(callback) {
    function tick() {
        var now = Date.now();

        callback(now);

        setTimeout(tick, SECOND - (now % SECOND));
    }

    tick();
}

bindClockTick(function(ms) {
    console.log('tick! milliseconds: '+ ms);
});

这使用Date.now()而不是创建类的新实例Date.

这是一个测试精度的JSFiddle.该演示用于new Date()轻松显示当前时间,但只需几毫秒即可完成.

Answer 2

我不确定为什么您想要与确切的第二个更改同步；但是，我会这样做：

function clock() {
    var startMs = Date.now(),
        startSecs = Math.floor(startMs / 1000),
        firstOffset = 1000 - startMs % 1000;

    function tick () {
        var ms = Date.now(),
            secs = Math.floor(ms / 1000),
            dSecs = secs - startSecs;
        console.log(dSecs);
    }

    setTimeout(function () {
        tick();
        setInterval(tick, 1000);
    }, firstOffset);
    tick();
}
clock();

发生的情况如下：

1. 我用 Date.now() 获取当前时间（以毫秒为单位）
2. 我计算出距离下一秒刻度还有多少毫秒 ( firstOffset)
3. 我将初始值设置setTimeout为该偏移量，确保它将在下一秒刻度处触发。
4. 现在我们已经与第二个刻度同步了，setInterval1000 毫秒将继续每秒更新。