JavaScript-generatorer

I denne veiledningen vil du lære om JavaScript-generatorer ved hjelp av eksempler.

I JavaScript gir generatorer en ny måte å jobbe med funksjoner og iteratorer på.

Ved hjelp av en generator,

  • du kan stoppe utførelsen av en funksjon fra hvor som helst i funksjonen
  • og fortsett å utføre kode fra en stoppet posisjon

Opprett JavaScript-generatorer

For å lage en generator, må du først definere en generatorfunksjon med function*symbol. Objektene til generatorfunksjonene kalles generatorer.

 // define a generator function function* generator_function() (… ) // creating a generator const generator_obj = generator_function();

Merk : Generatorfunksjonen er betegnet med *. Du kan enten bruke function* generatorFunc() (… )eller function *generatorFunc()(… )lage dem.

Bruke avkastning for å pause utførelse

Som nevnt ovenfor kan du stoppe utførelsen av en generatorfunksjon midlertidig uten å utføre hele funksjonsdelen. Til det bruker vi yieldnøkkelordet. For eksempel,

 // generator function function* generatorFunc() ( console.log("1. code before the first yield"); yield 100; console.log("2. code before the second yield"); yield 200; ) // returns generator object const generator = generatorFunc(); console.log(generator.next());

Produksjon

 1. kode før første avkastning (verdi: 100, ferdig: usann)

Her,

  • Et generatorobjekt med navn generatorblir opprettet.
  • Når generator.next()kalles, blir koden frem til den første yieldutført. Når yielddet oppstår, returnerer programmet verdien og stopper generatorfunksjonen midlertidig.

Merk : Du må tilordne generatorobjekter til en variabel før du bruker den.

Arbeid med flere avkastningsuttalelser

Den yielduttrykk, returnerer en verdi. I motsetning til returnuttalelsen avslutter det imidlertid ikke programmet. Det er derfor du kan fortsette å utføre kode fra den sist ga posisjonen. For eksempel,

 function* generatorFunc() ( console.log("1. code before first yield"); yield 100; console.log("2. code before the second yield"); yield 200; console.log("3. code after the second yield"); ) const generator = generatorFunc(); console.log(generator.next()); console.log(generator.next()); console.log(generator.next());

Produksjon

 1. kode før første avkastning (verdi: 100, utført: usann) 2. kode før andre utbytte (verdi: 200, utført: usann) (verdi: udefinert, utført: sann)

Slik fungerer dette programmet.

  • Den første generator.next()uttalelsen utfører koden frem til den første avkastningen og stopper gjennomføringen av programmet.
  • Det andre generator.next()starter programmet fra pause.
  • Når alle elementene er tilgjengelige, returnerer den (verdi: udefinert, ferdig: sann).
Arbeid med generatorfunksjon i JavaScript

Overføring av argumenter til generatorfunksjoner

Du kan også overføre argumenter til en generatorfunksjon. For eksempel,

 // generator function function* generatorFunc() ( // returns 'hello' at first next() let x = yield 'hello'; // returns passed argument on the second next() console.log(x); console.log('some code'); // returns 5 on second next() yield 5; ) const generator = generatorFunc(); console.log(generator.next()); console.log(generator.next(6)); console.log(generator.next());

Produksjon

 (verdi: "hei", gjort: usann) 6 noe kode (verdi: 5, gjort: usann) (verdi: udefinert, gjort: sant)

I programmet ovenfor,

  • Den første generator.next()returnerer verdien av yield(i dette tilfellet 'hallo'). Verdien tildeles imidlertid ikke variabelen x ilet x = yield 'hello'; 
     (verdi: "hei", gjort: usann)
  • Når generator.next(6)det oppstår, starter koden igjen kl let x = yield 'hello';og argumentet 6 tildeles x. Også gjenværende kode utføres frem til andre yield. 
     6 noe kode (verdi: 5, ferdig: usann)
  • Når den tredje next()kjøres, returnerer programmet (verdi: udefinert, ferdig: sant). Det er fordi det ikke er andre avkastningsuttalelser. 
     (verdi: udefinert, ferdig: sant)

Generatorer brukes til å implementere Iterables

Generatorer gir en enklere måte å implementere iteratorer på.

Hvis du vil implementere en iterator manuelt, må du opprette en iterator med next()metoden og lagre tilstanden. For eksempel,

 // creating iterable object const iterableObj = ( // iterator method (Symbol.iterator)() ( let step = 0; return ( next() ( step++; if (step === 1) ( return ( value: '1', done: false); ) else if (step === 2) ( return ( value: '2', done: false); ) else if (step === 3) ( return ( value: '3', done: false); ) return ( value: '', done: true ); ) ) ) ) for (const i of iterableObj) ( console.log(i); )

Produksjon

 1 2 3

Siden generatorer er iterables, kan du implementere en iterator på en enklere måte. Deretter kan du gjenta gjennom generatorene ved hjelp av for… ofløkken. For eksempel,

 // generator function function* generatorFunc() ( yield 1; yield 2; yield 3; ) const obj = generatorFunc(); // iteration through generator for (let value of obj) ( console.log(value); )

Generatormetoder

Metode Beskrivelse
next() Returnerer en avkastningsverdi
return() Returnerer en verdi og avslutter generatoren
throw() Kaster en feil og avslutter generatoren

JavaScript return Vs yield Keyword

return Keyword gi nøkkelord
Returnerer verdien og avslutter funksjonen. Returnerer verdien og stopper funksjonen, men avslutter ikke funksjonen.
Tilgjengelig i både de vanlige funksjonene og generatorfunksjonene. Bare tilgjengelig i generatorfunksjoner.

JavaScript-generatorfunksjon med retur

Du kan bruke returnsetningen i en generatorfunksjon. Den returnsetningen returnerer en verdi og avslutter funksjonen (ligner på vanlige funksjoner). For eksempel,

 // generator function function* generatorFunc() ( yield 100; return 123; console.log("2. some code before second yield"); yield 200; ) // returns generator object const generator = generatorFunc(); console.log(generator.next()); console.log(generator.next()); console.log(generator.next());

Produksjon

 (verdi: 100, utført: usann) (verdi: 123, utført: sann) (verdi: udefinert, utført: sann)

I det ovennevnte programmet, når returnutsagnet oppstår, returnerer det verdien og doneegenskapen blir true, og funksjonen avsluttes. Derfor gir next()metoden etter returnuttalelsen ikke noe.

Merk : Du kan også bruke return()metoden i stedet for returnutsagnet som generator.return(123);i koden ovenfor.

JavaScript-generator kastemetode

Du kan eksplisitt kaste en feil på generatorfunksjonen ved hjelp av throw () -metoden. Bruken av throw()metoden kaster en feil og avslutter funksjonen. For eksempel,

 // generator function function* generatorFunc() ( yield 100; yield 200; ) // returns generator object const generator = generatorFunc(); console.log(generator.next()); // throws an error // terminates the generator console.log(generator.throw(new Error('Error occurred.'))); console.log(generator.next());

Produksjon

 (verdi: 1, ferdig: usann) Feil: Det oppstod en feil.

Bruk av generatorer

  • Generatorer lar oss skrive renere kode mens vi skriver asynkrone oppgaver.
  • Generatorer gir en enklere måte å implementere iteratorer på.
  • Generatorer utfører bare koden når det er nødvendig.
  • Generatorer er minneeffektive.

Generatorer ble introdusert i ES6 . Noen nettlesere støtter kanskje ikke bruk av generatorer. Hvis du vil lære mer, kan du gå til JavaScript Generators support.

Interessante artikler...