Ebben az oktatóanyagban példák segítségével megismerheti a JavaScript generátorokat.
A JavaScript-ben a generátorok új módszert kínálnak a függvényekkel és az iterátorokkal való együttműködésre.
Egy generátor használatával
- a függvény végrehajtását a függvény belsejéből bárhonnan leállíthatja
- és folytassa a kód végrehajtását leállított helyzetből
Hozzon létre JavaScript generátorokat
Generátor létrehozásához először meg kell határoznia egy generátor funkciót function*szimbólummal. A generátorfüggvények objektumait generátoroknak nevezzük.
// define a generator function function* generator_function() (… ) // creating a generator const generator_obj = generator_function();
Megjegyzés : A generátor funkciót jelöljük *. Használhatja function* generatorFunc() (… )vagy function *generatorFunc()(… )létrehozhatja őket.
A hozam használata a végrehajtás szüneteltetéséhez
Mint fent említettük, a teljes függvénytest végrehajtása nélkül szüneteltetheti a generátorfüggvény végrehajtását. Ehhez a yieldkulcsszót használjuk . Például,
// 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());
Kimenet
1. kód az első hozam előtt (érték: 100, kész: hamis)
Itt,
- Létrejön egy nevű generátor objektum
generator. - Amikor
generator.next()meghívják, az elsőigyieldvégrehajtott kód végrehajtásra kerül. Amikoryieldfelmerül, a program visszaadja az értéket, és szünetelteti a generátor funkciót.
Megjegyzés : A változó használata előtt generátorobjektumokat kell rendelnie hozzá.
Több hozamkimutatás kidolgozása
A yieldkifejezés egy értéket ad vissza. Az returnállítással ellentétben azonban nem fejezi be a programot. Ezért folytathatja a kód végrehajtását az utoljára kapott pozícióból. Például,
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());
Kimenet
1. kód az első hozam előtt (érték: 100, kész: hamis) 2. kód a második hozam előtt (érték: 200, kész: hamis) (érték: meghatározatlan, kész: igaz)
Így működik ez a program.
- Az első
generator.next()utasítás végrehajtja a kódot az első hozam utasításig, és szünetelteti a program végrehajtását. - A második
generator.next()a programot a szüneteltetett helyzetből indítja. - Amikor az összes elemhez hozzáfér, visszatér (érték: undefined, kész: true).
Generátor funkció működése a JavaScript-ben
Érvek átadása a generátor funkcióinak
Argumentumokat átadhat egy generátorfüggvénynek is. Például,
// 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());
Kimenet
(érték: "szia", kész: hamis) 6 néhány kód (érték: 5, kész: hamis) (érték: nem definiált, kész: igaz)
A fenti programban
- Az első
generator.next()ayield(jelen esetben „hello”) értékét adja vissza . Az érték azonban nincs hozzárendelve az x változóhozlet x = yield 'hello';(érték: "szia", kész: hamis)
- Amikor
generator.next(6)felmerül, a kód újra kezdődik,let x = yield 'hello';és a 6-os argumentum hozzárendelődik x-hez. A fennmaradó kódot a másodikig is végrehajtjákyield.6 néhány kód (érték: 5, kész: hamis)
- A harmadik
next()végrehajtásakor a program visszatér (érték: meghatározatlan, kész: igaz). Ez azért van, mert nincsenek más hozamkimutatások.(érték: meghatározatlan, kész: igaz)
A generátorokat az itterables megvalósítására használják
A generátorok az iterátorok megvalósításának egyszerűbb módját kínálják.
Ha kézzel szeretne megvalósítani egy iterátort, létre kell hoznia egy iterátort a next()módszerrel, és el kell mentenie az állapotot. Például,
// 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); )
Kimenet
1 2 3
Mivel a generátorok iterálhatók, könnyebben megvalósíthat egy iterátort. Ezután a for… ofciklus segítségével iterálhat a generátorokon keresztül . Például,
// generator function function* generatorFunc() ( yield 1; yield 2; yield 3; ) const obj = generatorFunc(); // iteration through generator for (let value of obj) ( console.log(value); )
Generátor módszerek
| Módszer | Leírás |
|---|---|
next() | Visszaadja a hozam értékét |
return() | Visszaad egy értéket és megszünteti a generátort |
throw() | Hibát dob, és leállítja a generátort |
A JavaScript visszaadja a Vs hozamú kulcsszót
| return kulcsszó | hozam Kulcsszó |
|---|---|
| Visszaadja az értéket és befejezi a függvényt. | Visszaadja az értéket, és leállítja a függvényt, de nem fejezi be a függvényt. |
| Normál és generátor funkciókban egyaránt elérhető. | Csak generátor funkciókban érhető el. |
JavaScript generátor funkció Visszatéréssel
You can use the return statement in a generator function. The return statement returns a value and terminates the function (similar to regular functions). For example,
// 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());
Output
(value: 100, done: false) (value: 123, done: true) (value: undefined, done: true)
In the above program, when the return statement is encountered, it returns the value and done property becomes true, and the function terminates. Hence, the next() method after the return statement does not return anything.
Note: You can also use the return() method instead of the return statement like generator.return(123); in the above code.
JavaScript Generator Throw Method
A dobás () módszerrel kifejezetten hibát dobhat a generátorfüggvényre. A throw()metódus használata hibát okoz és megszünteti a függvényt. Például,
// 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());
Kimenet
(érték: 1, kész: hamis) Hiba: Hiba történt.
Generátorok felhasználása
- A generátorok tisztább kódot írnak, miközben aszinkron feladatokat írunk.
- A generátorok az iterátorok megvalósításának egyszerűbb módját kínálják.
- A generátorok csak szükség esetén hajtják végre a kódját.
- A generátorok memória-hatékonyak.
A generátorokat az ES6- ban vezették be . Egyes böngészők nem támogatják a generátorok használatát. További információkért látogasson el a JavaScript Generátorok ügyfélszolgálatára.
