Promiseとasync/await
なぜ学ぶか: サーバーからデータを取ってくるような「時間のかかる処理」は、結果がすぐには返ってきません。その待ち方を書くのがasync/awaitで、AIのコードのあちこちに出てきます。まずは下の例で雰囲気をつかんでください。
まずはこの例を見てみましょう
// サーバーからユーザー情報を取ってきて、名前を表示する例
const main = async () => {
console.log("読み込みをはじめます…");
const user = await fetchUser(); // ← データが届くまで、ここで待つ
console.log("ようこそ、" + user.name + "さん");
};awaitと書いた行で「結果が届くまで待って」から、次の行に進みます。上から順に読めばOKです。
時間のかかる処理は、結果がすぐ返らない
データ取得はサーバーとやり取りするので時間がかかります。届く前に次へ進むと「まだ無いデータ」を使うことになるので、待つ仕組みが必要です。
await=「終わるまで待つ」
例のawait fetchUser()は、データが届くまでこの行で止まり、届いたらuserに入れて次へ進みます。
async=「この中でawaitを使います」の印
awaitは基本、頭にasyncと付けた関数の中で使います。「asyncとawaitはセット」と覚えましょう(ファイルの一番外側では、そのままawaitが書ける場合もあります)。
Promise=「あとで結果を渡す」引換券
fetchUser()が本当に返しているのは、結果そのものではなく引換券(Promise)です。awaitがその引換券を結果に換えています。型にPromise<User>とあったら「あとでUserが届く」という意味です。
ステップ 1 / 3
※ カリキュラムの内容はAIが生成しており、誤りが含まれる場合があります。正確な情報は公式ドキュメント等でご確認ください。