我該如何使用setTimeout？

Question

我有這個循環。當我嘗試通過i和setTimeout時，我在每個循環中得到相同的結果「i的最終結果」。

for(var i = 0; i < step.length; i++ ){ 

     setTimeout(function( ){ 

      insideJMove.doMove(i); 

     } , 1000); 

    } 

我怎樣才能進去setTimeout在每個週期的i不同的價值？

Answer 1

有兩種方法可以解決這個問題。發生這種情況是因爲使用var定義的變量範圍是其當前的執行上下文。使i成爲一個全局變量，將在您的循環中重用。

使用let關鍵字：

[讓]按預期工作，是因爲[for循環]的（匿名）內部函數的實例是指該變量的不同實例我

這是因爲：

用let聲明的變量具有如它們的範圍中定義它們的塊，以及在任何包含的子塊

for(let i = 0; i < step.length; i++ ){ 

    setTimeout(function( ){ 

     insideJMove.doMove(i); 

    } , 1000); 

} 

或立即調用函數表達式

這將創建一個新的執行上下文，其中作爲任何執行該功能的表達時，它是的i住宿的值。

for(var i = 0; i < step.length; i++ ){ 
    (function(i){ 
     setTimeout(function( ){ 

      insideJMove.doMove(i); 

     } , 1000); 
    })(i); 

} 

Answer 2

使用let代替var：

for (let i = 0; i < step.length; i++) { 
    setTimeout(function() { 
    insideJMove.doMove(i); 
    } , 1000);  
} 

見What's the difference between using "let" and "var" to declare a variable?。

Answer 3

的setTimeout運行異步的循環也就結束了的時候它會先打電話setTimeout的，所以變量i將有它在循環最後一個值。

One解決方案是使用遞歸：

var i=0; 
function loop(){ 

    insideJMove.doMove(i); 

    if (i<step.length) 
    setTimeout(loop,1000); 

    i++; 
} 

loop();//start our loop