JavaScript の非同期関数 (async と await)

JavaScript の非同期関数と Promise

JavaScript では async キーワード付きで関数を作成することで、 非同期関数を作成することができます。

非同期関数は Promise を返します。この Promise は非同期関数の戻り値で Fulfilled 状態になります。

async function foo() {
  return 123
}

foo()
  .then((value) => console.log(`then: ${value}`))
  .catch((reason) => console.log(`catch: ${reason}`))
// then: 123

非同期関数内で throw で例外が投げられそれが捕捉されていない場合、 その例外で Rejected になります。

async function foo() {
  throw new Error('Great Scott!')
}

foo()
  .then((value) => console.log(`then: ${value}`))
  .catch((reason) => console.log(`catch: ${reason}`))
// catch: Error: Great Scott!

JavaScript の async と await の使い方

非同期関数内では await キーワードを用いて、Promise が Fulfilled になるのを待つことができます。 Fulfilled された値は、await 式の値としてセットされます。

const sleep = (ms) => new Promise((r) => setTimeout(() => r(123), ms))
;(async () => {
  console.time('A')
  console.timeLog('A')
  const a = await sleep(3000)
  console.timeLog('A', `a=${a}`)
  console.timeEnd('A')
})()
// A: 0.068ms
// A: 3008.761ms a=123
// A: 3008.933ms

ここまでお読みいただき、誠にありがとうございます。SNS 等でこの記事をシェアしていただけますと、大変励みになります。どうぞよろしくお願いします。

© 2024 JavaScript 入門