What Distinguishes Generators?

A generator function is defined using the function* syntax, which is combined with the yield keyword. Upon encountering a yield, the generator function pauses, returning the value specified. This unique functionality significantly alters how we manage control flow within JavaScript.

Illustration of the Generator Concept

Step 1: Creating a Generator Function

To define a generator function, you can use the function* syntax. Here’s a basic example:

function* simpleGenerator() {

yield 'Hello';

yield 'World';

}

In this case, simpleGenerator is a generator function that yields two values: "Hello" and "World".

Step 2: Iterating Through a Generator

First, we need to create a generator object by instantiating the generator function. This object conforms to both the iterable and iterator protocols:

const myGenerator = simpleGenerator();

Now, let's iterate through the generator:

console.log(myGenerator.next().value);

// Output: Hello

console.log(myGenerator.next().value);

// Output: World

console.log(myGenerator.next().value);

// Output: undefined

Output of the executed code

Each invocation of myGenerator.next() continues the execution of the generator function until it reaches the next yield. When there are no more values to yield, it returns an object with the value as undefined and done as true.

Generator's Next Object States

Practical Applications

Generators excel when working with sequences of data. They allow you to define potentially infinite sequences without the burden of storing them all in memory at once.

Code Example: Generating an Infinite Sequence

function* infiniteSequence() {

let i = 0;

while (true) {

yield i++;

}

}

const sequence = infiniteSequence();

console.log(sequence.next().value);

// Output: 0

console.log(sequence.next().value);

// Output: 1

// ...and continues

Output of the execution

This generator function creates an infinite sequence of numbers. Despite the infinite loop, it doesn't lead to memory overflow or block the main thread since values are yielded one at a time. The key takeaway is the lazy execution of the infinite loop, facilitated by the generator and its iterator object.

Conclusion

Generators offer a flexible approach to managing asynchronous operations and controlling execution flow as needed. Additionally, they enable lazy evaluations, which can be particularly beneficial when working with large datasets.

If you are interested in learning how to combine promises and generators in JavaScript, you may find this article helpful:

For an in-depth guide on delegating yields between generators, visit: In Plain English 🚀

Thank you for being part of the In Plain English community!

Before you leave:

Be sure to clap and follow the writer ️👏️️

Follow us: X | LinkedIn | YouTube | Discord | Newsletter

Explore our other platforms: Stackademic | CoFeed | Venture

Discover more content at PlainEnglish.io