Generator Functions ใน JavaScript คืออะไร?

Generator Functions อนุญาตให้ execute code ระหว่างที่ฟังก์ชัน exit และ resume ภายหลัง Generators ใช้จัดการ flow control ในโค้ด ยกเลิก asynchronous operations ได้ง่าย เพราะ execution หยุดชั่วคราวได้ทุกเมื่อ

Syntax: อย่าลืมเพิ่ม asterisk หลัง function keyword:

function *myFunction() {} 
// หรือ 
function* myFunction() {} 
// หรือ 
function*myFunction() {}

ตัวอย่าง

<html> 
  <body> 
    <script> 
      function* display() { 
        var num = 1; 
        while (num < 5) 
          yield num++; 
      } 
      var myGenerator = display(); 
      document.write(myGenerator.next().value); 
      document.write("<br>" + myGenerator.next().value); 
      document.write("<br>" + myGenerator.next().value); 
      document.write("<br>" + myGenerator.next().value); 
      document.write("<br>" + myGenerator.next().value); 
    </script> 
  </body> 
</html>

รายละเอียด Generator

• คืนค่า Generator object (implements Iterator และ Iterable protocols)
• yield หยุด execution คืนค่า { value: X, done: false }
• next() เรียกต่อจากจุดที่หยุด สามารถส่งค่าเข้าไปได้: next(value)
• return() บังคับจบ generator คืน { value: X, done: true }
• throw() โยน error เข้า generator

ตัวอย่างขั้นสูง

// Infinite generator
function* idMaker() {
  let id = 0;
  while (true) yield id++;
}

// Delegation (yield*)
function* gen1() { yield 1; yield 2; }
function* gen2() { yield* gen1(); yield 3; }
// gen2() yields: 1, 2, 3

// Async generator (ES2018)
async function* asyncGen() {
  yield await fetch('/api/1');
  yield await fetch('/api/2');
}