From cb9e359a51c3249d8f5157db69d43fd413ddeda6 Mon Sep 17 00:00:00 2001 From: Florian Merz Date: Thu, 11 Feb 2021 14:45:12 +0100 Subject: unslug ca: move --- .../reference/statements/for...of/index.html | 181 +++++++++++++++++++++ 1 file changed, 181 insertions(+) create mode 100644 files/ca/web/javascript/reference/statements/for...of/index.html (limited to 'files/ca/web/javascript/reference/statements/for...of/index.html') diff --git a/files/ca/web/javascript/reference/statements/for...of/index.html b/files/ca/web/javascript/reference/statements/for...of/index.html new file mode 100644 index 0000000000..5cc16f52f8 --- /dev/null +++ b/files/ca/web/javascript/reference/statements/for...of/index.html @@ -0,0 +1,181 @@ +--- +title: for...of +slug: Web/JavaScript/Referencia/Sentencies/for...of +translation_of: Web/JavaScript/Reference/Statements/for...of +--- +
+
{{jsSidebar("Statements")}}
+
+ +

Resum

+ +

La instrucció for...of crea un bucle que itera sobre objectes iterables (incloent {{jsxref("Array")}}, {{jsxref("Map")}}, {{jsxref("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 {{jsxref("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 {{domxref("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

+ + + + + + + + + + + + + + +
EspecificacióEstatComentari
{{SpecName('ES6', '#sec-for-in-and-for-of-statements', 'for...of statement')}}{{Spec2('ES6')}}Definició inicial.
+ +

Compatibilitat amb navegadors

+ +

{{CompatibilityTable()}}

+ +
+ + + + + + + + + + + + + + + + + + + +
CaracterísticaChromeFirefox (Gecko)Internet ExplorerOperaSafari
Suport bàsic{{CompatChrome(29)}}[1]
+ {{CompatChrome(38)}}		{{CompatGeckoDesktop("13")}}
+ {{CompatGeckoDesktop("17")}} (.iterator)
+ {{CompatGeckoDesktop("27")}} ("@@iterator")
+ {{CompatGeckoDesktop("36")}} (Symbol.iterator)		{{CompatNo}}257.1
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
CaracterísticaAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Suport bàsic{{CompatUnknown}}{{CompatChrome(29)}}[1]
+ {{CompatChrome(38)}}		{{CompatGeckoMobile("13")}}
+ {{CompatGeckoMobile("17")}} (.iterator)
+ {{CompatGeckoMobile("27")}} ("@@iterator")
+ {{CompatGeckoMobile("36")}} (Symbol.iterator)		{{CompatUnknown}}{{CompatUnknown}}iOS 8
+
+ +

[1] La característica està disponible sota una preferència. A chrome://flags/#enable-javascript-harmony, activar la entrada “Enable Experimental JavaScript”.

+ +

Vegeu també

+ + -- cgit v1.2.3-54-g00ecf