javascript - 在进入下一次迭代之前暂停循环并等待事件

Question

这个问题已经有答案了:

How do I add a delay in a JavaScript loop? (33 个回答)

已关闭 3 年前。

全部:

我有一个循环，其中我有一个超时来尝试暂停迭代，而动画和声音在进入下一个迭代之前完成；但是；我发现当它遇到超时匿名函数并导致无限循环时， i 不会增加。这是代码:

var i = 0;

while (i < gamePattern.length - 1) {
  console.log(i);
  buttonAnimation(gamePattern[i]);
  buttonSound(gamePattern[i]);
  setTimeout(() => {
    i++;
  }, 400);
}

我正在考虑尝试用 promise 来设置它，但我不认为这实际上会像我一样暂停迭代。任何想法或想法将不胜感激。

谢谢，

凯文

Answer 1

始终使用let、const。 var 很旧并且容易出错。

使用带有 Promise 的 async/await 可以实现迭代之间的代码等待时间

const wait = (cb, time) => {
  return new Promise(res => {
    setTimeout(() => {
      cb();
      res();
    }, time)
  })
}

async function doSomeThing(){
  let i = 0;

  while(i < gamePattern.length-1){
    console.log(i);
    buttonAnimation(gamePattern[i]);
    buttonSound(gamePattern[i]);
    await wait(() => {i++;}, 400)
  }
}
doSomeThing()