1. `async` と `await` の基本的な動作

質問

async と await の中の処理はどのように動作しますか？

回答

async 関数内で使用される await は、非同期処理の完了を待機します。
await の中は非同期処理である必要があります。
async 関数全体では、await を順番に実行してから次の処理に進みます。

例

async function example() {
  console.log("Start");
  const result = await new Promise((resolve) => setTimeout(() => resolve("Done"), 1000));
  console.log(result); // 1秒後に "Done" が表示
  console.log("End");
}
example();
// 出力順: "Start" -> 1秒待機 -> "Done" -> "End"

2. `await` 内の関数が `Promise` を返さない場合

質問

await の中のメソッドが Promise を返さない場合はどうなりますか？

回答

await に渡される値が Promise でない場合、その値が即座に返されます。
非同期処理として機能しません。

例

function notAPromise() {
  return "Immediate Value";
}

async function example() {
  const result = await notAPromise(); // 非同期処理として扱われない
  console.log(result); // "Immediate Value"
}
example();

3. 独自の関数を `await` で使うには

質問

独自の関数を await で使うにはどうすればいいですか？

回答

関数は必ず Promise を返す必要があります。
Promise を返さない場合は、Promise.resolve でラップするか、関数を async にする必要があります。

例

function myAsyncFunction() {
  return new Promise((resolve) => {
    setTimeout(() => resolve("Done!"), 1000);
  });
}

async function example() {
  const result = await myAsyncFunction(); // Promise を返す関数
  console.log(result); // 1秒後に "Done!" が表示
}
example();

4. `Promise` がエラーを返した場合のエラーハンドリング

質問

Promise がエラーを返した場合、await で catch できますか？

回答

await は、Promise が Rejected 状態になった場合にエラーをスローします。
try-catch を使用してエラーをキャッチできます。

例

async function example() {
  try {
    const result = await new Promise((_, reject) => {
      reject("Something went wrong!"); // エラーを発生
    });
    console.log(result); // 実行されない
  } catch (error) {
    console.error("Caught an error:", error); // "Caught an error: Something went wrong!" が表示
  }
}
example();

5. `Promise` オブジェクトは変化しますか？

質問

Promise オブジェクトは状態が変化しますか？

回答

Promise オブジェクト自体は不変です。
内部の状態が Pending（保留中）から Fulfilled（解決済み）または Rejected（拒否済み）に一度だけ変化します。

例

const promise = new Promise((resolve) => {
  setTimeout(() => resolve("Done"), 1000);
});

console.log(promise); // 初期状態: Promise { <pending> }

setTimeout(() => {
  console.log(promise); // 解決後: Promise { 'Done' }
}, 1100);

6. `Promise` の状態をキャッチしない場合

質問

Promise のエラーをキャッチしないとどうなりますか？

回答

await のエラーをキャッチしない場合、エラーは呼び出し元に伝播します。
エラーを処理しないと、アプリケーションがクラッシュする可能性があります。

例

async function example() {
  const result = await new Promise((_, reject) => {
    reject("Something went wrong!");
  });
  console.log(result); // 実行されない
}

example().catch((error) => {
  console.error("Caught an error in the calling code:", error);
});

まとめ

質問内容	回答
`async` と `await` の基本動作	`await` は非同期処理の完了を待機し、`async` 内で順序を保証します。
`await` がPromiseを返さない場合の挙動	即座に値が返され、非同期として機能しません。
独自の関数を `await` で使う方法	関数が `Promise` を返す必要があります。
`Promise` がエラーを返した場合の処理方法	`try-catch` を使うか、呼び出し元で `.catch()` を使ってエラーを処理します。
`Promise` オブジェクトは変化するか？	オブジェクトは不変で、状態が `Pending` → `Fulfilled`/`Rejected` に一度だけ変化します。
エラーをキャッチしないとどうなるか	エラーが呼び出し元に伝播し、処理されなければクラッシュの原因になります。

これにより、Promiseや非同期処理に関する重要なポイントをすべて把握できます！