Penjana JavaScript

Dalam tutorial ini, anda akan belajar mengenai penjana JavaScript dengan bantuan contoh.

Dalam JavaScript, penjana menyediakan cara baru untuk bekerja dengan fungsi dan iterator.

Menggunakan penjana,

  • anda boleh menghentikan pelaksanaan fungsi dari mana sahaja di dalam fungsi
  • dan terus melaksanakan kod dari kedudukan terhenti

Buat Penjana JavaScript

Untuk membuat penjana, anda perlu terlebih dahulu menentukan fungsi penjana dengan function*simbol. Objek fungsi penjana dipanggil penjana.

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

Catatan : Fungsi penjana dilambangkan dengan *. Anda boleh menggunakan function* generatorFunc() (… )atau function *generatorFunc()(… )membuatnya.

Menggunakan hasil untuk Menjeda Pelaksanaan

Seperti yang disebutkan di atas, anda dapat menghentikan sebentar pelaksanaan fungsi generator tanpa menjalankan seluruh fungsi tubuh. Untuk itu, kami menggunakan yieldkata kunci. Sebagai contoh,

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

Pengeluaran

 1. kod sebelum hasil pertama (nilai: 100, selesai: salah)

Di sini,

  • Objek penjana bernama generatordibuat.
  • Apabila generator.next()dipanggil, kod hingga yang pertama yielddijalankan. Apabila yieldditemui, program mengembalikan nilai dan menghentikan fungsi penjana.

Catatan : Anda perlu menetapkan objek penjana kepada pemboleh ubah sebelum menggunakannya.

Mengendalikan Penyata Hasil berganda

The yieldungkapan mengembalikan nilai. Namun, tidak seperti returnpernyataan itu, ia tidak menghentikan program. Itulah sebabnya anda boleh terus melaksanakan kod dari kedudukan hasil terakhir. Sebagai contoh,

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

Pengeluaran

 1. kod sebelum hasil pertama (nilai: 100, selesai: salah) 2. kod sebelum hasil kedua (nilai: 200, selesai: salah) (nilai: tidak ditentukan, selesai: benar)

Inilah cara program ini berfungsi.

  • generator.next()Pernyataan pertama melaksanakan kod hingga pernyataan hasil pertama dan menghentikan pelaksanaan program.
  • Yang kedua generator.next()memulakan program dari kedudukan berhenti.
  • Apabila semua elemen diakses, ia akan kembali (nilai: tidak ditentukan, selesai: benar).
Mengendalikan fungsi penjana dalam JavaScript

Menyampaikan Hujah ke Fungsi Penjana

Anda juga boleh menyampaikan argumen ke fungsi penjana. Sebagai contoh,

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

Pengeluaran

 (nilai: "hello", selesai: salah) 6 sebilangan kod (nilai: 5, selesai: salah) (nilai: tidak ditentukan, selesai: benar)

Dalam program di atas,

  • Yang pertama generator.next()mengembalikan nilai yield(dalam kes ini, 'hello'). Walau bagaimanapun, nilainya tidak diberikan kepada pemboleh ubah x inlet x = yield 'hello'; 
     (nilai: "hello", selesai: false)
  • Apabila generator.next(6)ditemui, kod sekali lagi bermula pada let x = yield 'hello';dan argumen 6 diberikan kepada x. Juga, baki kod dilaksanakan hingga yang kedua yield. 
     6 beberapa kod (nilai: 5, selesai: salah)
  • Apabila yang ketiga next()dijalankan, program kembali (nilai: tidak ditentukan, selesai: benar). Ini kerana tidak ada pernyataan hasil yang lain. 
     (nilai: tidak ditentukan, selesai: benar)

Penjana Digunakan untuk Melaksanakan Iterables

Penjana menyediakan cara yang lebih mudah untuk melaksanakan iterator.

Sekiranya anda ingin melaksanakan iterator secara manual, anda harus membuat iterator dengan next()kaedah dan simpan keadaan. Sebagai contoh,

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

Pengeluaran

 1 2 3

Oleh kerana penjana boleh berulang, anda boleh melaksanakan iterator dengan cara yang lebih mudah. Kemudian anda boleh berulang melalui generator menggunakan for… ofgelung. Sebagai contoh,

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

Kaedah Penjana

Kaedah Penerangan
next() Mengembalikan nilai hasil
return() Mengembalikan nilai dan menghentikan penjana
throw() Melemparkan ralat dan menghentikan penjana

Kata kunci pengembalian JavaScript menghasilkan Vs

kata kunci kembali kata kunci hasil
Mengembalikan nilai dan menghentikan fungsi. Mengembalikan nilai dan menghentikan fungsi tetapi tidak menghentikan fungsi.
Terdapat dalam fungsi normal dan fungsi penjana. Hanya terdapat dalam fungsi penjana.

Fungsi Penjana JavaScript Dengan kembali

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

Anda secara eksplisit boleh membuang kesalahan pada fungsi penjana menggunakan kaedah lontaran (). Penggunaan throw()kaedah melemparkan ralat dan menghentikan fungsinya. Sebagai contoh,

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

Pengeluaran

 (nilai: 1, selesai: salah) Ralat: Ralat berlaku.

Kegunaan Penjana

  • Penjana membolehkan kami menulis kod yang lebih bersih semasa menulis tugas tak segerak.
  • Penjana menyediakan cara yang lebih mudah untuk melaksanakan iterator.
  • Penjana melaksanakan kodnya hanya apabila diperlukan.
  • Penjana cekap ingatan.

Penjana diperkenalkan pada ES6 . Beberapa penyemak imbas mungkin tidak menyokong penggunaan penjana. Untuk mengetahui lebih lanjut, lawati sokongan Penjana JavaScript.

Artikel menarik...