Question

我正在试图弄清楚如何计算这个for语句，以便它每隔一秒左右发生一次。最终发生的是x为所有日志打印5，因为for循环在超时发生之前循环。如何对循环进行计时，以便在setTimeout完成后每次迭代都会发生。

for (x = 0; x < 5; x++) {  
  var wait = setTimeout( function() { 
    console.log(x,"x"); 
  }, 800);
}

Answer 1

使用let x = 0确保x在循环中具有块作用域并乘以延迟时间索引以增加每个延迟时间

for (let x = 0; x < 5; x++) {
  setTimeout(function() {
    console.log(x, " x")
  }, (x + 1) * 800);
}

Answer 2

其他答案当然是正确的。

但是使用async / await可以更容易地继续使用异步代码。

下面是一个简单的例子，..由于效用函数延迟，它最初看起来更长，但是当你的程序变得更大时，使用async / await将使你的代码更容易理解。

这里的另一个优点是，只创建了1个setTimeout。因此可能更加资源友好。您也可以使用1 setTimeout而不使用async / await，但需要链接setTimeout，这使得代码更难以遵循。

＆＃13;

// utility function do delay, 
// can be used again..
function delay(ms) {
  return new Promise((resolve) => {
    setTimeout(resolve, ms);
  });
}

//await can only be called from async function.
//so lets just create run function to get things started.

async function run () {
  for (let x = 0; x < 5; x++) {  
    await delay(800);
    console.log(x,"x"); 
  }
}

//lets get things started..
run ();

＆＃13;

Answer 3

我认为这就是你要做的事情：

for (x = 0; x < 5; x++) {  
  (function(n){setTimeout(()=>{console.log(n,"x");},800*n);})(x);
}

如何计算javascript操作的时间，以便它们以正确的顺序发生

3 个答案: