设置超时运行速度很快

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

你似乎想要

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();

Answer 3

setTimeout(draw, 1000);

应该是：

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

这样创建的每次超时都会1s更长。

i + 1是第一次超时是1000，而不是0，因为i从0开始。