ホームページ > ウェブフロントエンド > jsチュートリアル > Promise.all は非同期 URL フェッチをどのように合理化して効率を高めることができますか?

Promise.all は非同期 URL フェッチをどのように合理化して効率を高めることができますか?

DDD
リリース: 2024-10-28 04:36:30
オリジナル
415 人が閲覧しました

How can Promise.all Streamline Asynchronous URL Fetching for Enhanced Efficiency?

非同期 URL フェッチ: Promise.all を活用して効率を向上

Promise.all ユーティリティは、シーケンスを同時に実行するための重要な手段として機能します非同期タスクの。 URL の配列を取得するタスクに着手し、対応するテキスト コンテンツをカプセル化する類似の配列を取得することを目指します。この取り組みを掘り下げる前に、試みられた特定のアプローチの欠点について少し考えてみる必要があります。

以下のスニペットは、目的を達成しようとしていますが、不十分です。

var promises = urls.map(url => fetch(url));
var texts = [];
Promise.all(promises)
  .then(results => {
     results.forEach(result => result.text()).then(t => texts.push(t))
  })
ログイン後にコピー

まず、 forEach 関数は配列も Promise も返さないため、この実装には概念的な欠陥があり、無効になります。次に、コードには、テキスト抽出の非同期性を適切に処理するために必要なネストが欠けています。

これらの欠点を修正するには、多面的なアプローチが必要です。まず、URL の配列に対して Promise.all を呼び出し、個々のフェッチ操作を表す Promise の配列を取得します。これらの最初のフェッチが正常に完了すると、2 番目の Promise.all 呼び出しが応答本文からテキスト コンテンツをキャプチャするために使用されます。カプセル化されたテキスト値は、まとまった配列に集約されます。このアプローチの本質は、次のコードによってエレガントに表現されています:

Promise.all(urls.map(u => fetch(u))).then(responses =>
    Promise.all(responses.map(res => res.text()))
).then(texts => {
    // Proceed with texts array...
})
ログイン後にコピー

この戦略の簡略化された変形には、最初のフェッチ Promise 履行中に応答本文を直接抽出することが含まれます:

Promise.all(urls.map(url =>
    fetch(url).then(resp => resp.text())
)).then(texts => {
    // Proceed with texts array...
})
ログイン後にコピー

または、await:

const texts = await Promise.all(urls.map(async url => {
  const resp = await fetch(url);
  return resp.text();
}));
ログイン後にコピー
を使用してさらに簡潔に

以上がPromise.all は非同期 URL フェッチをどのように合理化して効率を高めることができますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート