javascript - 在 setTimeout 函数方法中使用具有变化值的变量？

Question

如果我以错误的角度来到这个街区，请告诉我。我有一系列我想启动的功能，我希望能够将它们全部设置在一个循环中。

for(var jj = 0; jj<monster.frames.length;jj++){
    setTimeout(
        functionName(jj),
        1000*jj
    );
}

问题是，当执行时functionName(jj)，它被传递的值jj到那时已更改为最后一个循环迭代值。

Answer 1

您需要确保内部函数每次迭代都有一个新变量。最简单的方法是创建一个自执行匿名函数，该函数接收变量作为参数。您还需要修复调用函数的方式 - 现在您将返回值注册functionName(jj)为回调。仅当该函数实际返回一个函数时才可以。

for(var jj = 0; jj<monster.frames.length;jj++){
    (function(jj) {
        setTimeout(
            function() { functionName(jj); },
            1000*jj
        );
    })(jj);
}

您还可以使用部分应用程序来创建新功能。但是，旧浏览器不支持Function.prototype.bind，因此您必须为其添加 shim。

for(var jj = 0; jj<monster.frames.length; jj++){
    setTimeout(functionName.bind(this, jj), 1000*jj);
}

Answer 2

试一试：

for(var jj = 0; jj < monster.frames.length; jj++)
{
    (function(x)
    {
        setTimeout(function()
        {
            functionName(x)
        }, 1000 * x);
    })(jj);
}