Generatoare JavaScript

În acest tutorial, veți afla despre generatoarele JavaScript cu ajutorul exemplelor.

În JavaScript, generatoarele oferă un nou mod de a lucra cu funcții și iteratoare.

Folosind un generator,

  • puteți opri executarea unei funcții de oriunde din interiorul funcției
  • și continuați să executați codul dintr-o poziție oprită

Creați generatoare JavaScript

Pentru a crea un generator, trebuie să definiți mai întâi o funcție generator cu function*simbol. Obiectele funcțiilor generatorului se numesc generatoare.

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

Notă : Funcția generator este notată cu *. Puteți să le utilizați function* generatorFunc() (… )sau function *generatorFunc()(… )să le creați.

Utilizarea randamentului pentru întreruperea executării

După cum sa menționat mai sus, puteți întrerupe executarea unei funcții generator fără a executa întregul corp al funcției. Pentru aceasta, folosim yieldcuvântul cheie. De exemplu,

 // 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());

Ieșire

 1. cod înainte de primul randament (valoare: 100, făcut: fals)

Aici,

  • Se generatorcreează un obiect generator numit .
  • Când generator.next()este apelat, codul până la primul yieldeste executat. Când yieldeste întâlnit, programul returnează valoarea și întrerupe funcția generator.

Notă : Trebuie să atribuiți obiecte generator unei variabile înainte de a o utiliza.

Funcționarea declarațiilor de randament multiple

yieldExpresia returnează o valoare. Cu toate acestea, spre deosebire de returndeclarație, nu pune capăt programului. De aceea, puteți continua să executați cod din ultima poziție cedată. De exemplu,

 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());

Ieșire

 1. cod înainte de primul randament (valoare: 100, făcut: fals) 2. cod înainte de al doilea randament (valoare: 200, făcut: fals) (valoare: nedefinit, făcut: adevărat)

Iată cum funcționează acest program.

  • Prima generator.next()instrucțiune execută codul până la prima instrucțiune de randament și întrerupe executarea programului.
  • Al doilea generator.next()pornește programul din poziția întreruptă.
  • Când toate elementele sunt accesate, acesta revine (valoare: nedefinit, făcut: adevărat).
Funcționarea funcției generator în JavaScript

Transmiterea argumentelor la funcțiile generatorului

De asemenea, puteți transmite argumente unei funcții generator. De exemplu,

 // 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());

Ieșire

 (valoare: "salut", făcut: fals) 6 un anumit cod (valoare: 5, făcut: fals) (valoare: nedefinit, făcut: adevărat)

În programul de mai sus,

  • Primul generator.next()returnează valoarea yield(în acest caz, „salut”). Cu toate acestea, valoarea nu este atribuită variabilei x înlet x = yield 'hello'; 
     (valoare: „salut”, făcut: fals)
  • Când generator.next(6)este întâlnit, codul începe din nou la let x = yield 'hello';și argumentul 6 este atribuit lui x. De asemenea, codul rămas este executat până la al doilea yield. 
     6 un cod (valoare: 5, făcut: fals)
  • Când al treilea next()este executat, programul revine (valoare: nedefinit, făcut: adevărat). Acest lucru se datorează faptului că nu există alte declarații de randament. 
     (valoare: nedefinit, făcut: adevărat)

Generatoarele sunt utilizate pentru implementarea Iterables

Generatoarele oferă o modalitate mai ușoară de implementare a iteratorilor.

Dacă doriți să implementați manual un iterator, trebuie să creați un iterator cu next()metoda și să salvați starea. De exemplu,

 // 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); )

Ieșire

 1 2 3

Deoarece generatoarele sunt iterabile, puteți implementa un iterator într-un mod mai ușor. Apoi, puteți itera prin generatoare folosind for… ofbucla. De exemplu,

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

Metode Generator

Metodă Descriere
next() Returnează o valoare a randamentului
return() Returnează o valoare și termină generatorul
throw() Aruncă o eroare și oprește generatorul

JavaScript returnează Vs produce cuvânt cheie

returnează cuvânt cheie randament Cuvânt cheie
Returnează valoarea și termină funcția. Returnează valoarea și oprește funcția, dar nu oprește funcția.
Disponibil atât în ​​funcțiile normale, cât și în funcțiile generatorului. Disponibil numai în funcțiile generatorului.

Funcția Generator JavaScript Cu returnare

Puteți utiliza returninstrucțiunea într-o funcție generator. Instrucțiunea returnreturnează o valoare și termină funcția (similar cu funcțiile obișnuite). De exemplu,

 // 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());

Ieșire

 (valoare: 100, făcut: fals) (valoare: 123, făcut: adevărat) (valoare: nedefinit, făcut: adevărat)

În programul de mai sus, când returnse întâlnește instrucțiunea, aceasta returnează valoarea și doneproprietatea devine trueși funcția se termină. Prin urmare, next()metoda după returndeclarație nu returnează nimic.

Notă : De asemenea, puteți utiliza return()metoda în locul returndeclarației ca generator.return(123);în codul de mai sus.

JavaScript Generator Metoda de aruncare

Puteți arunca în mod explicit o eroare pe funcția generator folosind metoda throw (). Utilizarea throw()metodei generează o eroare și încetează funcția. De exemplu,

 // 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());

Ieșire

 (valoare: 1, făcut: fals) Eroare: A apărut o eroare.

Utilizări ale generatoarelor

  • Generatoarele ne permit să scriem un cod mai curat în timp ce scriem sarcini asincrone.
  • Generatoarele oferă o modalitate mai ușoară de implementare a iteratorilor.
  • Generatoarele își execută codul numai atunci când este necesar.
  • Generatoarele sunt eficiente în memorie.

Generatoarele au fost introduse în ES6 . Este posibil ca unele browsere să nu accepte utilizarea generatoarelor. Pentru a afla mai multe, accesați asistența JavaScript Generators.

Articole interesante...