for...of

by 2 contributors:

これは Harmony(ECMAScript 6) 提案の一部であり、実験段階の技術です。
この技術の仕様は安定していません。ブラウザ互換性の一覧表を確認してください。またこれらの構文や動作は、仕様変更などにより、新しいバージョンのブラウザでは変更される可能性があるという点に注意してください。

反復処理可能なオブジェクト (Array、Array に類似するオブジェクト、イテレータやジェネレータを含む) に反復処理を行い、各々のプロパティの値に対して実行する文とともに独自の反復処理のフックを呼び出します。

構文

for (variable of object)
  statement
variable
各々の反復処理において、別々のプロパティの値が variable に代入されます。
object
列挙可能なプロパティに対して、反復処理を行うオブジェクトです。

以下の例で、for...of ループと for...in ループの違いを示します。for...in はプロパティ名に対して反復するのに対して、for...of はプロパティの値に対して反復します:

let arr = [ 3, 5, 7 ];
arr.foo = "hello";

for (let i in arr) {
   console.log(i); // "0", "1", "2", "foo" を出力
}

for (let i of arr) {
   console.log(i); // logs "3", "5", "7" を出力
}

NodeList のような DOM コレクションへの反復処理: 以下の例では、article の直系の子孫要素であるパラグラフに対して read クラスを追加しています:

let articleParagraphs = document.querySelectorAll("article > p");

for (let paragraph of articleParagraphs) {
  paragraph.classList.add("read");
}

ジェネレータに対して反復することも可能です:

// 注記: "function*" は Firefox でサポートしていません。
// Firefox 13 でこのコードを動作させるには、アスタリスクを削除してください。

function* fibonacci() { // ジェネレータ関数
    let [prev, curr] = [0, 1];
    for (;;) {
        [prev, curr] = [curr, prev + curr];
        yield curr;
    }
}

for (let n of fibonacci()) {
    // 1000 のときに反復終了
    if (n > 1000)
        break;
    print(n);
}

ブラウザ実装状況

機能 Chrome Firefox (Gecko) Internet Explorer Opera Safari
基本サポート ? 13 (13) バグ 699565 ? ? ?
機能 Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
基本サポート ? ? 13.0 (13) バグ 699565 ? ? ?

関連情報

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

Contributors to this page: teoli, yyss
最終更新者: teoli,
サイドバーを隠す