用setTimeout做while循环导致无限循环

时间:2016-01-04 22:07:50

标签: javascript settimeout do-while

我正在开发一款西蒙游戏(你遵循颜色模式)。它通过计算机第一次转弯和我的第一次转弯,但尝试在每个计算机选择之间执行setTimeout导致使用do while语句的无限循环或者如果我使用for循环同时播放两个选项。 highlightDiv函数只在div上执行toggleClass,然后使用setTimeout将类重新切换回来。 audioStart函数使用switch语句来确定要播放的声音,然后使用setTimeout半秒来播放该声音。我认为这个增量上的setTimeout会在它增加之前为这两件事发生足够的时间,然后在computerChoice数组中执行下一个索引。如果这更容易,这就是codepen:http://codepen.io/RawleJuglal/pen/pgRVKd

var computerChoice = ["red", "yellow"],index=0;

function computerPattern(cPattern, index){
 console.log("Entered computer pattern function");
 console.log("This is cPattern");
 console.log(cPattern);
 console.log("This is index: "+ index);
 if(index !== cPattern.length)
   {
     highlightDiv(cPattern[index]);
     audioStart(cPattern[index]);
     index++;
     computerPattern(cPattern, index);
   }
 else
   {
     index=0;
   }
 console.log("Leaving computerPattern function");
}

computerPattern(computerChoice, index);

3 个答案:

答案 0 :(得分:2)

您的超时功能永远不会被调用,因为您没有给它机会。只要您的代码正在运行(您的循环),浏览器就无法运行使用相同线程的预定脚本。您将不得不重新考虑代码。

答案 1 :(得分:2)

Javascript是单线程的,超时的概念意味着你将一个函数放在一个特殊的队列中,即在他们的时间到期时执行你的回调。现在,因为在你的代码中,i变量只在超时函数中更新,仅在3秒之后,这意味着循环体将一次又一次地运行,直到满足3秒。

在3秒内,javascript可以运行数千次迭代,每次迭代都会注册另一次超时,这意味着您的事件队列被炸毁,您的单个线程将很难完成所有这些任务,直到我最终到达{{1}如果有的话。

你的解决方案可能正在使用某种cPattern.length,其中有一个回调可以做你想要的,并停在一个每次递增的迭代变量上,让我们这样说:

setInterval

答案 2 :(得分:0)

您正在递送一个名为i的变量,该变量位于您传递给setTimeout的匿名函数委托中。 < - p>,永远不会更新do-while循环所依赖的本地范围变量i

根据您正在寻找的功能,您可以在变量i仍在范围内时递增它,然后使用闭包将其值的快照传递给setTimeout函数委托。

function run(){
  var i = 0
  do{
    (function(i){
      setTimeout(function(){
         alert(i);
      },1000);
    })(i++)
  }
  while(i < 2);
}
run();