1

我有这样的功能设置

awesomeFirePenguin: function(){
   // function does some stuff, not important
},

我在这样的for循环中调用它

for (var i = 0; i < n; i++){
   this.awesomeFirePenguin();           
}

这行得通,该函数被调用n次数,但该函数的结果会立即显示。我想要的是结果显示在一个轻微的延迟之后,比如 100 毫秒左右。像这样的东西

for (var i = 0; i < n; i++){
   this.awesomeFirePenguin(); 
   // wait a while and then continue    
}

我尝试使用

for (var i = 0; i < n; i++){
    window.setTimeout(this.awesomeFirePenguin(), 100);
}

window.setInterval(this.awesomeFirePenguin(), 100);,但两者都只执行一次函数。

4

2 回答 2

3

setTimeout并且setInterval可以将函数作为参数,但您所做的是调用它们。因此,他们接收的不是函数,而是它的返回值作为参数。

如果您想延迟堆叠,您可以将超时延迟乘以您当前所在的任何循环索引。

for (var i = 0; i < n; i++){
    window.setTimeout(this.awesomeFirePenguin.bind(this), 100 * i);
}
于 2013-07-24T18:04:09.693 回答
2

voithos的答案可能是最简单的。您还可以使用Clumpy.js 之类的异步执行库,您可以在其中将代码编写为:

var clumpy = new Clumpy({delay: 100});
var i;
clumpy.for_loop(
    function() { i = 0; },
    function() { return i < n; },
    function() { ++i; },
    this.awesomeFirePenguin
);

也可以使用闭包和自调用函数来做到这一点,但这是很难理解的丑陋代码:

(function loop(i, f) {
   setTimeout(function () {
      f();
      if (--i) loop(i, f);
   }, 100)
}(n, this.awesomeFirePenguin));

可以使用setInterval代替来编写一些东西setTimeout,但它并不容易理解,尽管它可能消除了递归调用。

于 2013-07-24T18:19:39.537 回答