时间戳

首页 > 解决方案 > 如何让 Javascript 循环在开始下一个迭代之前等待现有迭代完成？

javascript - 如何让 Javascript 循环在开始下一个迭代之前等待现有迭代完成？

问题描述

如何让下面的循环在开始下一次迭代之前等待当前迭代完成？

var minute = 0

alert ("Kick Off");

var refreshIntervalId = setInterval(function() {     
  if (minute < 91) {
    // lots of code with Ajax calls
    // can take from a fraction of a second to 30 seconds to run code
    // depending on conditions
  } else {
    clearInterval(refreshIntervalId);
  } 
  minute++         
}, 1000);

在先决条件代码完成后，我通常使用函数和“.done”来执行代码。我还使用动画中的函数在动画完成后执行代码。

但是，我无法理解如何使代码等待循环迭代完成。如果我将先决条件代码放入一个函数（循环中的所有代码）然后使用 .done，则只有循环的右括号可以放在“.done”函数中 - 这显然不起作用.

谁能解决这个难题？

标签： javascriptjqueryloopsasynchronouswait

解决方案

您可以在异步函数中创建一个 while 循环并使用 await。在下面的代码中，while 循环在每次迭代时至少等待 2 秒，但最多与任务所需的时间一样长。

const sleep = time => new Promise(resolve => setTimeout(resolve, time))  

async function main() {
  while (true) {
    console.log("new iteration")
    const task = new Promise((resolve, reject) => {
      // things that take long go here…
      const duration = Math.random()*4000
      setTimeout(() => {
        console.log(`done, task took ${Math.round(duration)}ms`)
        resolve()
      }, duration)
    })
    // wait until task is finished but at least 2 seconds
    await Promise.all([task, sleep(2000)])
  }
}

main()

推荐阅读