GV

GeezerVison

The World Wide Web, restored to 800 pixels of glory.

Home|About|Gaming cabinet|Archives|How it works|Starter sites

On this site

  • JS Tutorial
  • Web Tutorial
  • A to Z Guide
  • Projects
  • OOP
  • DOM
  • Set
  • Map
  • Math
  • Number
  • Boolean
  • Exercise
  • asynchronous tasks
  • asynchronous workflows

This view

  • Original page
  • New address

GeezerVison is showing www.geeksforgeeks.org — JavaScript Function Generator - GeeksforGeeks

geeksforgeeks
search icon
  • Courses
  • Tutorials
  • Interview Prep
  • JS Tutorial
  • Web Tutorial
  • A to Z Guide
  • Projects
  • OOP
  • DOM
  • Set
  • Map
  • Math
  • Number
  • Boolean
  • Exercise

JavaScript Function Generator

Last Updated : 1 Jun, 2026

A generator function is a special kind of function that can pause its execution and resume later. It is defined using the function* syntax and controls execution using the yield keyword.

  • Generator functions return an iterator object.
  • The yield keyword pauses execution and returns a value.
  • Execution resumes from the last yield when the generator is called again.
JavaScript
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
  • The next() method is used to resume execution and retrieve the next value.
  • The done property indicates whether the generator has finished executing.

Syntax

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

Working of Generators

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.

1. 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.

2. State Preservation: Each call to next() resumes the function from where it was last paused, retaining the function’s state.

3. Termination: When the generator completes execution, the done property of the returned object becomes true.

JavaScript
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

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

Here are some use cases:

1. Custom Iterators

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

JavaScript
function* fibonacci(limit) {
    let [prev, current] = [0, 1];
    while (limit--) {
        yield current;
        [prev, current] = [current, prev + current];
    }
}
const fib = fibonacci(5);
console.log([...fib]); 
  • 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.

JavaScript
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(); 
  • 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.

JavaScript
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
  • 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.
Comment

Explore

    JavaScript Basics
    • Introduction3 min read
    • Variables5 min read
    • Operators4 min read
    • Control Statements4 min read
    Array & String
    • Arrays6 min read
    • Array Methods4 min read
    • String5 min read
    • String Methods8 min read
    Function & Object
    • Functions4 min read
    • Function Expression3 min read
    • Function Overloading4 min read
    • Objects4 min read
    • Constructors4 min read
    OOP
    • OOP5 min read
    • Classes & Objects4 min read
    • Access Modifiers5 min read
    • Constructor4 min read
    Asynchronous JavaScript
    • Asynchronous2 min read
    • Callbacks4 min read
    • Promises4 min read
    • Event Loop3 min read
    • Async Await Fuction3 min read
    Exception Handling
    • Error and Exceptional Handling5 min read
    • Errors Throw & Try to Catch2 min read
    • Custom Errors2 min read
    • TypeError Invalid Array.prototype.sort argument1 min read
    DOM
    • DOM8 min read
    • DOM Elements3 min read
    • Custom Events4 min read
    • Addeventlistener5 min read
    Advanced Topics
    • Closure3 min read
    • Hoisting5 min read
    • Scope4 min read
    • Higher Order Functions7 min read
    • Debugging3 min read
    Courses
    • Placement 360 Course2 min read
    • MERN Full Stack Course2 min read
    • DSA and System Design Course2 min read
You are visitor 01402503 — GeezerVison does not store the pages you look up.
Best viewed with Netscape Navigator 4.7 or Internet Explorer 6 at 800×600. No cookies required.