En este capítulo vamos a ver una característica que tienen algunos de los tipos de datos, tanto de los nuevos como de los que ya existían en Javascript. Vamos a hablar de los iterables y de los iteradores.
Iterable
Cuando hablamos de que una variable es iterable, o que un tipo de dato es iterable, significa que es una estructura de datos lineal que hace que sus elementos sean públicos y se puedan recorrer, por ejm, los Arrays, los String, los Maps, los Sets… e incluso los elementos del DOM como son los nodos del DOM. Al ser elementos iterables guardan algunas características.
Iterador
Lo que se conoce como iterador es la interfaz, una especie de apuntador que va recorriendo los elementos de la misma estructura de datos.
Por lo tanto, iterable es el elemento el cual su contenido se puede recorrer, y el iterador es el apuntador que está recorriendo dichos elementos iterables, el mecanismo que los está recorriendo.
En base a esto podemos tener diferentes mecanismos para recorrer o consumir un elemento iterable, como puede ser la destructuración, los métodos for, forof, forin, forEach, el método array.from(), el spread operator, las promesas… Pero hay un elemento que es el iterador, y con un método especial llamdo next() estar recorriendo cada uno de los elementos que tenga nuestra estructura iterable.
Acceder a la interface del iterador
Veamos con un ejm como acceder a la interface del mismo iterador.
Ejm
const iterable = "[1,2,3,4,5]"; // Accedemos al iterador de nuestro iterable const iterador = iterable[Symbol.iterator](); console.log(iterable); console.log(iterador);
Recorrer cada uno de los elementos
Al tener el iterator guardado en la variable iterador, podemos ejecutar un método especial que tiene el iterador, denominado next(), de la siguiente manera.
Ejm
console.log(iterador.next())
El iterador siempre va a devolver un objeto con dos propiedades, el valor como tal y un segundo parámetro que indica si ya se acabaron los elementos, se trata por tanto de una .
Veamos un ejm para entender como funciona.
Ejm
const iterable = [1,2,3,4,5];
// Accedemos al iterador de nuestro iterable
const iterador = iterable[Symbol.iterator]();
console.log(iterable);
console.log(iterador);
// Hacer un ciclo que recorra todos los iterables
let next = iterador.next();
while (!next.done) {
console.log(next.value);
next = iterador.next();
}Esto es lo que se conoce como el iterador, que es una interfaz especial mediante la cual podemos acceder a todo tipo de datos que sean iterables.
En el siguiente capítulo vamos a ver una nueva sintaxis con un nuevo tipo de función que se denominan generadores, que es una manera más sencilla de trabajar con los iteradores de nuestros tipos de datos que sean iterables.