【JavaScript】Promiseについて調べてみた

JavaScriptのプロミス（Promise）は非同期処理を扱うための標準的な手法で、コールバックヘル（コールバック地獄）を回避し、より構造化されたコードを書くのに役立つ。
プロミスは以下の特性がある：

非同期処理の表現: プロミスは非同期操作を表現する。非同期操作は通常、ファイルの読み込み、ネットワークリクエスト、データベースクエリなど、結果の返却に時間がかかる操作である。プロミスはこれらの操作をより簡潔に表現する。
ステート（状態）: プロミスは3つのステートを持つ。
- Pending: 非同期操作が完了していない状態。
- Fulfilled（またはResolved）: 非同期操作が成功した状態で、結果が利用可能。
- Rejected: 非同期操作が失敗した状態で、エラーが発生しました。
.then メソッド: プロミスは .then() メソッドを持ち、成功時と失敗時のコールバック関数を指定できる。成功時のコールバック関数は .then() の第1引数に、失敗時のコールバック関数は .catch() メソッドを使用して指定できる。

myAsyncFunction()
  .then(result => {
    // 成功時の処理
  })
  .catch(error => {
    // エラー時の処理
  });

チェイン可能: .then() メソッドはチェイン可能で、複数の非同期操作をシーケンシャルに実行できます。これにより、コードがより読みやすくなり、ネストを深くする必要ががない。

myAsyncFunction()
  .then(result1 => {
    return anotherAsyncFunction(result1);
  })
  .then(result2 => {
    // チェインされた非同期処理の結果を処理
  });

非同期操作の逐次実行: プロミスを使用すると、非同期操作が逐次実行でき、一連の非同期操作がすべて完了するのを待つことができる。

Promise.all([promise1, promise2, promise3])
  .then(results => {
    // すべての非同期操作が完了した後に実行
  });

プロミスは、非同期処理をより管理しやすくし、エラーハンドリングを改善するのに役立つ。

以下はPromiseの数珠繋ぎである。
ネストすることなく、コードがすっきりして見やすいのがわかる

<script>
        const sleep = prm => new Promise(resolve => setTimeout(resolve, prm));
        sleep(2000)
        .then(() => console.log('2秒経過'))
        .then(() => sleep(1000))
        .then(() => console.log('1秒経過'))
        .then(() => sleep(3000))
        .then(() => console.log('3秒経過'))
        .then(() => sleep(1000))
        .then(() => console.log('1秒経過'))
</script>