En introduksjon til Iteratorer og generatorer i JavaScript

Siden 2015 har EcmaScript6 (ES6) brakt mange fremskritt innen JavaScript -kodingspraksis. Mange moderne konsepter ble introdusert for JavaScript, noe som forbedret kodeopplevelsen sterkt. I denne artikkelen lærer du om iteratorer og generatorer i JavaScript.

Iteratorer og generatorer er to forskjellige konsepter, men de brukes på lignende måter. De er vant til å iterere gjennom matriser og objekter i JavaScript.

Iteratorer

Iteratorer er som avanserte sløyfer som kan settes på pause. Iteratorer består av neste () funksjon, som returnerer verdien og ferdigstatusen. De verdi feltet er verdien i matrisen ved en gitt indeks. gjort er den boolske verdien som returnerer statusen for fullføring for iterasjonen gjennom løkken.

Her er et eksempel som viser hvordan iteratorer:

function fruitIter (frukt) {
la indeks = 0;
komme tilbake {
neste: function () {
returindeks }
}
}
const fruitsArray = ["Mango", "Banana", "Druer"];
const fruits = fruitIter (fruitsArray);
console.log (fruits.next (). verdi);

Produksjon:

Mango

Når du passerer fruktArray array i fruitIter () metoden, returnerer den en iterator som er lagret i frukt variabel. De indeks variabel i fruitIter () metoden initialiseres til 0. Denne metoden returnerer neste () funksjon som hjelper til sløyfe gjennom matrisen. De neste () funksjonen sjekker om indeksen er mindre enn fruktArray lengde. I så fall returnerer den to variabler: fruktnavnet ved indeksen og gjort status. Når du returnerer disse verdiene, øker det også indeksverdien.

For å sjekke hvordan denne metoden fungerer og skrive ut fruktnavnet, må du ringe til neste () funksjon på frukt iterator og få tilgang til verdien.

I slekt: Hva er en funksjon i programmering?

Generatorer

Generatorer ligner på Iterators, men de returnerer flere verdier. Disse verdiene kalles avkastningsverdier. Generatorfunksjoner skrives med funksjon* syntaks. * angir at det ikke er en normal funksjon, men en generator. Her er et eksempel på generatorer:

funksjon* printFruits () {
gi "Mango";
gi "Banan";
gi "Druer";
}
const fruit = printFruits ();
console.log (fruit.next ()); 

Produksjon:

{value: 'Mango', done: false}

I dette eksemplet, utbytte er iteratoren. Når du ringer funksjonen printFruits ()og skrive ut fruit.next (), det gir deg et objekt der du får verdien. De gjort status angir om alle verdier har blitt iterert gjennom.

Lær datastrukturer ved hjelp av ES6 -klasser i JavaScript

JavaScript ES6 ga mye fremskritt innen kodingspraksis. Ikke minst er det å bygge datastrukturer ved bruk av ES6 -klasser. Trykk. pop, og stable deg til toppen og bli en JavaScript -proff!

Hvordan bygge datastrukturer med JavaScript ES6 -klasser

Med introduksjonen av JavaScript ES6 kom tilpassede datastrukturer. Slik oppretter og bruker du dem.

Les neste

Om forfatteren