for...of

Resum

La instrucci贸 for...of crea un bucle que itera sobre objectes iterables (incloent ArrayMap, Set, l'objecte arguments, etc猫tera), tot invocant un bloc de codi amb les instruccions a executar per a cada valor de la propietat.

Sintaxi

for (variable of objecte)
  codi
variable
A cada iteraci贸 el valor d'una propietat diferent 茅s asignat a variable.
objecte
L'objecte del qual s'iteren les propietats, que s贸n iterables.

Exemples

Difer猫ncia entre for...of i for...in

El seg眉ent exemple mostra la difer猫ncia entre el bucle for...of i el bucle for...in. Mentre for...in itera sobre noms de propietats, for...of itera sobre els valors de les propietats:

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

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

for (let i of arr) {
   console.log(i); // mostra "3", "5", "7"
}

脷s de Array.prototype.forEach()

Per a aconseguir els mateixos valors que s'obtenen amb for...of tamb茅 es pot utilitzar el m猫tode Array.prototype.forEach():

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

arr.forEach(function (element, index) {
    console.log(element); // mostra "3", "5", "7"
    console.log(index);   // mostra "0", "1", "2"
});

// or with Object.keys()

Object.keys(arr).forEach(function (element, index) {
    console.log(arr[element]); // mostra "3", "5", "7", "hello"
    console.log(arr[index]);   // mostra "3", "5", "7"
});

Iteraci贸 de coleccions del DOM

Iterant sobre coleccions del DOM com NodeList: el seg眉ent exemple afegeix la classe read als par脿grafs que s贸n descendens directes d'un article:

// Nota: Aix貌 nom茅s funcionar脿 en plataformes que
// implementen NodeList.prototype[Symbol.iterator]
let articleParagraphs = document.querySelectorAll("article > p");

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

Iteraci贸 de generadors:

Els generadors tamb茅 s贸n iterables:

function* fibonacci() { // una funci贸 generadora
    let [prev, curr] = [0, 1];
    for (;;) {
        [prev, curr] = [curr, prev + curr];
        yield curr;
    }
}

for (let n of fibonacci()) {
    // trunca la seq眉猫ncia als 1000
    if (n > 1000)
        break;
    print(n);
}

Especificacions

Compatibilitat amb navegadors

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!
Caracter铆stica Chrome Firefox (Gecko) Internet Explorer Opera Safari
Suport b脿sic 29[1]
38
13 (13)
17 (17) (.iterator)
27 (27) ("@@iterator")
36 (36) (Symbol.iterator)
No support 25 7.1
Caracter铆stica Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Suport b脿sic ? 29[1]
38
13.0 (13)
17.0 (17) (.iterator)
27.0 (27) ("@@iterator")
36.0 (36) (Symbol.iterator)
? ? iOS 8

[1] La caracter铆stica est脿 disponible sota una prefer猫ncia. A chrome://flags/#enable-javascript-harmony, activar la entrada 鈥淓nable Experimental JavaScript鈥.

Vegeu tamb茅