🔰generator function

JS ⟩ iteration ⟩ generator function

defined by function* keyword and returns a Generator object.

🔴 主題

• syntax

  • function*

  • yield

  • yield*

• use cases

  • generator function as ... (variable, method)

  • as make-iterator method of an iterable.

• examples

  • *list() - sequence of numbers

  • *closedRange()

  • *integers()

  • *fibonacci()

• composition of generator functions

  • *zip()

  • *sequence()

  • *interleave()

🧨 雷區

yield and yield* operator can only be used within generator functions❗️

• replit：yield must be in generator functions

// this seems like a generator function, but there's a catch ...
function* sequence(...iterables) {

    // --------------------------------------------------------------
    // ⭐ `yield/yield*` only available within generator functions❗
    // --------------------------------------------------------------
    
    // ❌ but this `yield*` is within an "arrow function"❗
    //
    //                 ╭─── 🔸 arrow function ───╮
    iterables.forEach( iterable => yield* iterable );
    //                             ^^^^^^
    // ⛔ ReferenceError: yield is not defined 
    
}

⭐️ 重點

yield and yield* operator can only be used within generator functions❗️

we can use generator functions to make iterables.

yield* keyword iterates an iterable and yields each of the resulting values.

there is no way to write a generator function using arrow function syntax.

💈範例

💾 replit：generator functions & objects

// ⭐️ generator function
function* abc() {
  yield 'a';
  yield 'b';
  yield 'c';
}

// main
let str = '';

// ⭐️ for-of loop  ╭───╮ ----> ⭐️ generator object
for (const char of abc()) {
  str += char;
}                  // str = 'abc'

👥 相關

• objects returned by generator functions are iterable iterators.

📘 手冊

• function* (declaration) ⭐️