非同期処理は、時間のかかるタスクを効率よく処理するために重要です。PromiseとAsync/Awaitという便利な方法を使って、非同期処理を簡単に扱う方法を紹介します。

非同期処理とは？

非同期処理とは、他のコードの実行を待たずに、時間のかかる処理をバックグラウンドで行うことです。例えば、サーバーからデータを取得する場合などに使います。

Promiseとは？

Promiseは、非同期処理の結果を扱うオブジェクトです。Promiseには3つの状態があります

• Pending（保留中）：処理がまだ完了していない状態
• Fulfilled（成功）：処理が成功した状態
• Rejected（失敗）：処理が失敗した状態

Promiseの基本的な使い方を見てみましょう。

let myPromise = new Promise((resolve, reject) => {
  let success = true;
  if (success) {
    resolve("処理が成功しました！");
  } else {
    reject("処理が失敗しました！");
  }
});

myPromise.then((message) => {
  console.log(message);
}).catch((error) => {
  console.error(error);
});

この例では、resolveとrejectを使って処理の結果を決定しています。thenメソッドで成功時の処理を、catchメソッドで失敗時の処理を行います。

Async/Awaitとは？

Async/Awaitは、Promiseをより簡単に使うための構文です。非同期処理をまるで同期処理のように書けるので、コードが読みやすくなります。

Async関数は、asyncキーワードを使って定義します。そして、非同期処理の前にawaitキーワードを使います。

async function fetchData() {
  try {
    let response = await fetch("https://api.example.com/data");
    let data = await response.json();
    console.log(data);
  } catch (error) {
    console.error("エラーが発生しました：", error);
  }
}

fetchData();

この例では、fetch関数を使ってデータを取得しています。awaitを使うことで、非同期処理が完了するまで次の行のコードが実行されないようになります。

まとめ

JavaScriptの非同期処理は、時間のかかるタスクを効率よく処理するために欠かせない技術です。PromiseとAsync/Awaitを使うことで、非同期処理を簡単に扱えるようになります。