Dal 2015, EcmaScript6 (ES6) ha portato molti progressi nelle pratiche di codifica JavaScript. Numerosi concetti moderni sono stati introdotti in JavaScript, migliorando notevolmente l'esperienza di codifica. In questo articolo imparerai a conoscere iteratori e generatori in JavaScript.
Iteratori e generatori sono due concetti diversi, ma vengono utilizzati in modi simili. Sono usati per scorrere gli array e gli oggetti in JavaScript.
Iteratori
Gli iteratori sono come cicli avanzati che possono essere messi in pausa. Gli iteratori sono costituiti dalla funzione next() , che restituisce il valore e lo stato done. Il campo valore è il valore nell'array in corrispondenza di un determinato indice. done è il valore booleano che restituisce lo stato di completamento dell'iterazione del ciclo.
Ecco un esempio che dimostra come gli iteratori:
function fruitIter(fruits){ let index = 0; return { next: function(){ return index < fruits.length="" {="" value:="" fruits[index++],="" done:="" false="" }="" :="" {done:=""> } } } const fruitsArray = ["Mango", "Banana", "Grapes"]; const fruits = fruitIter(fruitsArray); console.log(fruits.next().value);
Uscita :
Mango
Quando passi l' arrayfruitsArray nel metodo fruitIter() , restituisce un iteratore memorizzato nella variabile fruit . La variabile index nel metodo fruitIter() viene inizializzata su 0. Questo metodo restituisce la funzione next() che aiuta a scorrere l'array . La funzione next() controlla se l'indice è inferiore alla lunghezza di fruitArray . In tal caso, restituisce due variabili: il nome del frutto in quell'indice e lo stato di fine . Mentre restituisce questi valori, incrementa anche il valore dell'indice.
Per controllare come funziona questo metodo e stampare il nome di frutta, è necessario chiamare il successivo () funzione sui frutti iteratore e ottenere l'accesso al suo valore.
Correlati: che cos'è una funzione nella programmazione?
Generatori
I generatori sono simili agli iteratori ma restituiscono più valori. Questi valori sono chiamati valori di rendimento. Le funzioni del generatore vengono scritte utilizzando la sintassi function* . * denota che non è una normale funzione, ma un generatore. Ecco un esempio di generatori:
function* printFruits(){ yield "Mango"; yield "Banana"; yield "Grapes"; } const fruit = printFruits(); console.log(fruit.next());
Uscita :
{valore: 'Mango', fatto: falso}
In questo esempio, yield è l'iteratore. Quando chiami la funzione printFruits() e print fruit.next() , ti dà un oggetto in cui ottieni il valore. Lo stato done indica se tutti i valori sono stati ripetuti.
Impara le strutture dati usando le classi ES6 in JavaScript
JavaScript ES6 ha portato molti progressi nelle pratiche di codifica. Non ultimo è la costruzione di strutture dati utilizzando le classi ES6. Spingere. pop, e impilati fino in cima e diventa un professionista JavaScript!