¿Qué son los iteradores en JavaScript?

JavaScript ofrece varias formas de iterar a través de una colección de valores de objetos como bucles. Sin embargo, Iteradores se introducen en JavaScript 1.7, que proporciona un mecanismo para personalizar el comportamiento de para cada y para ... en bucles e integra el concepto de iteración en el lenguaje central.

Si necesita agregar funcionalidad iterativa nativa a una estructura de datos bien encapsulada y personalizada, debe usar Iteradores de JavaScript. Se puede considerar una forma más elegante de estandarizar sus objetos personalizados.

Este artículo discutirá iteradores en Javascript. También demostraremos el uso de iteradores, iterables, método Next () e iteradores definidos por el usuario. Entonces, comencemos!

Iteración en JavaScript

En JavaScript, Iteración es un procedimiento en el que una colección de estructuras o instrucciones se repite en una secuencia para un número predeterminado de veces o hasta que la condición agregada sea verdadera. Puedes utilizar bucles para iterar sobre el conjunto especificado de instrucciones.

Por ejemplo, hemos declarado una matriz "contando"Y con la ayuda del"por ... de"Loop, iteraremos sobre la matriz especificada:

Contando constante = [1, 2, 3];
para (dejar x de contar)
consola.log (x);

Como resultado de él, cada valor se devolverá y se mostrará como salida:

Ahora, verifiquemos el método para iterar sobre un objeto JavaScript. Para este propósito, en primer lugar, declararemos un objeto llamado "empleado"Y luego utilizar por ... de bucle para iterar sobre sus propiedades:

const empleado = nombre: 'Alex', Designation: 'Manager';
para (constante constante de empleado)
consola.log (prop);

Como puede ver, la salida del código mencionado anteriormente mostró un "Error de tecleado"Mensaje que establece que el"empleado"El objeto no es itreable. Por que sucede? Hemos encontrado el typeError porque el para ... de bucle requiere un objeto iterable para iterar sobre las propiedades del objeto.

Para manejar la situación actual, puede usar el Protocolo de iteración JavaScript, que lo ayudará a hacer que un objeto sea iterable para iterar sobre sus propiedades.

Protocolo de iteración de JavaScript

JavaScript proporciona un protocolo de iteración para iterar sobre objetos. Este protocolo especifica el procedimiento de iteración utilizando "por ... de " bucle. Los iteradores de JavaScript se dividen en dos componentes: "Iterable" y "Iteradores":

• Iterable: Iterables son los objetos que implementan el "iterador ()"Método de iteración I.mi. matriz o cadena.
• Iteradores: El objeto devuelto por el "iterador ()"El método se conoce como"Iterador". Después de obtener el iterador, puede usar el "próximo()"Método para acceder secuencialmente en elementos iterables.

Puede ser difícil para usted comprender el uso de estos métodos de un vistazo, por lo que revisaremos secuencialmente cada uno de ellos en las secciones dadas a continuación.

Método Next () en JavaScript

"próximo()"Es un método de objeto Iterator que se invoca para devolver el siguiente valor en la secuencia de iteración. Este método comprende las siguientes dos propiedades:

• El "valor"La propiedad representa el valor actual en la secuencia de iteración, y puede ser de cualquier tipo de datos.
• El "hecho"La propiedad se utiliza para representar el estado de iteración, donde"FALSO"Significa que la iteración no está completa y"verdadero"Indica que el proceso de iteración se completa.

Definamos un iterador personalizado en JavaScript y accedamos a los elementos de una matriz secuencialmente usando el método Next ().

Creación de iteradores definidos por el usuario en JavaScript

JavaScript le permite crear un iterador definido por el usuario e invocar el "próximo()"Método para acceder a los elementos del objeto Iterable.

Aquí, hemos definido el "showElement ()"Método y devolverá el"valor" y "hecho"Propiedad del objeto Iterable que se acepta como argumento:

función showElements (arr)
Sea número = 0;
devolver
próximo()
if (número < array.length)
devolver
Valor: Array [número ++],
hecho: falso

devolver
Valor: indefinido,
hecho: verdadero

