ใน JavaScript ฟังก์ชัน ตัวสร้างเป็นฟังก์ชันชนิดพิเศษที่สามารถหยุดชั่วคราวและทำงานต่อได้ในระหว่างการดำเนินการ ซึ่งหมายความว่าตัวสร้างสามารถให้ค่าหลายค่าเมื่อเวลาผ่านไป แทนที่จะส่งคืนเพียงค่าเดียวเหมือนฟังก์ชันปกติ

ฟังก์ชันตัวสร้างถูกประกาศโดยใช้ไวยากรณ์ของฟังก์ชัน* (หรือไวยากรณ์แบบเก่าที่มีฟังก์ชันคีย์เวิร์ดตามด้วยตัวสร้างคำในวงเล็บ) เมื่อมีการเรียกใช้ฟังก์ชันตัวสร้าง ฟังก์ชันจะไม่เริ่มทำงานในทันที แต่จะส่งคืนวัตถุตัววนซ้ำที่สามารถใช้เพื่อควบคุมการทำงานของตัวสร้าง

นี่คือตัวอย่างของฟังก์ชันตัวสร้างอย่างง่าย:

function* generateSequence() {
  yield 1;
  yield 2;
  yield 3;
}

ในการใช้ตัวสร้าง เราต้องสร้างตัววนซ้ำก่อนโดยการเรียกฟังก์ชันตัวสร้าง:

const iterator = generateSequence();

console.log(iterator.next()); // { value: 1, done: false }
console.log(iterator.next()); // { value: 2, done: false }
console.log(iterator.next()); // { value: 3, done: false }
console.log(iterator.next()); // { value: undefined, done: true }

เมื่อตัวสร้างเสร็จสิ้นการให้ค่าแล้ว มันจะคืนค่า { value: undefined, done: true } โดยอัตโนมัติ

เครื่องกำเนิดไฟฟ้ายังสามารถรับค่าอินพุตจากผู้โทรโดยใช้คีย์เวิร์ดของผลตอบแทน ต่อไปนี้คือตัวอย่างตัวสร้างที่ได้รับค่าเริ่มต้นและสร้างลำดับของค่าที่เป็นสองเท่าของค่าก่อนหน้า:

function* generateDoubles(start) {
  let current = start;
  while (true) {
    yield current;
    current *= 2;
  }
}

const iterator = generateDoubles(1);

console.log(iterator.next()); // { value: 1, done: false }
console.log(iterator.next()); // { value: 2, done: false }
console.log(iterator.next()); // { value: 4, done: false }
console.log(iterator.next()); // { value: 8, done: false }

ตัวสร้างมักใช้เพื่อใช้งานตัววนซ้ำสำหรับโครงสร้างข้อมูลแบบกำหนดเอง ต่อไปนี้คือตัวอย่างตัวสร้างที่วนซ้ำบนคีย์ของอ็อบเจกต์:

const myObject = { a: 1, b: 2, c: 3 };

function* generateKeys(obj) {
  for (let key in obj) {
    yield key;
  }
}

const iterator = generateKeys(myObject);
console.log(iterator.next()); // { value: "a", done: false }
console.log(iterator.next()); // { value: "b", done: false }
console.log(iterator.next()); // { value: "c", done: false }
console.log(iterator.next()); // { value: undefined, done: true }

เจนเนอเรเตอร์ยังสามารถใช้เพื่อใช้การประเมินแบบขี้เกียจ ซึ่งค่าต่างๆ จะถูกคำนวณเมื่อจำเป็นจริงๆ เท่านั้น ต่อไปนี้คือตัวอย่างตัวสร้างที่สร้างจำนวนเฉพาะตามความต้องการ:

function* generatePrimes() {
  let current = 2;
  while (true) {
    if (isPrime(current)) {
      yield current;
    }
    current++;
  }
}

function isPrime(num) {
  for (let i = 2; i < num; i++) {
    if (num % i === 0) {
      return false;
    }
  }
  return num !== 1;
}

const iterator = generatePrimes();
console.log(iterator.next()); // { value: 2, done: false }
console.log(iterator.next()); // { value: 3, done: false }
console.log(iterator.next()); // { value: 5, done: false }
console.log(iterator.next()); // { value: 7, done: false }
console.log(iterator.next()); // { value: 11, done: false }

นอกจากนี้ยังสามารถใช้เครื่องกำเนิดไฟฟ้า เพื่อใช้การเขียนโปรแกรมแบบอะซิงโครนัสโดยใช้ไวยากรณ์ async/await ต่อไปนี้เป็นตัวอย่างของฟังก์ชันตัวสร้างที่จำลองการทำงานแบบอะซิงโครนัสซึ่งใช้เวลาแปรผันเพื่อให้เสร็จสมบูรณ์:

function sleep(ms) {
  return new Promise(resolve => setTimeout(resolve, ms));
}

async function* generateAsyncValues() {
  let count = 0;
  while (true) {
    await sleep(1000);
    yield count++;
  }
}

(async () => {
  const iterator = generateAsyncValues();
  console.log(await iterator.next()); // { value: 0, done: false }
  console.log(await iterator.next()); // { value: 1, done: false }
  console.log(await iterator.next()); // { value: 2, done: false }
  console.log(await iterator.next()); // { value: 3, done: false }
})();

โดยสรุป ตัวสร้างใน JavaScript เป็นเครื่องมือที่มีประสิทธิภาพสำหรับการนำตัววนซ้ำ การประเมินแบบขี้เกียจ และการเขียนโปรแกรมแบบอะซิงโครนัสไปใช้ อนุญาตให้ฟังก์ชันให้ค่าหลายค่าเมื่อเวลาผ่านไป และสามารถหยุดชั่วคราวและดำเนินการต่อระหว่างการดำเนินการ นักพัฒนาสามารถเขียนโค้ดที่มีประสิทธิภาพ ยืดหยุ่น และสามารถอ่านได้โดยใช้ตัวสร้าง

ขอบคุณที่อ่าน!

ฉันหวังว่าคุณจะพบว่าบทความนี้มีประโยชน์ หากคุณมีคำถามหรือข้อเสนอแนะโปรดแสดงความคิดเห็น ความคิดเห็นของคุณช่วยให้ฉันดีขึ้น

อย่าลืมกดติดตาม⭐️

หน้า Facebook :https://www.facebook.com/designTechWorld1

หน้าอินสตาแกรม :https://www.instagram.com/techd.esign/

ช่องยูทูป :https://www.youtube.com/@tech..Design/

ทวิตเตอร์ :https://twitter.com/sumit_singh2311

เกียร์ที่ใช้ :

แล็ปท็อป :https://amzn.to/3yKkzaC

ดู:https://amzn.to/41cialm

คุณสามารถเลือก React Book: https://amzn.to/3Tw29nx

หนังสือพิเศษบางเล่มที่เกี่ยวข้องกับภาษาการเขียนโปรแกรม:

https://amzn.to/3z3tW5s

https://amzn.to/40n4m6O

https://amzn.to/3Jzstse

https://amzn.to/3nbl8aE

*ข้อจำกัดความรับผิดชอบที่สำคัญ — “Amazon และโลโก้ Amazon เป็นเครื่องหมายการค้าของ Amazon.com, Inc. หรือบริษัทในเครือ”