javascriptの動作を正しい順序で実行する方法

Question

私はこのforの文をどのように時間を計るかを考え出しているので、1秒おきに発生します。何が起こるのかは、xが、タイムアウトが発生する前にループがループしているので、すべてのログに対して5を出力するということです。 setTimeoutの終了後にすべての反復が行われるように、ループをどのように時間を計ることができますか。

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

Answer 1

使用let x = 0xブロックがループの中でスコープであることを確認して、それぞれの遅延時間をインクリメントするために、遅延時間指数を乗算する

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

Answer 2

私はこれがあなたがやろうとしていることだと思います：ここ

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

Answer 3

他の回答もちろん正しいです。

将来の非同期コードへの移行は、async/awaitを使用する方がずっと簡単です。

これは単純な例です。ユーティリティの機能の遅延のために、最初は長くなりますが、async/awaitを使用するとプログラムが大きくなるので、コードの実行がずっと簡単になります。

ここでも、1つのsetTimeoutが作成されます。潜在的により多くのリソースにやさしい。 async/awaitを使わずに1つのsetTimeoutを使うこともできますが、setTimeoutを連鎖させてコードをさらに難しくする必要があります。

// 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();