如何在while循環中使setTimeout在JavaScript中按順序執行？

Question

如何在循環執行時順序執行以下簡單操作？

var x = 2;
var y = 10;
while (x<y) {
  x = x+2;
  setTimeout(function(){ y = y+1;
  }, 500);
}

Answer 1

請改用setInterval() 。

setTimeout在超時時執行一次該函數。 setInterval在on和interval上重復執行該函數

資源

要停止間隔，請使用clearInterval()

例：

var x = 2,
    y = 10;
var loop = setInterval(function(){ 
    if(x<y) {
        x = x+2;
        y++;
    } else {
        clearInterval(loop);
    }
}, 500);

Answer 2

如果你期望的是做x = x + 2; y = y + 1; x = x + 2; y = y + 1; 在每次迭代中直到x >= y然后你可以這樣做：

 var x = 2; var y = 10; var func = function() { // While x is still smaller than y if (x < y) { x = x + 2; y = y + 1; console.log(x, y); // Register a timer to call self after 500ms if we still to loop. setTimeout(func, 500); } }; // Manually start the function. func(); 

setTimeout和setInterval之間的差異是：

您需要在回調中調用setTimeout以使其循環，直到它滿足停止條件。 雖然setInterval只需要調用一次，但您可能必須使用clearInterval來阻止它繼續調用callback 。