Question

我尝试每隔2秒输出一个警告框，其中包含“hello”消息，但只有5次。所以我写了这段代码：

var counter = 1;

do {
    setTimeout
    (
        function()
        {
             alert("hello");
             counter++;
        },
        2000
    );
} while( counter <= 5 );

但我的页面每次都在崩溃？为什么？什么是在警报之间添加延迟2000毫秒的最佳方法？

Answer 1

但我的网页每次都会崩溃？为什么呢？

因为计数器仅在回调内递增 - 循环可能会尝试在该时间内运行数千次（如果不是数万次）并快速运行浏览器内存不足。更准确地说，正如评论中指出的那样，循环从不放弃对setTimeout调用的控制 - 因此永远不会被运行（不要过分担心这里的区别 - 只是接受你的计数器不是正在增加）

在警报之间添加延迟2000毫秒的最佳方法

仅在前一个完成时启动下一个。

function showHello(i){
  if(i<5){
    setTimeout
    (
        function()
        {
             alert("hello");
             showHello(i+1)
        },
        2000
    );
  }
}

showHello(0);

相关：Is it possible to chain setTimeout functions in Javascript?和how to make a setInterval stop after some time or after a number of actions?

Answer 2

改为使用setInterval：

var counter = 0; // setting the counter
var interval = setInterval(function(){ //setInterval does repeatedly what setTimeout only
                                       //does once
    counter++;
    if(counter === 5){
        clearInterval(interval); //if the counter reaches 5 (the times you asked
                                 //for repeating the alert box) you clear the interval,
                                 //stopping the loop
    }
    alert("hello");
}, 2000);

这是一个工作小提琴：https://jsfiddle.net/mwosm34x/

Answer 3

改为使用setInterval。

当计数器大于5时clearInterval()。

var counter = 1;

var timer = setInterval(function () {
  alert("hello "+counter);
  counter++;
  if (counter > 5) {
    clearInterval(timer);
  }
}, 2000);

do while循环中的setTimeout

3 个答案: