Skip to main content

How to Resolve "TypeError: ... is not iterable" Error in JavaScript

The TypeError: X is not iterable is a common error in JavaScript that occurs when you try to use an iteration syntax (like a for...of loop or the spread syntax ...) on a value that is not iterable. This typically happens with plain objects, null, or undefined.

This guide will explain what an "iterable" is, show you the common scenarios that cause this error, and provide the correct, modern solutions for each case.

The Core Problem: What is an Iterable?​

In JavaScript, an iterable is an object that has a specific protocol for being looped over, one item at a time. The for...of loop, the spread syntax (...), and Array.from() are all designed to work with iterables.

Common Iterable Types:

  • Arrays ([])
  • Strings ('')
  • Map objects
  • Set objects

Common Non-Iterable Types:

  • Plain Objects ({})
  • Numbers (123)
  • Booleans (true)
  • null
  • undefined

The "is not iterable" error is thrown when you give one of the non-iterable types to an operation that requires an iterable.

Cause 1 (Most Common): Trying to Iterate Over a Plain Object​

This is the most frequent source of the error. A plain JavaScript object, by default, is not iterable.

Example of problem:

// Problem: `user` is an object, not an array or other iterable.
let user = {
  name: 'Alice',
  id: 123,
};

// ⛔️ TypeError: user is not iterable
for (let property of user) {
  console.log(property);
}

Solution: to iterate over an object's properties, you must first convert its keys, values, or entries into an array, all of which are iterable.

1. Iterate Over Keys (Most Common):

// ✅ Correct: Iterate over the array of keys.
for (let key of Object.keys(user)) {
  console.log(`${key}: ${user[key]}`);
}

Output:

name: Alice
id: 123

2. Iterate Over Values:

// ✅ Correct: Iterate over the array of values.
for (let value of Object.values(user)) {
  console.log(value);
}

Output:

Alice
123

3. Iterate Over Key-Value Pairs (Entries):

// ✅ Correct: Iterate over the array of entries.
for (let [key, value] of Object.entries(user)) {
  console.log(`${key}: ${value}`);
}

Output:

name: Alice
id: 123

Cause 2: Trying to Iterate Over null or undefined​

This happens when a variable you expect to be an array is null or undefined, often due to a function not returning a value or an API call failing.

Example of problem:

let myList; // `myList` is `undefined`

// ⛔️ TypeError: undefined is not iterable
for (let item of myList) {
  console.log(item);
}

// Also occurs with spread syntax
let newArray = [...myList]; // ⛔️ TypeError

Solution: guard your code by providing a fallback empty array. The nullish coalescing operator (??) is the most modern and concise way to do this.

let myList; // `myList` is `undefined`

// ✅ Correct: Use the `??` operator to provide a fallback empty array.
for (let item of (myList ?? [])) {
  console.log(item);
}
// This loop will simply not run, and no error is thrown.

let newArray = [...(myList ?? [])];
console.log(newArray); // # Output: []

Cause 3: Incorrectly Destructuring a Non-Array​

This error also occurs when you try to use array destructuring syntax ([...]) on a value that is not an array (or another iterable).

Example of problem:

let user = { name: 'Alice', id: 123 }; // This is an object

// ⛔️ TypeError: user is not iterable
let [name, id] = user;

This fails because array destructuring is a form of iteration—it expects to be able to pull elements from an iterable.

Solution: use the correct destructuring syntax for the data type.

  • Use curly braces ({...}) for objects.
  • Use square brackets ([...]) for arrays.
// ✅ Correct: Use object destructuring for an object.
let user = { name: 'Alice', id: 123 };
let { name, id } = user;
console.log(name, id); // # Output: Alice 123

Output:

Alice 123

Conclusion​

The TypeError: ... is not iterable is a clear signal that you are trying to loop or spread a value that does not support iteration.

To solve it, follow this diagnostic process:

  1. Is your variable a plain object? If so, you must iterate over an array of its keys, values, or entries using Object.keys(), Object.values(), or Object.entries().
  2. Is your variable null or undefined? Guard your code by providing a fallback empty array with the nullish coalescing operator: (myVar ?? []).
  3. Are you destructuring? Ensure you are using the correct syntax: {...} for objects and [...] for arrays.

Table of Contents