Generators & Iterators

The plain-language idea

The iterator protocol is a simple contract: an object is iterable if it has a [Symbol.iterator] method that returns an object with a .next() method, and .next() returns { value, done }. Anything following that contract works with for...of, spread, and destructuring — arrays and strings follow it natively; you can make your own objects follow it too.

Writing that protocol by hand is tedious. A generator function (function*) writes it for you: calling it doesn't run the function, it returns an iterator, and every yield pauses execution and produces one value.

function* countTo(n) {
  for (let i = 1; i <= n; i++) {
    yield i;                 // pause here, hand back i
  }
}

for (const num of countTo(3)) console.log(num); // 1, 2, 3

const it = countTo(2);
it.next(); // { value: 1, done: false }
it.next(); // { value: 2, done: false }
it.next(); // { value: undefined, done: true }

The function's execution genuinely pauses at each yield and resumes exactly where it left off on the next .next() call — local variables and all. That's different from a normal function, which runs start-to-finish in one go.

function* countTo(3) — calling it does NOT run the body. It returns an iterator, paused at the very start.

BackNext

What people usually miss

Watch out

• function* doesn't run the function body on call — it returns an iterator object immediately; the body only executes as .next() is called, step by step.
• yield can receive a value too: whatever you pass into .next(value) becomes the result of the previous yield expression inside the generator — generators can be a two-way channel, not just an output stream.
• Making a custom class iterable means giving it a [Symbol.iterator]() method — the easiest way to implement one is to make it a generator method, since function* already returns a valid iterator.

Why this matters in interviews

"Make this custom object work with for...of" tests whether you understand the iterator protocol as a real contract rather than syntax that only applies to arrays — and generators are the practical tool for implementing it without writing .next() by hand.