Array : méthode [Symbol.iterator]()

Baseline Widely available

Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis ⁨septembre 2016⁩.

La méthode[Symbol.iterator]() des instances deArray implémente leprotocole itérable et permet aux tableaux d'être parcourus par la plupart des syntaxes qui attendent un itérable, comme lasyntaxe de l'opérateur de propagation et les bouclesfor...of. Elle retourne unobjet itérateur de tableau qui fournit la valeur de chaque indice du tableau.

La valeur initiale de cette propriété est la même fonction que la valeur initiale de la propriétéArray.prototype.values.

Exemple interactif

const array = ["a", "b", "c"];const iterator = array[Symbol.iterator]();for (const value of iterator) {  console.log(value);}// Résultat attendu : "a"// Résultat attendu : "b"// Résultat attendu : "c"

Syntaxe

array[Symbol.iterator]()

Paramètres

Aucun.

Valeur de retour

La même valeur de retour queArray.prototype.values() : un nouvelobjet d'itérateur itérable qui fournit la valeur de chaque indice du tableau.

Exemples

Itération avec une boucle`for...of`

Notez qu'il est rare d'avoir à appeler cette méthode directement. La présence de la méthode[Symbol.iterator]() rend les tableauxitérables, et les syntaxes d'itération comme la bouclefor...of appellent automatiquement cette méthode pour obtenir l'itérateur à parcourir.

HTML

html

<ul></ul>

JavaScript

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);}

Résultat

Utiliser manuellement l'itérateur

Vous pouvez toujours appeler manuellement la méthodenext() de l'objet itérateur retourné pour avoir un contrôle maximal sur le processus d'itération.

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

Gérer les chaînes de caractères et les tableaux de chaînes avec la même fonction

Puisque leschaînes de caractères et les tableaux implémentent le protocole itérable, il est possible de concevoir une fonction générique pour traiter les deux types d'entrée de la même manière. Cela est préférable à l'appel direct deArray.prototype.values(), qui nécessite que l'entrée soit un tableau ou au moins un objet possédant cette méthode.

function logIterable(it) {  if (typeof it[Symbol.iterator] !== "function") {    console.log(it, "n'est pas itérable.");    return;  }  for (const letter of it) {    console.log(letter);  }}// TableaulogIterable(["a", "b", "c"]);// a// b// c// Chaîne de caractèreslogIterable("abc");// a// b// c// NombrelogIterable(123);// 123 n'est pas itérable.