基于Javascript的系统时钟定时器

我正在尝试使用系统时钟用Javascript制作一个简单的动画。我想循环一个数组，以便以

500ms的间隔调用
[0]、[1]、[2]…
。使用上一篇文章中的一个示例，我正在试验以下代码片段：

function timer(time,update,complete) {
    var start = new Date().getTime();
    var interval = setInterval(function() {
        var now = (time*1000)-(new Date().getTime()-start);
        if( now <= 0) {
            clearInterval(interval);
            complete();
        }
        else update(Math.floor(now/1000));
    },500); // the smaller this number, the more accurate the timer will be
}

这将产生，
0,1,2,3，“计时器完成”
。但是，我不知道如何以500毫秒的间隔调用它。我尝试过调整数字，但我意识到我并不完全理解这个函数是如何工作的。是否可以对此进行调整，或者是否有一些硬编码的浏览器功能在1s间隔内被调用

我尝试将所有值更改为以下值：

function timer(time,update,complete) {
    var start = new Date().getTime();
    var interval = setInterval(function() {
        var now = (time*500)-(new Date().getTime()-start);
        if( now <= 0) {
            clearInterval(interval);
            complete();
        }
        else update(Math.floor(now/500));
    },500); // the smaller this number, the more accurate the timer will be
}

timer(
    5, // seconds
    function(timeleft) { // called every step to update the visible countdown        
        console.log(5 - timeleft );
    },
    function() { // what to do after
        console.log("Timer complete!");
    }
);

我认为是500毫秒的间隔，但我不确定。更改
5-timeleft
中的
5
值也会对其运行速度产生奇怪的影响。
我认为您将其过度复杂化了。如果您只想每隔500毫秒显示一个数组中的每个项目，请使用常规计数器，而不是时间戳和舍入：

function timer(myArray) {
    var counter = 0;
    var interval = setInterval(function() {

        // There are still items we want to display
        if(counter < myArray.length) {
            console.log(myArray[counter]);

        // We have displayed all 
        } else {
            console.log('Finished');
            clearInterval(interval);
        }

        // Increment counter
        counter++;

    }, 500); // 500 here is the interval in msec
}

var arr = ['Item 0', 'Item 1', 'Item 2', 'Item 3'];
timer(arr);

函数计时器（myArray）{
var计数器=0；
var interval=setInterval（函数（）{
//我们仍有要展示的项目
if（计数器

我看到的控制台输出是（请参阅）。所以它从-1开始，然后记录从0到3的每个数字两次，然后是3，然后结束。似乎以500毫秒的速度运行，但您的数学运算使其输出了两次某些值。奇怪的是，可能我遗漏了一些内容，但我得到了输出
0 1 2 3计时器完成（没有'2'说输出重复）您链接的问题上的代码似乎是您想要的；你为什么要修改它？您试图实现的与实际不同之处是什么？我不知道如何将计时器间隔设置为
500ms
，只需将原始代码中的100更改为500。谢谢您的帮助。我之所以想使用时间戳，是为了确保如果某个东西需要很长时间才能呈现，它不会通过后续时间（这是我迄今为止的经验）。JavaScript计时器不精确，你是对的。但我不明白你到底想干什么。
2
3
4
5
Timer complete!

function timer(myArray) {
    var counter = 0;
    var interval = setInterval(function() {

        // There are still items we want to display
        if(counter < myArray.length) {
            console.log(myArray[counter]);

        // We have displayed all 
        } else {
            console.log('Finished');
            clearInterval(interval);
        }

        // Increment counter
        counter++;

    }, 500); // 500 here is the interval in msec
}

var arr = ['Item 0', 'Item 1', 'Item 2', 'Item 3'];
timer(arr);