在循环中调用setTimeout函数

Question

我是javascript的新手，我试图在for循环中使用setTimeout调用函数。 循环为nodeList的每个成员执行。

我发现我用setTimeout调用的函数实际上只是在循环的最后一次迭代中执行。 在下面的例子中，我想对setTimeout进行三次单独的调用，但我发现前两个调用被忽略了。

function moveants(e, stepdistance) {

    . . . . .

    for(var i = 0; i < 3; i++)
    {
        var nextAnt = antgroup.childNodes[i]
        nextAnt.count = 0;
        nextAnt.member = i;
        setTimeout(function () { takeStep(nextAnt, mouseclickX, mouseclickY, 10) }, 0);
    }
}

function takeStep(ant, destX, destY, stepDistance) {

    . . . .

    . . . .

    if( condition )
    {
        return;
    }
    else
    {
        takeStep(ant, destX, destY, stepDistance);
    }
}

我看过其他帖子描述了多次调用setTimeout。 令人惊讶的是（对我来说），如果我简单地将它们从这样的for循环中取出，那么多个调用将会起作用。

    setTimeout(function () { takeStep(antgroup.childNodes[0], 
         mouseclickX, mouseclickY, 10) }, 10);
    setTimeout(function () { takeStep(antgroup.childNodes[1], 
         mouseclickX, mouseclickY, 10) }, 10);
    setTimeout(function () { takeStep(antgroup.childNodes[2], 
         mouseclickX, mouseclickY, 10) }, 10);

我无法弄清楚为什么在for循环中调用它们并在一个循环之外调用它们之间存在差异。

我在每种情况下都从setInterval调用中获得有效的返回值..只是只有for循环的最后一次迭代才能实际执行该函数。

在此先感谢您的帮助。

Answer 1

nextAnt将在每个循环中被覆盖，因此takeStep（）将被调用3次，但始终使用相同的参数。

您可以尝试这样做：

(function(a,b,c){
     setTimeout(function(){
                           takeStep(a,b,c,10)}, 0);
      })(nextAnt, mouseclickX, mouseclickY);

Answer 2

如果你没有设置延迟，那么为什么还要烦扰setTimeout？

在循环中，你的延迟设置为0，在你使用过的循环之外10.此外，在循环外你已经为count和member赋值，但不在循环之外？

尝试这个：

function moveants(e, stepdistance)
{
    for (var i = 0; i < 3; i++)
    {
        setTimeout("takeStep(antgroup.childNodes[i], mouseclickX, mouseclickY, 10)", 0);
    }
}

或这个：

function moveants(e, stepdistance)
{
    for (var i = 0; i < 3; i++)
    {
        takeStep(antgroup.childNodes[i], mouseclickX, mouseclickY, 10);
    }
}