function resolveAfter2Seconds() {  return new Promise((resolve) => {    setTimeout(() => {      resolve("resolved");    }, 2000);  });}async function asyncCall() {  console.log("calling");  const result = await resolveAfter2Seconds();  console.log(result);  // Expected output: "resolved"}asyncCall();

async function name(param0) {  statements}async function name(param0, param1) {  statements}async function name(param0, param1, /* …, */ paramN) {  statements}

メモ:改行をasync とfunction の間に入れてはいけません。そうしないとセミコロンが自動的に挿入され、async が識別子となり、残りがfunction 宣言となります。

メモ:キーワードawait は、通常の JavaScript コード内の非同期関数内でのみ有効です。非同期関数の外で使用した場合はSyntaxError が発生します。

await はJavaScript モジュールでは単独で使用することができます。

メモ:async/await の目的は、プロミスベースの API を利用するのに必要な構文を簡素化することです。async/await の動作は、ジェネレーターとプロミスの組み合わせに似ています。

async function foo() {  return 1;}

function foo() {  return Promise.resolve(1);}

const p = new Promise((res, rej) => {  res(1);});async function asyncReturn() {  return p;}function basicReturn() {  return Promise.resolve(p);}console.log(p === basicReturn()); // trueconsole.log(p === asyncReturn()); // false

async function foo() {  await 1;}

function foo() {  return Promise.resolve(1).then(() => undefined);}

async function foo() {  const result1 = await new Promise((resolve) =>    setTimeout(() => resolve("1")),  );  const result2 = await new Promise((resolve) =>    setTimeout(() => resolve("2")),  );}foo();

async function foo() {  const p1 = new Promise((resolve) => setTimeout(() => resolve("1"), 1000));  const p2 = new Promise((_, reject) => setTimeout(() => reject("2"), 500));  const results = [await p1, await p2]; // こうしないでください。 Promise.all または Promise.allSettled を使用してください。}foo().catch(() => {}); // すべてのエラーを浅くしようとする...

function resolveAfter2Seconds() {  console.log("starting slow promise");  return new Promise((resolve) => {    setTimeout(() => {      resolve("slow");      console.log("slow promise is done");    }, 2000);  });}function resolveAfter1Second() {  console.log("starting fast promise");  return new Promise((resolve) => {    setTimeout(() => {      resolve("fast");      console.log("fast promise is done");    }, 1000);  });}async function sequentialStart() {  console.log("== sequentialStart 開始 ==");  // 1. タイマーの起動、完了後にログ出力  const slow = resolveAfter2Seconds();  console.log(await slow);  // 2. 前回のタイマーを待った後で次のタイマーを開始  const fast = resolveAfter1Second();  console.log(await fast);  console.log("== sequentialStart 終了 ==");}async function sequentialWait() {  console.log("== sequentialWait 開始 ==");  // 1. 2 つのタイマーを同時に開始するには、お互いを待つ必要はない  const slow = resolveAfter2Seconds();  const fast = resolveAfter1Second();  // 2. slow タイマーが完全に終了するまで待ち、その後、結果をログ出力する  console.log(await slow);  // 3. fast タイマーが完全に終了するまで待ち、その後、結果をログ出力する  console.log(await fast);  console.log("== sequentialWait 終了 ==");}async function concurrent1() {  console.log("== concurrent1 開始 ==");  // 1. 2 つのタイマーを同時に開始し、どちらも完了するのを待つ  const results = await Promise.all([    resolveAfter2Seconds(),    resolveAfter1Second(),  ]);  // 2. それぞれログ出力する  console.log(results[0]);  console.log(results[1]);  console.log("== concurrent1 終了 ==");}async function concurrent2() {  console.log("== concurrent2 開始 ==");  // 2 つの jobs を並列に実行し両方が完了するのを待つ  await Promise.all([    (async () => console.log(await resolveAfter2Seconds()))(),    (async () => console.log(await resolveAfter1Second()))(),  ]);  console.log("== concurrent2 終了 ==");}sequentialStart(); // 2 秒後に "slow" をログ出力し、その 1 秒後に "fast" をログ出力する// 直前の処理を待つsetTimeout(sequentialWait, 4000); // 2 秒後に "slow" と "fast" をログ出力する// 直前の処理を待つsetTimeout(concurrent1, 7000); // concurrentStart と同様// 直前の処理を待つsetTimeout(concurrent2, 10000); // 本当に並列処理となるため 1 秒後に "fast" とログ出力し、その 1 秒後に "slow" とログ出力する

警告:関数sequentialWait とconcurrent1 は機能的に同等ではありません。

sequentialWait では、プロミスfast がプロミスslow の履行よりも前に拒否された場合、呼び出し元が catch 節を構成しているかどうかにかかわらず、プロミスの拒否が処理されないというエラーが発生します。

concurrent1 では、Promise.all がプロミスチェーンを一括して配線します。つまり、操作はプロミスの拒否の順番に関係なくすばやく失敗し、エラーは構成されたプロミスチェーン内で常に発生するため、通常の方法で捕捉することができます。

function getProcessedData(url) {  return downloadData(url) // プロミスを返す    .catch((e) => downloadFallbackData(url)) // プロミスを返す    .then((v) => processDataInWorker(v)); // プロミスを返す}

async function getProcessedData(url) {  let v;  try {    v = await downloadData(url);  } catch (e) {    v = await downloadFallbackData(url);  }  return processDataInWorker(v);}

async function getProcessedData(url) {  const v = await downloadData(url).catch((e) => downloadFallbackData(url));  return processDataInWorker(v);}