MDN’s new design is in Beta! A sneak peek: https://blog.mozilla.org/opendesign/mdns-new-design-beta/

async function

async function 宣言は、AsyncFunction オブジェクトを返す async function を定義します。

AsyncFunction コンストラクターと async function 式 を使用して async function を定義することもできます。

構文

async function name([param[, param[, ... param]]]) {
   statements
}
name
関数名。
param
関数に渡す引数名。
statements
関数のボディーを構成するステートメント。

説明

async function が呼び出された場合、promise を返します。async function が値を返した場合、promise は返された値で解決されます。async function が例外や何らかの値をスローした場合、promise はスローされた値で拒否されます。

Async function は、await 式を含むことできます。await 式は、async function の実行を一時停止し、promise の解決を待ちます。そして、async function の実行を再開し、解決された値を返します。

シンプルな例

function resolveAfter2Seconds(x) {
  return new Promise(resolve => {
    setTimeout(() => {
      resolve(x);
    }, 2000);
  });
}

async function add1(x) {
  var a = resolveAfter2Seconds(20);
  var b = resolveAfter2Seconds(30);
  return x + await a + await b;
}

add1(10).then(v => {
  console.log(v);  // prints 60 after 2 seconds.
});

async function add2(x) {
  var a = await resolveAfter2Seconds(20);
  var b = await resolveAfter2Seconds(30);
  return x + a + b;
}

add2(10).then(v => {
  console.log(v);  // prints 60 after 4 seconds.
});

async function で promise チェーンをリライトする

promise を返す API は promise チェーンで解決され、関数を複数の部品に分割できます。次のコードを想定してください。:

function getProcessedData(url) {
  return downloadData(url) // returns a promise
    .catch(e => {
      return downloadFallbackData(url) // returns a promise
    })
    .then(v => {
      return processDataInWorker(v); // returns a promise
    });
}

次のように 1 つの async function にリライトできます:

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

上記の例では、return ステートメント上に await ステートメントがないことに注目してください。なぜなら、async function の戻り値は暗黙の裡にPromise.resolve でラップされているからです。

仕様

仕様 ステータス コメント
ECMAScript Async Functions
async function の定義
ドラフト 提案

ブラウザー実装状況

機能 Chrome Firefox (Gecko) Internet Explorer  Edge Opera Safari (WebKit)
基本サポート 55 52.0 (52.0) ? ? 42 未サポート
機能 Android Android Webview Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile Chrome for Android
基本サポート 未サポート 未サポート 52.0 (52.0) ? 42 未サポート 55

 

関連項目

ドキュメントのタグと貢献者

 このページの貢献者: YuichiNukiyama
 最終更新者: YuichiNukiyama,