文理のこうさてん

人文科学と自然科学のこうさてんを目指していきたい。

Promise.allを実装してみる

Promise.allとは

このメソッドは複数のプロミスの結果を集約するのに便利です。このメソッドは、コード全体が正常に動作するために依存している複数の関連する非同期タスクがあり、コードの実行を続ける前にそれらすべてを履行させたい場合によく使われます。

実務ではnextjsでSSRをする際、必要な処理を一括で実行する場合などで利用したことがある。 互いに独立した非同期処理を実行する場合、Promise.allを利用すると並列実行されるので、全体処理が完了するまでの時間が短くなる。

developer.mozilla.org

interface

インプットについては待機状態のpromiseの配列、例えば以下のような感じ

const promise1 = fetch1()
const promise2 = fetch2()
const promises = [promise1, promise2]

返り値について、実行された非同期処理の結果を配列に格納した形で返却される

const promise1 = fetch1()
const promise2 = fetch2()
const promises = [promise1, promise2]

const res = await Promise.all(promises)
res = [promise1の返り値, promise2の返り値]

コード実装

配列の中身を一つずつ取り出し、全部の処理が終了したらresolve、何か一つでも失敗したらrejectをする関数を記述する。

function promiseAll(arr) {
  return new Promise((resolve, reject) => {
    const results = new Array(arr.length);
    let unresolved = arr.length;

    if (unresolved === 0) {
      resolve(results);
      return;
    }

    arr.forEach(async (item, index) => {
      try {
        const value = await item;
        results[index] = value;
        unresolved -= 1;

        if (unresolved === 0) resolve(results);
      } catch (err) {
        reject(err);
      }
    });
  });
}