javascript - 循环动力学 javascript 一个接一个地转换而不是一次全部转换

Question

我想在 html5 canvas 中将多个转换一个接一个地排队。 循环转换函数会立即调用所有转换。我不知道如果迭代次数超过 100 次，回调是否会执行此操作。 我想做这样的事情:--

for(i=0;i<10;i++) { 移动(圆,Math.floor(Math.random()*1000),400); }

move 是我定义的函数，它可以进行一些转换。它工作得很好。

在这里，我希望圆圈在每次迭代时都改变其位置，但它只改变一次位置。

Answer 1

你可以这样做:

var i=10;
var interval = window.setInterval(function(){
    move(circle,Math.floor(Math.random()*1000), 400);
    console.log(i);
    if(!--i) {
        window.clearInterval(interval);
    }
}, 400); // wait 400 msecs between calls

或者，如果您的移动函数愿意在转换完成后调用回调函数:

var i=10;
var callback = function(){
    if(i--){
        move(circle,Math.floor(Math.random()*1000),400, callback);
    }
}
callback();