Firefox 13.0a1 (Nightly) で for-of ステートメントが実装されました

Firefox 13.0a1 (Nightly 2012-02-09) あたりから、ES.next の新たな構文である、for-ofステートメントが追加されました。

この構文は、配列の様なオブジェクトに対して使えるもので、for-in 構文が key を取ってくるのに対して、for-of は value を得られるものとなります。

for (var item of ["a","b","c"]){
  console.log(item);
}
// "a"
// "b"
// "c"

対象となるオブジェクト

配列の様なオブジェクトと書いたとおり、純粋な配列以外にも使えます。

  • Argumentsオブジェクト
  • HTMLCollectionオブジェクト
  • NodeListオブジェクト

あたりで使えます。

逆に対象外のオブジェクトの場合は、以下の様に例外を出します。

var obj = { a: "A" };
for (var value of obj) { }

// TypeError: obj is not iterable

用例

for (var elm of document.body.childNodes) {
  // ...
}

for (var elm of document.querySelectorAll("div")) {
  // ...
}

for (var elm of document.getElementsByTagName("div")) {
  // ...
}

function foo () {
  for (var arg of aruments) {
    // ...
  }
}

今まで、for ( ; ; )を使っていたのに比べれば多少楽な書き方が可能になるわけです。

for-each-in とは違うの?

ちょっと追記。

for-each-in は for-in と似た動きで、keyではなくvalueを取ってきます。また、現状*1ではfor-ofは配列のようなものに対してのみ使えますが、for-each-inはオブジェクトにも使えます。

var o = {
  a: "A",
  b: "B",
};
for each (var v in o) {
  console.log(v);
}
// "A"
// "B"
Object.prototype.foo = "PROTO";
for each (var v in o) {
  console.log(v);
}
// "A"
// "B"
// "PROTO"

また、for-each-in は for-in と同じく、プロトタイプ内の列挙可能プロパティもイテレートします。

逆に、for-of では

var array = ["a","b","c"];
Array.prototype[3] = "d";
for (var v in array) {
  console.log(v);
}
// "a"
// "b"
// "c"

と、プロトタイプ内までは見ません。

あと、for-each-in は E4X 実装による産物であって純粋なECMAScriptではないので、他のJavaScriptエンジンで実装されることはないと思います。

バグと思われるもの

http://cache.gyazo.com/7333bdc7406426a51fd057ba9750224b.png

えーと、まだ使わない方が良さそうです ^^;

*1:正直、現状のfor-ofが仕様に沿った正しい挙動なのか分からないわけだが...