INDEX
～
ad. 価格範囲を指定して商品を探せます
タスクの完了管理とは？
JavaScriptでは、複数の非同期処理を同時に実行することがよくあります。
そのような場合は、「すべての処理が終わるまで待つ」「最初に終わった処理だけを利用する」「成功・失敗に関係なく結果を取得する」といったタスクの完了管理が重要になります。
Promiseには、このような処理を簡単に実現できる便利なメソッドが用意されています。
Promise.all()
Promise.all()は、すべてのPromiseが成功するまで待つメソッドです。
すべて成功すると、結果が配列で返されます。
ただし、1つでも失敗すると、その時点でcatchが実行されます。
Promise.all()の例
const task1 = new Promise((resolve) => {
setTimeout(() => resolve("タスク1完了"), 1000);
});
const task2 = new Promise((resolve) => {
setTimeout(() => resolve("タスク2完了"), 2000);
});
const task3 = new Promise((resolve) => {
setTimeout(() => resolve("タスク3完了"), 3000);
});
Promise.all([task1, task2, task3])
.then((results) => {
console.log(results);
})
.catch((error) => {
console.error(error);
});
実行結果
[
"タスク1完了",
"タスク2完了",
"タスク3完了"
]
Promise.race()
Promise.race()は、最初に完了したPromiseだけを採用します。
他のPromiseは実行され続けますが、結果は利用されません。
Promise.race()の例
const task1 = new Promise((resolve) => {
setTimeout(() => resolve("タスク1完了"), 1000);
});
const task2 = new Promise((resolve) => {
setTimeout(() => resolve("タスク2完了"), 2000);
});
const task3 = new Promise((resolve) => {
setTimeout(() => resolve("タスク3完了"), 3000);
});
Promise.race([task1, task2, task3])
.then((result) => {
console.log(result);
});
実行結果
タスク1完了
Promise.allSettled()
Promise.allSettled()は、成功・失敗に関係なく、すべてのPromiseが終了するまで待ちます。
それぞれのPromiseの成功・失敗をまとめて確認したい場合に便利です。
Promise.allSettled()の例
const task1 = Promise.resolve("タスク1成功");
const task2 = Promise.reject("タスク2失敗");
Promise.allSettled([task1, task2])
.then((results) => {
console.log(results);
});
実行結果
[
{
status: "fulfilled",
value: "タスク1成功"
},
{
status: "rejected",
reason: "タスク2失敗"
}
]
Promise.any()
Promise.any()は、最初に成功したPromiseを返します。
失敗したPromiseは無視され、すべて失敗した場合のみAggregateErrorが発生します。
Promise.any()の例
const task1 = Promise.reject("失敗");
const task2 = new Promise((resolve) => {
setTimeout(() => resolve("成功"), 1000);
});
Promise.any([task1, task2])
.then((result) => {
console.log(result);
});
実行結果
成功
Promise.all()・race()・allSettled()・any()の違い
| メソッド | いつ完了するか | 失敗した場合 |
|---|---|---|
Promise.all() |
すべて成功したとき | 1つでも失敗すると終了する。 |
Promise.race() |
最初に終了したPromise | 最初に失敗した場合はそのエラーになる。 |
Promise.allSettled() |
すべて終了したとき | 成功・失敗の両方を取得できる。 |
Promise.any() |
最初に成功したPromise | すべて失敗するとAggregateErrorになる。 |
どのメソッドを使えばよい？
| 目的 | 使用するメソッド |
|---|---|
| すべての処理が終わるまで待ちたい。 | Promise.all() |
| 最初に終わった処理だけ利用したい。 | Promise.race() |
| 成功・失敗をまとめて確認したい。 | Promise.allSettled() |
| 最初に成功した処理だけ利用したい。 | Promise.any() |
まとめ
Promise.all()は、すべて成功したときに結果を取得できる。Promise.race()は、最初に終了したPromiseの結果を返す。Promise.allSettled()は、成功・失敗を含めて全結果を取得できる。Promise.any()は、最初に成功したPromiseだけを取得できる。- 目的に応じてこれらのメソッドを使い分けることで、複数の非同期処理を効率よく管理できる。