await_async - Javascript

  • 作成日:
  • 最終更新日:2025/06/22

await / async

async は、関数の前につけると、非同期関数という特殊な関数を定義することができます。

async は、「 asynchronous 」の省略形です。

await は、Promiseインスタンスの前につけることで、Promise のステータスが settled ( fulfilled または rejected )になるまで、次のコードの実行を待機します。

  • asynchronous(エイシンクロナス):非同期
  • async(エイシンク):「asynchronous(非同期)」の略。非同期
function A(){
  return new Promise((resolve, reject) => {
    setTimeout(function(){
      console.log("A");
      resolve();
    }, 2000);
  });
}

async function message(){
  await A();
  console.log("B");
}

message();
asyncを使い関数を定義すると、その関数は 常に Promise を返す非同期関数になります。 関数の中で await を使うとその処理が完了するまで関数内の後続処理は一時停止します。 ただし、await で待っている間も、JavaScript のイベントループにより他の処理(非同期処理や別の関数)は並行して実行されます。

await / async の注意点

async / await の検証で処理を遅らせるために、setTimeout()は使えません。

次のコードは、「 B 」が表示された後に、「 A 」が表示されます。

async function A(){
  setTimeout(function(){
    console.log("A");
  }, 2000);
}

async function message(){
  await A();
  console.log("B");
}

message();

次のようにコード変更すれば、「 A 」「 B 」の順で表示されます。

function A(){
  return new Promise(function(resolve, reject) {
    setTimeout(function(){
      resolve("A");
    }, 2000);
  });
}

async function message(){
  let a = await A();
  console.log(a);
  console.log("B");
}

message();