AI活用の教科書
フロントエンド開発ふつう3分で読了

Promise(非同期)

Promiseぷろみす

ひとことで言うと

「あとで結果が返ってくる」という約束を表す入れ物で、非同期の処理を順番に書けるようにする仕組みです。

📖 もうちょい詳しく

何が新しいの?

プログラムには、結果がすぐには返ってこない処理があります。たとえばサーバーへの問い合わせや、ファイルの読み込みなどです。こうした「待つ処理」を昔は、終わったときに動かす関数を渡す書き方でつないでいました。ですがこれを重ねると入れ子が深くなり、読みづらくなりがちでした。Promiseは、その「あとで結果が返る」ことを1つのオブジェクト(値や機能をまとめたもの)として扱えるようにした仕組みです。

どうやって動いてるの?

Promiseは作られた直後、まだ結果が出ていない「待っている状態」です。処理が終わると「成功」か「失敗」のどちらかに変わります。成功したときの受け取り口と、失敗したときの受け取り口をあらかじめ登録しておき、結果が決まった瞬間にそこへ流れます。さらにPromiseは数珠つなぎにでき、「これが終わったら次」と順番に書けます。

何ができるの?

データの取り寄せのように時間のかかる処理を、上から下へ読める形で書けます。「取得できたらこうする」「失敗したらこう知らせる」を整理して並べられるので、間違いに気づきやすくなります。そしてこのPromiseは、より読みやすい書き方であるasync/await(後述)の土台にもなっています。

🌱 身近なたとえ

飲食店の呼び出しベルで例えると分かりやすいです。注文するとベルを渡され、料理ができるまで席で待てます。これが「結果を待っているPromise」です。ベルが鳴れば受け取りに行き(成功)、品切れなら声をかけてもらえます(失敗)。料理ができるまで店の前で立ち止まらず、別のことをして待てるところもよく似ています。

✅ まず覚えるポイント

  • 「あとで結果が返ってくる」ことを表す、約束の入れ物です。
  • 状態は「待っている」「成功」「失敗」の3つで考えると分かりやすいです。
  • 成功時と失敗時の受け取り口を、あらかじめ登録しておきます。
  • 数珠つなぎにして、処理の順番を上から下へ書けます。
  • async/awaitという読みやすい書き方の土台になっています。

🧭 よくある勘違い

Promiseを使うと処理が速くなるの?

速くなるわけではありません。Promiseは待ち時間そのものを縮める道具ではなく、「待つ処理を順序立てて、読みやすく書く」ための仕組みです。待っている間に他の処理を進められるので、結果として全体がもたつきにくくなることはあります。

結果はすぐ取り出せるの?

作ったその場では、まだ結果は入っていないことが多いです。あくまで「あとで届く約束」なので、届いたときに動く受け取り口を登録しておく必要があります。届く前の値をそのまま使おうとすると、思った通りに動きません。

🧩 関連して覚えると楽な言葉

  • 非同期処理: 結果を待たずに別の処理を進めるやり方で、Promiseはその書き方の一つです。
  • コールバック: 処理が終わったときに動かすよう渡しておく関数のことです。
  • API: 別のサービスやプログラムへ問い合わせるための窓口のことです。
  • JavaScript: Promiseがよく使われる、ウェブでおなじみのプログラミング言語です。

🏁 ひとことでまとめ

Promiseは、時間のかかる処理に「終わったら知らせます」という札を付けて、待ち合わせを整理してくれる仕組みです。