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函數不會以正確的時間間隔輸出數字

回答

相關問題