of

In JavaScript, of is a contextual keyword that separates the loop variable from the iterable in a for...of or for await...of loop. On each pass, the loop binds the next value that the iterable produces.

The value after of must be an iterable, an object whose [Symbol.iterator]() method returns an iterator. Arrays, strings, Map and Set objects, and generators qualify, but plain objects don’t. With in instead, the for loop walks property keys. Exiting early through break, return, or an error calls the iterator’s .return() method for cleanup.

Outside a loop head, of isn’t reserved and stays a valid identifier. The for...of loop was added in ES2015. The for await...of form was added in ES2018 and works only where await does: inside an async function and at the top level of a module.

JavaScript of Keyword Syntax

The of keyword appears in for...of and for await...of loops:

JavaScript Syntax 
for (<binding> of <iterable>) <statement>
for await (<binding> of <iterable>) <statement>

The binding is a const, let, var, using, or await using declaration, or an existing variable. Except with using and await using, it can be a destructuring pattern.

JavaScript of Keyword Examples

A for...of loop reads each entry of a Map, but not the properties of a plain object:

JavaScript 
> const scores = new Map([["Ada", 92], ["Grace", 88]]);
undefined

> for (const [name, score] of scores) {
…   console.log(`${name}: ${score}`);
… }
Ada: 92
Grace: 88
undefined

> for (const key of { a: 1 }) {}
Uncaught TypeError: {(intermediate value)} is not iterable

> const of = "still a valid name";
undefined

The loop destructures each [key, value] entry of the map. A plain object throws a TypeError, and the last line uses of as a variable name.

The for await...of form waits for each value of an async iterable, such as the one an async generator returns:

JavaScript 
> const wait = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
undefined
> async function* fetchPages() {
…   for (let page = 1; page <= 3; page++) {
…     await wait(10);
…     yield `page ${page}`;
…   }
… }
undefined

> for await (const page of fetchPages()) {
…   console.log(page);
… }
page 1
page 2
page 3
undefined

Each iteration waits for the generator’s next promise to settle.

JavaScript of Keyword Use Cases

  • Looping over the values of arrays, strings, maps, and sets
  • Destructuring [key, value] pairs from Map entries or Object.entries()
  • Consuming generators and other custom iterables
  • Reading async data sources, such as paginated API results or Node.js streams, with for await...of

Have a question about this? Mentor AI can show you examples, compare related terms, and point you to tutorials.

  • Ask Mentor AI
  • Pick a question and Mentor AI takes it from here.
By Leodanis Pozo Ramos • Updated Nov. 4, 2026
JavaScript Keywords Share Feedback