Rumah  >  Artikel  >  hujung hadapan web  >  Menguasai fungsi penjana dan iterator dalam JavaScript

Menguasai fungsi penjana dan iterator dalam JavaScript

WBOY
WBOYasal
2023-11-03 17:45:281013semak imbas

Menguasai fungsi penjana dan iterator dalam JavaScript

Untuk menguasai fungsi penjana dan iterator dalam JavaScript, anda memerlukan contoh kod khusus

Fungsi penjana dan iterator adalah sangat penting dalam konsep JavaScript yang boleh membantu memudahkan dan mengoptimumkan kod kami. Dalam artikel ini, kami akan memperincikan konsep fungsi penjana dan iterator, serta memberikan contoh kod konkrit.

1 Konsep fungsi penjana

Fungsi penjana ialah fungsi khas yang boleh menjana lelaran. Fungsi penjana diisytiharkan menggunakan kata kunci fungsi*, dan kata kunci hasil digunakan untuk menjeda dan menyambung semula pelaksanaan fungsi. Fungsi penjana boleh menghasilkan berbilang nilai, mengembalikan satu nilai setiap kali menggunakan kata kunci hasil dan mengekalkan konteks fungsi semasa.

Berikut ialah contoh fungsi penjana mudah:

function* generatorFunction() {
  yield 'Hello';
  yield 'World';
  yield '!';
}

const generator = generatorFunction();

console.log(generator.next().value); // 输出:Hello
console.log(generator.next().value); // 输出:World
console.log(generator.next().value); // 输出:!

Dalam contoh di atas, kami mencipta penjana fungsi penjanaFungsi yang mengembalikan tiga menggunakan nilai kata kunci hasil. Dengan menggunakan kaedah generator.next(), kita boleh mendapatkan nilai yang dihasilkan oleh fungsi generator satu demi satu.

Perlu diingatkan bahawa fungsi penjana adalah berbeza daripada fungsi biasa Ia tidak akan dilaksanakan serta-merta, tetapi akan mengembalikan objek penjana. Fungsi penjana melaksanakan dan mengembalikan nilai hanya apabila kaedah seterusnya() objek penjana dipanggil.

2. Konsep iterator

Interator ialah objek dengan kaedah next() dan kaedah ini mengembalikan objek yang mengandungi nilai dan atribut selesai. nilai mewakili nilai yang dikembalikan oleh fungsi penjana, dan selesai mewakili sama ada fungsi penjana telah dilaksanakan.

Berikut ialah contoh iterator mudah:

const myArray = [1, 2, 3, 4, 5];
const iterator = myArray[Symbol.iterator]();

console.log(iterator.next().value); // 输出:1
console.log(iterator.next().value); // 输出:2
console.log(iterator.next().value); // 输出:3
console.log(iterator.next().value); // 输出:4
console.log(iterator.next().value); // 输出:5
console.log(iterator.next().value); // 输出:undefined

Dalam contoh di atas, kami mencipta iterator objek iterator menggunakan kaedah Symbol.iterator tatasusunan. Melalui kaedah next() bagi objek iterator, kita boleh mendapatkan setiap nilai dalam tatasusunan.

Perlu diambil perhatian bahawa selepas kaedah next() iterator dilaksanakan, memanggil kaedah next() sekali lagi akan mengembalikan objek yang mengandungi undefined dan dilakukan sebagai benar.

3. Aplikasi gabungan fungsi penjana dan iterator

Aplikasi gabungan fungsi penjana dan iterator membantu memudahkan dan mengoptimumkan kod kami. Melalui fungsi penjana, kita boleh mengulangi pelbagai struktur data seperti tatasusunan, objek, dsb.

Berikut ialah contoh menggunakan fungsi penjana dan lelaran untuk melelar ke atas objek:

const myObject = {
  name: 'John',
  age: 30,
  city: 'New York',
};

function* iterateObject(obj) {
  for (let key in obj) {
    yield obj[key];
  }
}

const iterator = iterateObject(myObject);

console.log(iterator.next().value); // 输出:John
console.log(iterator.next().value); // 输出:30
console.log(iterator.next().value); // 输出:New York

Dalam contoh di atas, kami mentakrifkan fungsi penjana iterateObject yang melepasi Kata Kunci hasil mengembalikan setiap nilai dalam objek. Dengan memanggil iterator yang dicipta oleh fungsi iterateObject, kita boleh mendapatkan nilai dalam objek satu demi satu.

Dalam pengaturcaraan sebenar, gabungan fungsi penjana dan iterator adalah sangat fleksibel. Kami boleh menggunakan fungsi penjana dan iterator secara fleksibel untuk meningkatkan kebolehbacaan dan prestasi kod mengikut keperluan khusus.

Ringkasan

Fungsi penjana dan iterator ialah konsep yang sangat penting dalam JavaScript, ia boleh membantu memudahkan dan mengoptimumkan kod kami. Melalui fungsi penjana, kita boleh dengan mudah menjana iterator dan mengembalikan berbilang nilai menggunakan kata kunci hasil. Dengan iterator, kita boleh merentasi pelbagai struktur data dan mendapatkan setiap nilai.

Dalam artikel ini, kami memperkenalkan konsep fungsi penjana dan iterator secara terperinci dan memberikan contoh kod konkrit. Kami berharap pengenalan dalam artikel ini dapat membantu pembaca lebih memahami dan menguasai penggunaan fungsi penjana dan iterator.

Atas ialah kandungan terperinci Menguasai fungsi penjana dan iterator dalam JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn