非同期処理

JavaScriptでは非同期処理を行うような関数を実行するとPromiseオブジェクトが返ってくることパターンが多いです。
返ってきたPromiseオブジェクトに対してthenメソッドを読んで非同期処理終了後の処理も記述できるので、呼び出す側がコールバックまみれになりにくく、良い感じです。

function caller(){
  let promise = http(); // Promiseオブジェクトを返す関数
  promise.then(response => console.log(response));
}

caller();
console.log("caller() was called.");

この非同期処理はasync``awaitでより簡単に記述することができます。

async/await

async

asyncは非同期処理を完結に記述するための修飾子です。
asyncを関数定義に修飾することで、非同期関数として定義することができます。

async function http(){
 // ...
}

関数にasyncを付加することで、呼び出し時にPromiseオブジェクトを返すようになります。

let promise = http(); 
console.log(promise); // Promise

返したPromiseオブジェクトは、asyncを付加した関数が終了するタイミングでresolveされます。またasyncを付加した関数が例外を送出した場合はrejectされます。

await

awaitはPromiseを返す式に修飾することで、Promiseに紐付いた非同期処理が終了するまでasync関数内の処理が一時停止します。

async function http(){
  await setTimeout(()=>("timeout."),3000);
  return "http response."
}

一時停止したasync関数の処理は、await式の処理が終了して値が返されてから再開されます。

Usage

async function http(){
  await setTimeout(()=>("timeout."),3000);
  return "http response."
}

function caller(){
  let promise = http();
  promise.then(response => console.log(response)); // 3秒後に出力
}

console.log(caller());
console.log("caller() was called."); // 先に出力

参考

developer.mozilla.org

async/await 入門（JavaScript）