Widely available すべての主要ブラウザで対応済み。安心して使用可能。

Async iterators and the for await..of loop

AsyncIterator オブジェクトは 非同期イテレータープロトコル に準拠したオブジェクトで、 next() メソッドを提供することでイテレーターの結果オブジェクトに履行されるプロミスを返します。 AsyncIterator.prototype オブジェクトは、すべての組み込み非同期イテレーターが継承する非表示のグローバルオブジェクトです。これは、非同期イテレーターオブジェクト自身を返す @@asyncIterator メソッドを提供し、非同期イテレーターを非同期反復可能にもします。

なお、AsyncIterator はグローバルオブジェクトではありませんが、将来的には async iterator helpers proposal でグローバルオブジェクトになる予定です。すべての組み込み非同期イテレーターで共有される AsyncIterator.prototype オブジェクトは以下のコードで取得できます。

js

const AsyncIteratorPrototype = Object.getPrototypeOf( Object.getPrototypeOf(Object.getPrototypeOf((async function* () {})())), );

イテレータES2018

対応ブラウザ

機能 デスクトップ モバイル
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
AsyncIterator
63
79
57
11.1
63
11.3
AsyncIterator.@@asyncIterator

[Symbol.asyncIterator]() は AsyncIterator インスタンスのメソッドで、非同期反復可能プロトコルを実装し、組み込みの非同期イテレーターを、 for await...of ループのような非同期反復可能オブジェクトを期待するほとんどの構文で利用できるようにします。これは this の値を返しますが、これは非同期イテレーターオブジェクトそのものです。
63
79
57
11.1
63
11.3
Symbol.asyncIterator

Symbol.asyncIterator は静的データプロパティで、ウェルノウンシンボルの Symbol.asyncIterator を表します。非同期反復可能プロトコルは、オブジェクトの非同期反復子を返すメソッドをこのシンボルで探します。オブジェクトが非同期反復可能であるためには、[Symbol.asyncIterator] キーを持つ必要があります。
63
79
57
11.1
63
11.3
ステートメント
for await of

for await...of 文は、非同期反復可能オブジェクトを、同期反復可能オブジェクトと同様に反復処理するループを作成します。この文は await が使用できるコンテキスト、例えば非同期関数の本体やモジュール内などでのみ使用できます。
63
79
57
12
63
12
async iterators

非同期イテレータ
63
12
57
7
63
7
1+対応 (バージョン) 未対応 ※注釈あり サブ機能の解説は MDN Web Docs (CC BY-SA 2.5)

基本構文

JAVASCRIPT 
// for await...of loop
for await (const chunk of readableStream) {
  process(chunk);
}

ライブデモ

for await...of の基本

Symbol.asyncIterator を実装したオブジェクトを for await...of で反復。

プレビュー全画面表示

配列の Promise を逐次処理

Promise の配列を for await...of で順次解決。

プレビュー全画面表示

通常 iterator との比較

Symbol.iterator と Symbol.asyncIterator の使い分け。

プレビュー全画面表示

実務での使いどころ

  • Async iterators and the for await..of loop の活用

    AsyncIterator オブジェクトは 非同期イテレータープロトコル に準拠したオブジェクトで、 next() メソッドを提供することでイテレーターの結果オブジェクトに履行されるプロミスを返します。

注意点

  • 特になし。すべての主要ブラウザで安定して動作する。

アクセシビリティ

  • JavaScript による動的更新時は、aria-live リージョンで変更をスクリーンリーダーに通知する。

参考リンク