Tips

開発Tips(2025-11-12)

非同期処理を効率的に管理し、より読みやすく保守性の高いコードを作成するためのテクニックです。Promiseとasync/awaitを組み合わせることで、複雑な非同期処理をシンプルに記述できます。

JavaScript

非同期処理を効率的に管理し、より読みやすく保守性の高いコードを作成するためのテクニックです。Promiseとasync/awaitを組み合わせることで、複雑な非同期処理をシンプルに記述できます。

Promise.allSettled() を使ってエラーに強い非同期処理

複数のPromiseを並行して実行し、その全ての結果を(成功・失敗に関わらず)取得するための Promise.allSettled() メソッドの活用法です。従来の Promise.all() と異なり、一部のPromiseがrejectされた場合でも他のPromiseの結果を取得できます。

説明:

Promise.allSettled() は、複数の非同期処理を同時に実行し、その全ての処理が完了するまで待機します。各Promiseの結果は、fulfilled (成功) または rejected (失敗) のいずれかのステータスと共に返されます。これにより、エラーが発生した場合でも、他の成功した処理の結果を取得し、エラーハンドリングを柔軟に行うことが可能になります。

コード例:

const promise1 = Promise.resolve(3);
const promise2 = new Promise((resolve, reject) => setTimeout(reject, 100, 'foo'));
const promises = [promise1, promise2];

Promise.allSettled(promises)
  .then((results) => results.forEach((result) => console.log(result.status)));

// Expected output:
// "fulfilled"
// "rejected"

注意点:

  • Promise.allSettled() は、ES2020 で導入された比較的新しいメソッドです。古いブラウザや環境ではサポートされていない場合があります。必要に応じてpolyfillを検討してください。
  • 結果の配列は、入力されたPromiseの順序に対応しています。
  • status が “fulfilled” の場合、 value プロパティに結果が含まれます。status が “rejected” の場合、 reason プロパティにエラーが含まれます。

おすすめポイント:

  • 複数のAPIエンドポイントからデータを取得するような場合に、一部のエラーが発生しても他のデータを利用できるため、UXを向上させることができます。
  • エラーハンドリングを集中管理し、個々のPromiseのエラー処理を簡略化できます。
  • ログ記録やモニタリングなどの目的で、すべてのPromiseの結果を把握したい場合に役立ちます。