What are async iterators and for await...of?

Q: What are async iterators and for await...of?

**Target Audience:** Engineers preparing for JavaScript fundamentals/async interviews. **Difficulty:** Medium > **How to read this doc:** Concepts are explained in plain language first, then tagged with 📌 Interview term: . Every yielded/awaited value below was actually run in Node. ## 1. Why This Even Matters — A Story First A regular iterator hands you items one at a time, instantly, like a vending machine dropping a snack the moment you press the button. An async iterator hands you items one at a time too, but each item might genuinely take a moment to actually arrive — like a restaurant server bringing courses out one at a time, each one genuinely worth waiting for before the next is even ready. `for await...of` is the polite guest who genuinely waits for each course to actually arrive before reaching for it, rather than grabbing at an empty plate. ## 2. The Core Idea 📌 **Interview term:** the async iterable protocol requires `[Symbol.asyncIterator]()` returning a

The problem

Question presented to candidate: "Does for await...of only work on async generators, or can it also be used on a plain array containing Promises? What about a custom object you write yourself — what does it need to implement?"

What a strong answer should cover:

📌 Interview term: the async iterable protocol — an object implementing [Symbol.asyncIterator](), returning an async iterator whose next() genuinely returns a Promise of { value, done }, rather than the plain synchronous object the regular iterator protocol (covered in this bank's own dedicated question) returns.
📌 Interview term: for await...of — consumes an async iterable, genuinely awaiting each value in turn before running the loop body — verified directly with a real async generator involving a genuine mid-sequence delay.
📌 Interview term: the real, direct answer to the prompt's first question — verified directly: for await...of genuinely works on a PLAIN array of Promises too, not just a true async generator/iterable — arrays are already regular (synchronous) iterables, and for await...of genuinely awaits each yielded value regardless of whether the underlying iterable is truly async or merely synchronous-but-yielding-Promises.
📌 Interview term: the real, direct answer to the prompt's second question — verified directly: a hand-written custom object implementing [Symbol.asyncIterator](), returning an object with a genuinely async next() method, correctly worked with for await...of — confirming the real, minimal requirement is exactly that one method, following the async mirror of the regular iterable protocol.
A precise answer names that an async function* (an async generator) is genuinely both an async iterator AND an async iterable simultaneously — the identical dual-protocol relationship this bank's own regular generator-function question verifies for plain generators, just with the async variants.

Clarifying questions expected:

None — this is a definitional/technical question; directly answering both halves of the prompt (works on plain Promise arrays too; needs exactly [Symbol.asyncIterator]) is the strong signal.

Code / implementation expected: Yes — real proof across all three cases (async generator, plain Promise array, hand-written custom object) is the clearest, most convincing demonstration.

async-iterators

Try it yourself

Sketch your approach before you read the solution. That is what the interview tests.

Stuck? Get a hint.

A short nudge toward the approach. It will not give the answer away.

Solution

Target Audience: Engineers preparing for JavaScript fundamentals/async interviews. Difficulty: Medium

How to read this doc: Concepts are explained in plain language first, then tagged with 📌 Interview term:. Every yielded/awaited value below was actually run in Node.

1. Why This Even Matters — A Story First

A regular iterator hands you items one at a time, instantly, like a vending machine dropping a snack the moment you press the button. An async iterator hands you items one at a time too, but each item might genuinely take a moment to actually arrive — like a restaurant server bringing courses out one at a time, each one genuinely worth waiting for before the next is even ready. for await...of is the polite guest who genuinely waits for each course to actually arrive before reaching for it, rather than grabbing at an empty plate.

2. The Core Idea

📌 **Interv

The solution is hidden so you can try first

6 min read · 9 sections

Run the code

Edit the code and run it here. Each console line with an expected value becomes a test.

JavaScriptReal proof: for await...of works on a genuine async generator, a plain array of Promises, and a hand-written custom [Symbol.asyncIterator] object