ホームページ >ウェブフロントエンド >jsチュートリアル >Promise.all() と複数の Await: JavaScript での同時非同期呼び出しと逐次非同期呼び出しをいつ使用するか?

Promise.all() と複数の Await: JavaScript での同時非同期呼び出しと逐次非同期呼び出しをいつ使用するか?

Patricia Arquette
Patricia Arquetteオリジナル
2024-12-01 22:56:15737ブラウズ

Promise.all() vs. Multiple Awaits: When to Use Concurrent vs. Sequential Async Calls in JavaScript?

同時非同期呼び出しと逐次非同期呼び出し: Promise.all() と複数の Await

JavaScript では、開発者は非同期関数を使用して回避することがよくあります。メインスレッドをブロックし、パフォーマンスを向上させます。非同期タスクを処理する 2 つの一般的なパターンは、Promise.all() と複数の await ステートメントを使用することです。

1。 Promise.all()

Promise.all([promise1, Promise2, ...]) は、Promise の配列を受け取り、すべての入力 Promise が解決されたときに解決される新しい Promise を返します (いずれかが解決されました)または拒否されました)。これにより、複数の非同期操作が同時に完了するのを待つことができます。

2.複数の Await

複数の await ステートメントを使用すると、非同期操作を次々に待機できます。これにより、操作が効果的にシリアル化され、順番に実行されます。

タイミングの違い

Promise.all() と複数の await ステートメントの主な違いは、そのタイミングにあります。 Promise.all() はすべての非同期操作を同時に開始しますが、複数の await ステートメントはそれらを一度に 1 つずつ実行します。

このタイミングの違いは、一部の非同期操作が他の非同期操作よりも大幅に時間がかかるシナリオでは、パフォーマンスに影響を与える可能性があります。このような場合、Promise.all() を使用すると、同時実行性を利用してパフォーマンスを向上させることができます。

次のコード スニペットを検討してください:

const res = (ms) => new Promise((resolve, reject) => setTimeout(resolve, ms));

const example = async () => {
  const start = Date.now();
  const data = await Promise.all([res(3000), res(2000), res(1000)]);
  console.log(`Promise.all finished after: ${Date.now() - start}ms`);
};

example();

このコードを実行すると、3 つの非同期操作 (3000 遅延、それぞれ 2000 ミリ秒、1000 ミリ秒) が同時に実行されます。その結果、Promise.all は 3 つの操作がすべて完了した場合にのみ解決され、結果は関数の開始から 3000 ミリ秒後に記録されます。

以上がPromise.all() と複数の Await: JavaScript での同時非同期呼び出しと逐次非同期呼び出しをいつ使用するか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。