En el siguiente paso, crearemos un "formación"Y luego pasarlo al"showElement ()Método como argumento. Entonces el "showElements ()"El método devolverá un objeto iterable, al que nos almacenaremos"arritador":

const array = ['l', 'i', 'n', 'u', 'x'];
consteRiterator = showElements (array);

Ahora, cada vez cuando el "próximo()"El método se invoca con el"arritador", Mostrará los valores del elemento de matriz en una secuencia con el definido"valor" y "hecho" propiedades:

consola.Log (Arriterator.próximo());
consola.Log (Arriterator.próximo());
consola.Log (Arriterator.próximo());
consola.Log (Arriterator.próximo());
consola.Log (Arriterator.próximo());
consola.Log (Arriterator.próximo());

Cuando se iteran todos los elementos, el "valor"El valor de la propiedad se establecerá en"indefinido", con "hecho"Propiedad como"verdadero":

La salida dada anteriormente significa que hemos creado y ejecutado con éxito un iterador definido por el usuario en nuestro programa utilizando el método Next (). Ahora, comprendamos el concepto de iterables también y tengamos una comprensión clara y profunda de Símbolo.iterador () en JavaScript

Ejemplo: Creación de iteradores a partir de iterables usando símbolo.Método Iterator () en JavaScript
En este ejemplo, en primer lugar, declararemos una matriz con los siguientes tres valores:

const arr1 = ['l', 'i', 'n', 'u', 'x'];

Entonces, invocaremos el "Símbolo.iterador ()"Método que devolverá un objeto iterable y"arritador"Almacenará su valor:

Const Arriterator = ARR1 [Símbolo.iterador] ();
consola.log (Arriterator);

La ejecución del programa anterior generará los iteradores de la matriz:

Ejemplo: Uso del método Next () sobre un objeto Iterable en JavaScript
Este ejemplo demostrará el uso de "próximo()"Método para iterar sobre un objeto iterable. Para hacerlo, en primer lugar, crearemos un "formación"Y luego invoca el"Símbolo.iterador ()Método para devolver un objeto Iterer:

const array = ['l', 'i', 'n', 'u', 'x'];
Let Arriterator = Array [símbolo.iterador] ();

Invocando el "próximo()"También devolverá un objeto que tenga"valor" y "hecho" valores de propiedad:

consola.Log (Arriterator.próximo());
consola.Log (Arriterator.próximo());
consola.Log (Arriterator.próximo());
consola.Log (Arriterator.próximo());
consola.Log (Arriterator.próximo());
consola.Log (Arriterator.próximo());

Al final de la secuencia de iteración, el "hecho"Propiedad del"próximo()"El método está configurado en"FALSO":

Ejemplo: iterando a través de Iterables con While Loop en JavaScript
El símbolo.iterador () El método es llamado automáticamente por el para ... de bucle. Si quieres invocarlo manualmente, puedes usar el "mientras"Loop para iterar sobre el objeto ITerable especificado.

Por ejemplo, en el ejemplo dado a continuación, usaremos el "mientras"Loop para iterar sobre los objetos iterables devueltos por el"Símbolo.iterador ()" método:

const array = ['l', 'i', 'n', 'u', 'x'];
Let Arriterator = Array [símbolo.iterador] ();
Dejar texto = ""
while (verdadero)
Const Result = Arriterator.próximo();
if (resultado.hecho) romper;
consola.Log ("Valor:"+ resultado.valor + "hecho:" + resultado.hecho);

Aquí, la salida muestra el resultado devuelto con "valor" y "hecho"Propiedades del iterador:

Mire el siguiente diagrama para comprender la relación entre iterables, el método siguiente () e iteradores en JavaScript:

Eso se trataba del uso básico de los iteradores en JavaScript. Puede explorarlo más de acuerdo con sus preferencias.

Conclusión

Los iteradores en JavaScript se utilizan para el bucle en una secuencia de valores de objeto devueltos por el símbolo.Método iterator (). Este proceso también implica la implementación del método Next () que devuelve un objeto con el valor y las propiedades de realización, donde "valor"Representa el valor de secuencia actual y"hecho"Determina si la iteración se completa o no. Este artículo discutió los iteradores de JavaScript con la ayuda de ejemplos adecuados.