的setTimeout運行快速

Question

我有一個while循環調用函數每秒：

function draw(){ 
     console.log(then-now) 
    }; 
var i = 0 
while(i < 100){ 
    setTimeout(draw,1000) 
    i++; 
}; 

但這不是等待每個調用之間的第二畫畫，它是調用它的100倍一次。

Answer 1

嘗試setInterval：

function draw(){ 
    console.log(then-now) 
    i++; 
    if (i >= 100) clearInterval(interval); 
}; 
var i = 0 
var interval = setInterval(draw, 100); 

如果你想使用setTimeout，你必須從draw函數本身內部設置的下一次迭代。

function draw(){ 
    console.log(then-now) 
    i++; 
    if (i < 100) setTimeout(draw, 100); 
}; 
var i = 0; 
setTimeout(draw, 100); 

這是因爲setTimeout是異步的，所以你的while循環不會暫停 - 它一直走，幾乎瞬間發射的draw每個實例。

Answer 2

setTimeout(draw, 1000); 

應該是：

setTimeout(draw, 1000 * (i + 1)); 

這樣創建的每個超時1s更長。

的i + 1是使得第一超時是1000，而不是0，如在0i啓動。

Answer 3

你似乎想

while(i < 100){ 
    i++; 
    setTimeout(draw, i*1000); 
}; 

注意setTimeout時間表爲未來的任務，但不等待 - 它立即返回，使你的代碼異步的。

但是，一次排列100個任務並不是一個好習慣。更好：

var i = 0; 
function draw(){ 
    console.log(then-now) 
    if (i<100) { 
     i++; 
     setTimeout(draw, 1000); // maybe adjusted to actual time 
    } 
}; 
draw();