JavaScript中的setTimeout函数不会以正确的时间间隔输出数字

我不理解为什么此函数按照预期的顺序输出1-5，但是以1秒为间隔而不是1,2,3等。seconds 。我不熟悉setTimeout函数，我知道这里有一些我没有看到的函数参数。JavaScript中的setTimeout函数不会以正确的时间间隔输出数字

var counter = function() { 
    for (var i = 1; i <= 5; i++) { 
    (function(x){ 
     setTimeout(function timer() { 
      console.log(x); 
     }, (x * 1000)); 
    })(i); 
    } 
};

来源

2015-07-11 R678

这是因为所有的在同一时间5'setTimeout'得到触发，但具有不同的延迟。所以，因为他们等了1 - 5秒，他们会在彼此之后发生一秒钟。 – putvande

您可以通过递归调用它来避免for循环，只需传递start和stop索引即可。

var counter = function (x, y) { 
    setTimeout(function timer() { 
     console.log(x); 
     if (x != y) counter((x + 1),y); 
    }, (x * 1000)); 
}; 

counter(1, 5);

Fiddle demo

来源

2015-07-11 21:09:49

所有的答案都很好，我明白以前的答案直接回答了这个问题，但我很欣赏这个演示。 – R678

因为您立即将所有电话都拨打至setTimeout。因此，在同一事件期间，JS接收到指令timer：1000ms后，2000ms后，3000ms后，4000ms后和5000ms后。这正是它所做的，所以每1秒调用一次timer。

如果您希望逐步增加间隔，则应将循环重写为递归循环，其中setTimeout的下一个呼叫由timer执行。

来源

2015-07-11 21:02:00 Yoric

由于@putvande表示您将以不同的时间间隔同时设置所有5个超时。

var counter = function(){ 
    for (var i=1; i<=5; i++) { 
    console.log('setting timer for ' + i); 
    (function(x){ 
     setTimeout(function timer(){ 
     console.log(x); 
    }, (x*1000)); 
    })(i); 
    } 
}; 

counter();

一个额外的日志语句显示这一点。您的定时器正在以正确的间隔点燃，第一个在1秒，第二个在2秒等。

来源

2015-07-11 21:03:15 lostintranslation

JavaScript中的setTimeout函数不会以正确的时间间隔输出数字

回答

相关问题