JavaScript Iterables

Written by Swapnil RajaPublished 24 Aug 2026

An iterable is anything with a Symbol.iterator method, which is what for...of actually looks for.

An iterable is anything with a Symbol.iterator method, which is what for of actually looks for.

Iterable and iterator sound alike but mean different things.

An iterable knows how to produce an iterator; the iterator does the actual work.

Example

javascript

const numbers = [1, 2, 3];

console.log(typeof numbers[Symbol.iterator]);

for (const n of numbers) {
  console.log(n);
}

PreviousJavaScript Iterators NextJavaScript Generator Functions

Example

javascript

console.log(typeof [][Symbol.iterator]);
console.log(typeof "text"[Symbol.iterator]);
console.log(typeof new Map()[Symbol.iterator]);
console.log(typeof new Set()[Symbol.iterator]);

Example

javascript

const settings = { theme: "dark" };
let message;

try {
  for (const value of settings) {
    message = "looped";
  }
} catch (error) {
  message = error.name;
}

console.log(message);

Complete Example

html

<!DOCTYPE html>
<html>
<head>
  <title>JavaScript Iterables</title>
</head>
<body>

  <h1>Iterables</h1>

  <p id="out"></p>

  <script>
    const values = new Set([1, 2, 3]);
    const list = [];

    for (const value of values) {
      list.push(value);
    }

    document.getElementById("out").textContent =
      "From a Set: " + list.join(", ");
  </script>

</body>
</html>

JavaScript Iterables

Example

Iterable Versus Iterator

Syntax

What Counts as Iterable

Example

Plain Objects Are Not Iterable

Example

Spread Needs Iterable Too

Example

Destructuring Also Relies on It

Example

Object Spread Is a Different Feature

Example

Complete Example

Try It Yourself

Important Points

Conclusion