JavaScript Function Generator

A generator function is a special type of function that can pause its execution at any point and resume later. They are defined using the function* syntax and use the yield keyword to pause execution and return a value.

Syntax

function* generatorFunction() {
 // Code that can yield multiple values
}

function* generate() {  yield 'Hello';  yield 'World';  return 'Done'; } const generator = generate();   //Driver Code Starts console.log(generator.next()); console.log(generator.next());  console.log(generator.next()); console.log(generator.next());  //Driver Code Ends 

{ value: 'Hello', done: false } { value: 'World', done: false } { value: 'Done', done: true } { value: undefined, done: true } 

• The next() method is used to resume execution and retrieve the next value.
• The done property indicates whether the generator has finished executing.

How Do Generators Work?

Generators work by implementing the iterator protocol. When a generator function is called, it does not execute its body immediately. Instead, it returns a special iterator object called a generator object. This object can be used to control the execution of the generator.

• Execution Control: The next() method resumes execution of the generator function until the next yield is encountered. It returns an object with two properties:
  • value: The yielded value.
  • done: A boolean indicating if the generator has completed execution.
• State Preservation: Each call to next() resumes the function from where it was last paused, retaining the function’s state.
• Termination: When the generator completes execution, the done property of the returned object becomes true.

function* example() {  console.log("Step 1");  yield 1;  console.log("Step 2");  yield 2;  console.log("Step 3");  return 3; } const gen = example();   //Driver Code Starts console.log(gen.next()); console.log(gen.next()); console.log(gen.next()); //Driver Code Ends 

Step 1 { value: 1, done: false } Step 2 { value: 2, done: false } Step 3 { value: 3, done: true } 

Key Features of Generators

• Pause and Resume: Generators allow pausing function execution using yield and resuming it with the next() method.
• Iterable Interface: They return an iterator that conforms to the iterable protocol.
• Asynchronous Support: Ideal for working with asynchronous tasks using for-await-of loops.

Use Cases for Generators

1. Custom Iterators

Generators simplify the creation of custom iterators, making it easy to generate sequences of values.

function* fibonacci(limit) {  let [prev, current] = [0, 1];  while (limit--) {  yield current;  [prev, current] = [current, prev + current];  } } const fib = fibonacci(5); console.log([...fib]);  

[ 1, 1, 2, 3, 5 ] 

In this example

• The function fibonacci is a generator function defined with function*.
• The generator starts with two variables prev and current, initialized to 0 and 1 (the first two Fibonacci numbers).
• The while (limit--) loop runs until the limit is exhausted, yielding the current Fibonacci number each time.
• The values of prev and current are updated after each yield to produce the next Fibonacci number.

2. Asynchronous Programming

Generators, in combination with libraries like co or with async/await syntax, help manage asynchronous flows.

function* asyncTask() {  console.log('Task 1');  yield new Promise(resolve =>  setTimeout(() =>  resolve('Task 2'), 1000));  console.log('Task 3'); } const task = asyncTask(); task.next().value.then(console.log); task.next();  

Output:

Task 1
Task 3
Task 2

In this example

• The generator asyncTask first logs 'Task 1'.
• It then yields a Promise that resolves with 'Task 2' after 1 second.
• After the Promise resolves, 'Task 3' is logged.

3. Infinite Sequences

Generators can create infinite sequences that only compute values on demand.

function* infiniteSeq() {  let i = 0;  while (true) {  yield i++;  } } const sequence = infiniteSeq();  console.log(sequence.next().value);  //Driver Code Starts console.log(sequence.next().value);  console.log(sequence.next().value);  //Driver Code Ends 

0 1 2 

In this example

• The infiniteSeq generator creates an infinite sequence starting from 0.
• Each time next() is called, it yields the current value of i and then increments it (i++).
• The loop is infinite because of while (true), so it keeps generating numbers indefinitely.

Advantages of Generator Functions

• Lazy Evaluation: Values are computed only when needed, improving performance for large or infinite sequences.
• Readable Asynchronous Code: Generators can make asynchronous workflows look synchronous, simplifying complex code.
• Modularity: Encapsulate logic for producing sequences or iterating over data within a generator.
• Customizable Iterators: Generators allow creating iterators without implementing the entire iterable protocol manually.

Limitations of Generator Functions

• Complexity: Understanding and debugging generator-based code can be challenging for beginners.
• Not Fully Asynchronous: While useful, generators alone are not a replacement for promises or async/await in handling asynchronous programming.