javascript - ループ内の setTimeout: コールバックは遅延なしで発生します。

Question

私は周りを検索し、同様の問題を抱えている他の人を見つけましたが、解決策や明確な説明が見つからないようです.

var content = 'test<br />';

for( var i = 1; i < 6; i++ ) {
    setTimeout(function() {
        document.write(content);
    }, 3000);
}

for ループのコードを 5 回実行し、各ループ間に 3 秒の遅延を設けたいと考えています。それを実行すると、少なくとも表面的には、ページの読み込みで 3 秒の遅延が発生したように見え、その後遅延なしですべてのループを通過します。

私は何が欠けていますか？

Answer 1

Your problem is that all the calls are happening after 3000 ms. Do perform each call 3s apart do this:

var content = 'test<br />';

for( var i = 1; i < 6; i++ ) {
    setTimeout(function() {
        document.write(content);
    }, 3000 * i);
}

Answer 2

おそらく使用する必要がありますsetInterval（特定の「間隔」でコードを実行しようとしているからです）

// first create an isolated namespace because we don't need to dirty the global ns //
(function(){
  var counter = 0;
  var maxIterations = 6;
  var intervalReference = setInterval(function(){

    // your code goes here //
    alert('test');

    // the stop condition //
    ++counter;
    if (counter == maxIterations) {
      clearInterval(intervalReference);
    }
  }, 3000);
}())

Answer 3

setInterval is probably the way to go (see Alin's answer) but if you were wanting to go down the setTimeout route, the code would look something like this:

var loop = 0;
var content = "test<br>";

function startTimeout(init){
  if(init!==true){
    document.write(content);
    loop++;
  }

  if(loop<5){
    setTimeout(startTimeout, 3000);
  }
}

startTimeout(true);