Use the Default Iterator from an Array

Create Your First Iterator in JavaScript

Create a Custom Iterator for Any Array

Create Your First Generator in JavaScript

Stop a Generator from Yielding Values

Yield an Array, String, or Any Iterable from a Generator

Avoid Nested For Loops with Generators

Understand Each Iteration Inside a Generator

Use a Generator Like a Closure

Create a State Machine with a Generator

Create a `range` Helper Function with a Generator

Compare a Generator to Using Array Map and Filter

Generators in JavaScript

Iterators are the foundation of generators. Much of the misunderstanding around generators comes from the lack of understanding iterators. An iterator has a `Symbol.iterator` property with an object that contains a `next` method which defines what is output each iteration.

https://app.egghead.io/api/v1/lessons/javascript-create-your-first-iterator-in-javascript/subtitles

John Lindquist: [00:00] To create our own iterator we're going to take apart the pieces of this for loop and use them to create an iterator. First we have some logic of a value of increments and how it starts, so we'll bring that out, paste that here. Then we have when it ends and what happens each time it iterates through the loop.

[00:19] We're going to wrap these two things inside of a function called next. We'll call this function next here. Next returns an object that has a value and that value is going to be this piece here, i++. It's going to increment this i up here every time this function is called.

[00:39] An ending point where a done, we'll take this and we'll call this done. Although for our use case we need to flip this, otherwise it starts out at done because 0is less than 10. We want this to be true when i is greater than 10.

[00:56] We can just call this function. We could say console log next. You'll see value 0done false. We can do that a whole bunch of times until it gets beyond 10. You'll see once we get to 10 it becomes true. Everything before that is 1 through 10 and false. That's essentially how the iterator works, but to make it work inside of a for loop we need to create an object.

[01:23] We'll call this an iterator or an iterable. On that object just like on an array you need a symbol iterator key or technically a computed property. This is a function which returns an object with next on it. Now with that iterator we can say for let value of iterator. Then just log out all the values of the iterator. Save there, we get 0through 9. Once done is true it stops.

Create Your First Iterator in JavaScript

Share this video with your friends

Course

Generators in JavaScript