如何在JavaScript循环中添加延迟？

Question

如何在JavaScript循环中添加延迟？我想在while循环中添加延迟/睡眠：我试过这样的：alert('hi');for(var start = 1; start < 10; start++) {   setTimeout(function () {     alert('hello');   }, 3000);}只有第一种情况是真的：显示后alert('hi')，它将等待3秒然后alert('hello')将显示，但随后alert('hello')将反复不断。我想要的是，在alert('hello')3秒后显示alert('hi')之后，它需要等待第二次3秒alert('hello')，依此类推。

Answer 1

尝试这样的事情：

var i = 0, howManyTimes = 10;function f() {
    alert( "hi" );
    i++;
    if( i < howManyTimes ){
        setTimeout( f, 3000 );
    }}f();

Answer 2

如果使用ES6，您可以使用let以实现此目的：

for (let i=1; i<10; i++) {
    setTimeout( function timer(){
        alert("hello world");
    }, i*3000 );}

为每次迭代let声明i了什么，而不是循环。这样，传递的内容正是我们想要的。setTimeout

Answer 3

由于ES7是等待循环的更好方法：

function timer(ms) {
 return new Promise(res => setTimeout(res, ms));}async function load () {
  for (var i = 0; i < 3; i++) {
    console.log(i);
    await timer(3000);
  }}load();

关于MDN的参考

请注意，今天很少支持ES7，因此您需要与Babel进行交互，以便在任何地方使用它。

Transpiled