将函数传递给循环中的setTimeout:总是最后一个值?

时间:2011-06-21 12:15:16

标签: javascript settimeout

我正在尝试使用setTimeout来执行我传递信息的匿名函数,但我遇到了麻烦。这个(硬编码版本)可以正常工作:

setTimeout(function(){alert("hello");},1000);
setTimeout(function(){alert("world");},2000);

但是我试图从一个数组中获取hello和world并将它们传递给函数而不使用(a)使用全局变量,以及(2)使用eval。我知道如何使用全局或eval来做到这一点,但是如何在没有它的情况下做到这一点。这是我想要做的(但我知道它不会起作用):

var strings = [ "hello", "world" ];
var delay = 1000;
for(var i=0;i<strings.length;i++) {
    setTimeout( function(){alert(strings[i]);}, delay);
    delay += 1000;
}

当然,字符串[i]将脱离上下文。如何在没有eval或globals的情况下将字符串[i]传递给该匿名函数?

5 个答案:

答案 0 :(得分:30)

这是经常重复的“如何在闭包中使用循环变量”问题。

规范解决方案是调用一个函数,该函数返回一个绑定到循环变量当前值的函数:

var strings = [ "hello", "world" ];
var delay = 1000;
for(var i=0;i<strings.length;i++) {
    setTimeout(
        (function(s) {
            return function() {
                alert(s);
            }
        })(strings[i]), delay);
    delay += 1000;
}

外部定义function(s) { ... }创建一个新范围,其中s绑定到所提供参数的当前值 - 即strings[i] - 内部可用的范围。

答案 1 :(得分:28)

只需在setTimeout调用周围添加一个范围:

var strings = [ "hello", "world" ];
var delay = 1000;
for(var i=0;i<strings.length;i++) {
    (function(s){
        setTimeout( function(){alert(s);}, delay);
    })(strings[i]);
    delay += 1000;
}

答案 2 :(得分:15)

您可以编写一个单独的函数来设置超时:

function doTimer(str, delay) {
  setTimeout(function() { alert(str); }, delay);
}

然后从循环中调用它:

var delay = 1000;
for(var i=0;i<strings.length;i++) {
    doTimer(strings[i], delay);
    delay += 1000;
}

答案 3 :(得分:0)

虽然不像其他一些答案那样向后兼容,但我想我会提出另一种选择..这一次使用bind()

var strings = [ "hello", "world" ];
var delay = 1000;
for(var i=0;i<strings.length;i++) {
    setTimeout(alert.bind(this, strings[i]), delay);
    delay += 1000;
}

View demo of it in action

答案 4 :(得分:-6)

var strings = [ "hello", "world" ];
var delay = 1000;
for(var i=0;i<strings.length;i++) {
    setTimeout( new Function('alert(strings[i]);'), delay);
    delay += 1000;
}