ES7のawait

2015-07-10T07:58:37+09:00 JavaScript

参考: ES7 の Async/Await を使ってみた

ES7からawaitが使えるようになるとのことでやってみた

まず例えば以下のような場合

(() => {
  let testFn = () => {
    return new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve('hoge');
      }, 3000);
    });
  }

  // 通常の場合
  testFn().then((msg) => {
    console.log('msg', msg);
  });

})();

Promiseを返した場合に通常にthenで値を取得するのが普通の場合。でawaitを使う事でPromiseを返した場合に処理が完了するまで待機を行い同期的に扱う事が出来る。なので上記コードを修正する

import "babel/polyfill";

(async () => {
  let testFn = () => {
    return new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve('hoge');
      }, 3000);
    });
  }

  let value = await testFn();
  console.log('complete', value);

})();

っていうような感じで使えるようになる。但し、使うにはそのコンテキストがasyncである前提でなければいけないっぽい(そうじゃない場合そもそもトランスパイルが成功しない)

ES7でbabel.jsを使ってトランスパイルする方法は前回のbabelifyでoptionalを設定する方法の記事に書いてるのでここでは省略

angular-cache browserify+babelifyでのオプションの指定