Iterables
Los objetos iterables generalizan el concepto de arrays, permitiendo que cualquier objeto pueda utilizarse en un bucle for..of. Además de los arrays, hay otros muchos objetos integrados que también son iterables. Por ejemplo, las cadenas de texto (strings) también lo son. Como veremos, muchos operadores y métodos dependen de la iterabilidad.
Aunque un objeto no sea técnicamente un array, si representa una colección (lista, conjunto, etc.) de elementos, es conveniente usar la sintaxis for..of para recorrerlo. Veamos cómo funciona.
Symbol.iterator
Para comprender fácilmente el concepto de iterables, podemos crear uno. Supongamos que tenemos un objeto que no es un array, pero queremos que se pueda recorrer con for..of. Por ejemplo, un objeto range que representa un intervalo de números:
let range = {
from: 1,
to: 5
};
Queremos que el for..of funcione de la siguiente manera:
for(let num of range) {
// num = 1, 2, 3, 4, 5
}
Para que range sea iterable, necesitamos agregarle un método llamado Symbol.iterator (un símbolo incorporado especial utilizado para esa función).
Cuando se inicia for..of, este llama al método Symbol.iterator una vez (o genera un error si no lo encuentra). El método debe devolver un iterador: un objeto con el método next(). A partir de ese momento, for..of trabaja únicamente con ese objeto devuelto. Cuando for..of necesita el siguiente valor, llama a next() en ese objeto. El resultado de next() debe tener la forma {done: Boolean, value: any}, donde done=true indica que el bucle ha finalizado; de lo contrario, el nuevo valor es value.
Aquí está la implementación completa de range:
let range = {
from: 1,
to: 5
};
// 1. Una llamada a for..of inicializa una llamada a esto:
range[Symbol.iterator] = function() {
// ... devuelve el objeto iterador:
// 2. En adelante, for..of trabaja solo con el objeto iterador debajo, pidiéndole los siguientes valores
return {
current: this.from,
last: this.to,
// 3. next() es llamado en cada iteración por el bucle for..of
next() {
// 4. debe devolver el valor como un objeto {done:.., value :...}
if (this.current <= this.last) {
return { done: false, value: this.current++ };
} else {
return { done: true };
}
}
};
};
// ¡Ahora funciona!
for (let num of range) {
alert(num); // 1, luego 2, 3, 4, 5
}
Notemos una característica esencial de los iterables: la separación de conceptos. El objeto range en sí mismo no tiene el método next(). En su lugar, la llamada a range[Symbol.iterator]() crea otro objeto llamado “iterador”, y su next() genera valores para la iteración. Por lo tanto, el objeto iterador está separado del objeto sobre el que itera.
Técnicamente, podríamos fusionarlos y usar el range mismo como iterador para simplificar el código. De esta manera:
let range = {
from: 1,
to: 5,
[Symbol.iterator]() {
this.current = this.from;
return this;
},
next() {
if (this.current <= this.to) {
return { done: false, value: this.current++ };
} else {
return { done: true };
}
}
};
for (let num of range) {
alert(num); // 1, luego 2, 3, 4, 5
}
Ahora range[Symbol.iterator]() devuelve el objeto range en sí: tiene el método next() necesario y recuerda el progreso de iteración actual en this.current. Es más corto y, a veces, eso también está bien.
La desventaja es que ahora es imposible tener dos bucles for..of corriendo sobre el objeto simultáneamente: compartirán el estado de iteración, porque solo hay un iterador: el objeto en sí. Pero dos for-of paralelos son raros, incluso en escenarios asíncronos.
Iteradores Infinitos
También es posible tener iteradores infinitos. Por ejemplo, el objeto range puede volverse infinito si range.to = Infinity. O podemos crear un objeto iterable que genere una secuencia infinita de números pseudoaleatorios. Esto puede ser útil en algunos casos.
Por supuesto, el bucle for..of sobre un iterable de este tipo sería interminable. Pero siempre podemos detenerlo usando break.
String es iterable
Las matrices y cadenas son los iterables integrados más utilizados.
En una cadena o string, el bucle for..of recorre sus caracteres:
for (let char of "test") {
alert(char); // t, luego e, luego s, luego t
}
¡Y funciona correctamente con valores de pares sustitutos (codificación UTF-16)!
let str = '𝒳😂';
for (let char of str) {
alert(char); // 𝒳, y luego 😂
}
let str = "Hola";
// hace lo mismo que
// for (let char of str) alert(char);
let iterator = str[Symbol.iterator]();
while (true) {
let result = iterator.next();
if (result.done) break;
alert(result.value); // retorna los caracteres uno por uno
}
let arrayLike = {
0: "Hola",
1: "Mundo",
length: 2
};
// Error (sin Symbol.iterator)
for (let item of arrayLike) {}
let arrayLike = {
0: "Hola",
1: "Mundo",
length: 2
};
let arr = Array.from(arrayLike); // (*)
alert(arr.pop()); // Mundo (el método pop funciona)
// suponiendo que range se toma del ejemplo anterior
let arr = Array.from(range);
alert(arr); // 1,2,3,4,5 (la conversión de matriz a cadena funciona)
Array.from(obj[, mapFn, thisArg])
// suponiendo que range se toma del ejemplo anterior
// el cuadrado de cada número
let arr = Array.from(range, num => num * num);
alert(arr); // 1,4,9,16,25
let str = '𝒳😂';
// separa str en un array de caracteres
let chars = Array.from(str);
alert(chars[0]); // 𝒳
alert(chars[1]); // 😂
alert(chars.length); // 2
let str = '𝒳😂';
let chars = []; // Array.from internamente hace el mismo bucle
for (let char of str) {
chars.push(char);
}
alert(chars);
function slice(str, start, end) {
return Array.from(str).slice(start, end).join('');
}
let str = '𝒳😂𩷶';
alert(slice(str, 1, 3)); // 😂𩷶
// el método nativo no admite pares sustitutos
alert(str.slice(1, 3)); // basura (dos piezas de diferentes pares sustitutos)
