JavaScript の非同期関数: "async" と "await" について理解する

はじめに

JavaScript の非同期プログラミング モデルにおける、非同期タスクの処理とその完了コールバックは複雑なコード構造を引き起こす可能性があります。非同期関数は、「async」および「await」キーワードとともに、より構造化された効率的なアプローチを提供します。

非同期関数

非同期関数は、メインスレッドをブロックしない関数です。非同期操作を待ちます。これらは「async」キーワードを使用し、Promise オブジェクトを返します。非同期関数を使用すると、より同期に近い方法で非同期コードを作成できます。

"async" および "await"

"async" キーワードは、関数を非同期として宣言するために使用されます。 「await」キーワードは、非同期関数内で実行を一時停止し、Promise が満たされるのを待つために使用されます。次に例を示します。

async function fetchUserData(id) {
  const response = await fetch(`https://example.com/users/${id}`);
  const user = await response.json();
  return user;
}

この例では、fetchUserData 関数は「async」キーワードで非同期としてマークされています。ユーザーデータを取得するために fetch を呼び出すとき、「await」を使用して、フェッチが完了するまで実行を一時停止します。これにより、関数のスコープ内でユーザー データをすぐに使用できるようになります。

非同期関数の利点

非同期関数を使用すると、非同期プログラミングがより管理しやすく、読みやすくなります。ネストされたコールバックを排除することでコード構造を簡素化し、明示的な Promise 処理の必要性を減らします。これにより、コードの保守性が向上し、エラーの可能性が減少します。