JavaScript の非同期ループ

JavaScript にはさまざまな種類のループが用意されていますが、実行を一時停止して非同期呼び出しを待機するループを作成することもできます。挑戦的。これは、同期コードと非同期コードを混在させると、予期しない動作が発生する可能性があるためです。

解決策: 非同期アプローチを採用する

この制限を克服するには、イベントを完全に受け入れる必要があります。 JavaScript の -driven アプローチ。これには、非同期呼び出しの完了時に呼び出される関数の使用が含まれます。コールバックが呼び出された後、ループは実行を続行できます。

asyncLoop 関数の紹介

この非同期ループ動作を容易にするために、asyncLoop と呼ばれるヘルパー関数を作成できます。 3 つのパラメータを取ります:

• iterations: ループを実行する回数。
• func: 各反復で実行する関数。
• callback:ループの完了時に呼び出される関数。

asyncLoop 関数は、現在の反復を追跡する内部変数インデックスを維持し、完了のフラグを立てます。ループがいつ完了したかを示す変数。関数内には、次のメソッドを提供する内部ループ オブジェクトがあります。

• next(): ループを 1 反復ずつ進めます。
• iteration(): 現在の反復を返します。
• break(): ループを早期に終了します。

ループを開始するには、loop.next() を使用します。と呼ばれた。 func 関数が呼び出されるたびに、loop.next() を呼び出してループを続行するか、loop.break() を呼び出してループを終了できます。

使用例:

]次の例は、asyncLoop 関数を使用して非同期ループを作成する方法を示しています。

asyncLoop(10, (loop) => {
  someFunction(1, 2, (result) => {
    console.log(loop.iteration());
    loop.next();
  });
}, () => {
  console.log('cycle ended');
});

このコードは someFunction を 10 回非同期で実行し、反復回数をコンソールに記録します。ループが完了すると、サイクル終了メッセージが出力されます。

このアプローチを利用すると、JavaScript 開発者はイベント駆動型環境でシームレスに動作する非同期ループを作成でき、スクリプトとブラウザのブロックに伴う潜在的な問題を回避できます。