为什么我的循环不在迭代之间等待?的setTimeout()

时间:2016-02-19 17:03:38

标签: javascript jquery loops

我正在使用jquery构建一个Simon说游戏http://codepen.io/meek/pen/adrbOv,我在逐个播放每个声音时遇到了一些麻烦。

当游戏开始时,会生成20个声音(“移动”)的列表,每个回合将逐个播放。因此,如果移动列表是['红色','黄色','绿色'],则轮流将播放一个'红色',轮流播放两个'红色'和'黄色'将播放,依此类推。

我已经将转弯设置为4并且我试图让每个声音一个接一个地播放,直到播放4个声音。我正在使用此代码:

turn = 4;
var t = 1;
  while(t <= turn) {
    setTimeout(AIbutton(allMoves[t-1]), 1000);
    t++;
  }

AIbutton()是播放声音的功能(模拟按下按钮),allMoves是整个游戏中将播放的20个动作的列表。我想要它发生的是在进行下一次迭代之前在循环的每次迭代中播放声音,但是发生的是循环中的所有声音在1000 ms的间隔之后同时迭代播放

我认为setTimeout会在迭代之间暂停吗?我怎样才能做到这一点?

1 个答案:

答案 0 :(得分:5)

setTimeout异步运行,它没有阻塞。如果你想等待超时结束,那么下一个&#34;循环迭代&#34;需要在你给setTimeout的函数回调中发生。

这样的事情会起作用:

turn = 4;
var t = 1;
ourTimeout(allMovies, turn, t);

function ourTimeout(allMovies, turn, t){
    AIbutton(allMoves[t-1]);
    if(t <= turn)
        setTimeout(ourTimeout(allMovies, turn, ++t), 1000);
}

@Alnitak提到这行代码:

setTimeout(ourTimeout(allMovies, turn, ++t), 1000);`

需要更改为:

setTimeout(function(){
        ourTimeout(allMovies, turn, ++t);
    }, 1000);

正如@Alnitak所述,您只能将anonoymous或named函数传递给setTimeout。传递变量的技巧是在上面提到的变化时完成的(概念称为闭包)。