async・awaitについて

TypeScript（JavaScript）では、関数を定義して、その関数の返り値を変数に代入できる。

---

基本の関数定義と返り値

function greet(name: string): string {
  return `Hello, ${name}!`;
}
 
const message = greet("Alice");
console.log(message); // → "Hello, Alice!"

• function greet(name: string): string {}
  → name を引数として受け取り、string を返す関数を定義。
• return で文字列を返しているので、呼び出した側 (message) にその値が入る。
• const message = greet("Alice");
  → greet("Alice") の返り値 "Hello, Alice!" が message に代入される。

---

非同期関数（async function）の場合

async function fetchData(): Promise<string> {
  return "データ取得完了";
}
 
const data = fetchData();
console.log(data); // → Promise { 'データ取得完了' }

• async function fetchData(): Promise<string> {}
  → async をつけると 必ず Promise を返す関数 になる。
• return "データ取得完了"; だけど、async のおかげで Promise<string> になる。

await で Promise の中身を取り出す

async function fetchData(): Promise<string> {
  return "データ取得完了";
}
 
async function main() {
  const data = await fetchData(); // await で Promise の中身を取得
  console.log(data); // → "データ取得完了"
}
 
main();

• fetchData() だけだと Promise なので、中身を使うには await が必要。
• await fetchData(); で、返り値 "データ取得完了" を変数 data に代入できる。

---

関数の型を明示的に書く

関数を変数に入れることもできる。

const add: (a: number, b: number) => number = function (a, b) {
  return a + b;
};
 
const sum = add(3, 5);
console.log(sum); // → 8

• add の型 (a: number, b: number) => number を定義。
• function (a, b) { return a + b; } を代入。
• add(3, 5) を呼び出すと、返り値 8 が sum に入る。

---

関数を直接変数に入れる（アロー関数）

上と同じだけど、アロー関数で書くとこうなる：

const add = (a: number, b: number): number => a + b;
 
const sum = add(3, 5);
console.log(sum); // → 8

• (a: number, b: number): number => a + b;
  → 引数と返り値の型を指定して、シンプルに書ける。
• add(3, 5) の結果が sum に入る。

---

まとめ

✅ function 関数名(引数): 返り値の型 { return 値; }
✅ const 変数 = 関数名(引数); → 変数に返り値が入る
✅ async function は Promise を返すので await で中身を取り出す
✅ const 関数名 = (引数) => 返り値; も OK（アロー関数）