在循环中调用setTimeout函数 [英] Calling setTimeout function within a loop

问题描述

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

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

 函数moveants（e，stepdistance）{
 
。 。 。 。 。 
 
 for（var i = 0; i <3; i ++）
 {
 var nextAnt = antgroup.childNodes [i] 
 nextAnt.count = 0; 
 nextAnt.member = i; 
 setTimeout（function（）{ta​​keStep（nextAnt，mouseclickX，mouseclickY，10）}，0）; 
 
 
 
函数takeStep（ant，destX，destY，stepDistance）{
 
。 。 。 。 
 
。 。 。 。 
 
 if（condition）
 {
 return; 
} 
 else 
 {
 takeStep（ant，destX，destY，stepDistance）; 
 
 
 code 
 $ b我看过其他帖子，描述多次调用setTimeout。令人惊讶的是（对我来说），如果我简单地将它们从 循环中取出，那么多个调用将会起作用。 
 
 
  setTimeout（function（）{ta​​keStep（antgroup.childNodes [0]，
 mouseclickX，mouseclickY，10）}，10）; 
 setTimeout（function（）{ta​​keStep（antgroup.childNodes [1]，
 mouseclickX，mouseclickY，10）}，10）; 
 setTimeout（function（）{ta​​keStep（antgroup.childNodes [2]，
 mouseclickX，mouseclickY，10）}，10）; 
  
我只是不明白为什么在为循环，并在一个之外调用它们。 
 
 
 
在每种情况下，我都从setInterval调用中获得了有效的返回值。仅仅是 for 循环的最后一次迭代该函数实际执行。
 
 
在此先感谢您的任何帮助。  
 
解决方案
 < nextAnt将被覆盖在每一个循环，所以takeStep（）将被调用3次，但总是具有相同的参数。
 
 
你可以试试这个：
 （a，b，c）{
 setTimeout（function（）{
 takeStep（a，b，c）{
 
 $ b 
  b，c，10）}，0）; 
}）（nextAnt，mouseclickX，mouseclickY）; 
  
 
I'm new to javascript and am trying to call a function using setTimeout from within a for loop. The loop executes for each member of a nodeList.

I'm finding that the function I'm calling with setTimeout is only actually executing during the last iteration of the loop. In the example below, I would like to make three separate calls to setTimeout but I'm finding that the first two calls are ignored.
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);
    }
}
I have seen other posts that describe making multiple calls to setTimeout. Amazingly (to me), the multiple calls will work if I simply take them out of the for loop like this.
    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);
I just can't figure out why there is a difference between calling them from within a for loop and calling them outside of one. 

I am getting valid return values from the setInterval call in every case.. it's just that with only the last iteration of the for loop does the function actually execute.

Thanks in advance for any help.
解决方案
nextAnt will be overwritten on every loop, so takeStep() will be called 3 times, but always with the same arguments.

You may try this instead:
(function(a,b,c){
     setTimeout(function(){
                           takeStep(a,b,c,10)}, 0);
      })(nextAnt, mouseclickX, mouseclickY);


                        
这篇关于在循环中调用setTimeout函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！