読者です 読者をやめる 読者になる 読者になる

Browser

Microsoft Edge(Project Spartan, Internet Explorer) 、ブラウザ周辺、Web フロントエンド開発、UI、など

Microsoft Edge まとめページ

Microsoft Edge の機能を調べてみた - Async Functions(async/await) 編

今回は MICROSOFT EDGE DEV BLOG の記事から抜粋

 

非同期処理を簡単に記述する async / await が ES7/ES2016 で導入される予定で、Build 10547 の Microsoft Edge で実装されました。
(Build 10532 でも動きましたが実装に問題があったようです)

async / await 非同期メソッドC# 5.0 と Visual Basic 11.0 で採用されており、
自分の記憶では Windows ストアアプリで 50ms 以上かかる可能性のある処理はほぼこちらを使うようになっていたはずです。
UI の動作時処理が重いと画面が固まってしまうため、iOS / OSX の Grand Central Dispatch と同じ理由で使われていると思われます。

非同期処理は旧来の方法や Edge で導入された Promise で対応したりでできますが、Async 関数を使うともう少し簡素に記述することができます。

 

Async 関数の現状

2015/9/28 で Stage 3 (Candidate)

たぶん、このまま ES7/ES2016 の機能として取り入れられるでしょう。
また、リンク先は表記は Draft になっており間違えていると思われます。

 

Async 関数を使うための準備

現状、プレビューの機能ですので Windows 10 Build 10547 の Microsoft Edge を使います。

いつもの様にアドレスバー へ about:flags 入力後、
「試験的な JavaScript 機能を有効にする」をオンにしてください。

 

Async 関数の使い方
  • 関数の前に async と書き、その関数の中の関数に await と書くと非同期用関数を呼び出して結果を待つ
  • async を使用した関数のスコープでのみ await が使える
  • グローバルで await は使えない

Promise は非同期処理の記述が楽になりましたが、問題がありコールバックを使う部分がまだあります。
以下のサンプルでは httpGetJson の記述が変更されています。

 

async / await キーワードを付けることでアロー関数でも使用することができます。

 

Chakra での実装と内部の非同期処理については更に小難しいので割愛。

 

個人的感想

主に try / catch や Promise の中で使うのがメインになりそう。
仕様によると Generator 関数宣言の頭に async キーワード入れたり、 yield の直後で await キーワードは使えない模様。
Generator 関数自体を await にすることはできた。


余談

この機能はインターンの方がつくっているみたいですね。
たしか、Office Sway とかもインターンの方がつくっていたはずです。

スポンサーリンク