Array.prototype[Symbol.iterator]()

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since May 2018.

Die Methode [Symbol.iterator]() von Array-Instanzen implementiert das iterable protocol und ermöglicht es Arrays, von den meisten Syntaxen verwendet zu werden, die Iterables erwarten, wie zum Beispiel der Spread-Syntax und for...of-Schleifen. Sie gibt ein Array-Iterator-Objekt zurück, das den Wert jedes Indexes im Array liefert.

Der Anfangswert dieser Eigenschaft ist dasselbe Funktionsobjekt wie der Anfangswert der Eigenschaft Array.prototype.values.

Probieren Sie es aus

Syntax

js
array[Symbol.iterator]()

Parameter

Keine.

Rückgabewert

Der gleiche Rückgabewert wie Array.prototype.values(): ein neuer iterable Iterator-Objekt, der den Wert jedes Indexes im Array liefert.

Beispiele

Iteration mit der for...of-Schleife

Beachten Sie, dass Sie diese Methode selten direkt aufrufen müssen. Das Vorhandensein der [Symbol.iterator]()-Methode macht Arrays iterable, und iterierende Syntaxen wie die for...of-Schleife rufen diese Methode automatisch auf, um den Iterator für die Schleife zu erhalten.

HTML

html
<ul id="letterResult"></ul>

JavaScript

js
const arr = ["a", "b", "c"];
const letterResult = document.getElementById("letterResult");
for (const letter of arr) {
  const li = document.createElement("li");
  li.textContent = letter;
  letterResult.appendChild(li);
}

Ergebnis

Manuelles Erstellen des Iterators

Sie können dennoch manuell die next()-Methode des zurückgegebenen Iterator-Objekts aufrufen, um maximale Kontrolle über den Iterationsprozess zu erzielen.

js
const arr = ["a", "b", "c", "d", "e"];
const arrIter = arr[Symbol.iterator]();
console.log(arrIter.next().value); // a
console.log(arrIter.next().value); // b
console.log(arrIter.next().value); // c
console.log(arrIter.next().value); // d
console.log(arrIter.next().value); // e

Umgang mit Strings und String-Arrays mit derselben Funktion

Da sowohl Strings als auch Arrays das Iterable-Protokoll implementieren, kann eine allgemeine Funktion entworfen werden, um beide Eingaben auf die gleiche Weise zu behandeln. Dies ist besser als direkt Array.prototype.values() aufzurufen, was erfordert, dass die Eingabe ein Array oder zumindest ein Objekt mit einer solchen Methode ist.

js
function logIterable(it) {
  if (typeof it[Symbol.iterator] !== "function") {
    console.log(it, "is not iterable.");
    return;
  }
  for (const letter of it) {
    console.log(letter);
  }
}

// Array
logIterable(["a", "b", "c"]);
// a
// b
// c

// String
logIterable("abc");
// a
// b
// c

// Number
logIterable(123);
// 123 is not iterable.

Spezifikationen

Specification
ECMAScript Language Specification
# sec-array.prototype-%symbol.iterator%

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch