What are generators in Javascript?

Regular functions return only one, single value (or nothing).

Generators can restore (“yield”) numerous qualities, in a steady progression, on-request. They work extraordinary with iterables, permitting to make information streams easily.

Generator functions

To create a generator, It requires a special syntax construct: function*, so-called “generator function”.

function* generateSequence() {
yield 1;
yield 2;
return 3;
}

Generator function carry on uniquely in contrast to ordinary ones. At the point when such capacity is called, it doesn’t run its code. Rather it restores an uncommon article, called “generator object“, to deal with the execution.

function* generateSequence() {
  yield 1;
  yield 2;
  return 3;
}

// "generator function" creates "generator object"
let generator = generateSequence();
alert(generator); // [object Generator]

The function code execution hasn’t started yet:

The fundamental technique for a generator is straightaway(). When called, it runs the execution until the closest yield proclamation (worth can be discarded, at that point it’s unclear). At that point the capacity execution stops, and the yielded esteem is gotten back to the external code.

The consequence of next() is consistently an article with two properties:

esteem: the yielded esteem.

done: valid if the capacity code has completed, in any case bogus.

For example, here we make the generator and get its previously yielded esteem:

function* generateSequence() {
  yield 1;
  yield 2;
  return 3;
}

let generator = generateSequence();

let one = generator.next();

alert(JSON.stringify(one)); // {value: 1, done: false}

As of now, we got the first value only, and the function execution is on the second line:

Let’s call generator.next() again. It resumes the code execution and returns the next yield:

let two = generator.next(); alert(JSON.stringify(two)); // {value: 2, done: false}

And, if we call it a third time, the execution reaches the return statement that finishes the function:

let three = generator.next();

alert(JSON.stringify(three)); // {value: 3, done: true}

Now the generator is done. We should see it from done:true and process value:3 as the final result.

New calls to generator.next() don’t make sense any more. If we do them, they return the same object: {done: true}.

NOTE:

function* f(…) or function *f(…)?

Both syntaxes are correct.

But usually the first syntax is preferred, as the star * denotes that it’s a generator function, it describes the kind, not the name, so it should stick with the function keyword.