Skip to main content

How to Resolve "TypeError: .push is not a function" Error in JavaScript

The TypeError: x.push is not a function is a common error that occurs when you try to call the Array.prototype.push() method on a value that is not an array. This typically happens when you mistakenly assume a variable holds an array, but it actually holds an object, null, undefined, or another non-array type.

This guide will explain the common scenarios that cause this error and show you the correct, modern solutions for both guarding against the error and correctly manipulating your data.

The Core Problem: .push() is an Array-Only Method​

The .push() method is a function that exists exclusively on the Array.prototype. It is designed to add one or more elements to the end of an array. It does not exist on plain objects, strings, numbers, null, or undefined. When you try to call it on any of these non-array types, JavaScript throws a TypeError.

Example of problem:

// Problem: `myData` is a plain object, not an array.
let myData = {
  item1: 'apple'
};

// ⛔️ TypeError: myData.push is not a function
myData.push({ item2: 'banana' });
note

The key to solving this error is to ensure you are only calling .push() on a true array.

Cause 1 (Most Common): The Variable is an Object, Not an Array​

This is a very frequent source of the error. You might have an object and want to add another property to it, but you incorrectly try to use push().

Example of problem:

let user = { name: 'Alice' };

// ⛔️ Incorrect: Trying to use an array method on an object.
user.push({ id: 123 }); // TypeError

Solution: to add a new property to an object, you use dot notation or bracket notation, not push().

let user = { name: 'Alice' };

// ✅ Correct: Use dot notation to add a new key-value pair.
user.id = 123;

console.log(user); // Output: { name: 'Alice', id: 123 }

If your goal was to have an array of users, you must wrap your initial object in an array [].

// ✅ Correct: Start with an array containing the object.
let users = [{ name: 'Alice' }];

users.push({ name: 'Bob' });

console.log(users); // Output: [{ name: 'Alice' }, { name: 'Bob' }]

Cause 2: The Variable is undefined or null​

This happens when a variable you expect to be an array has not been initialized or a function did not return a value.

Example of problem:

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

// ⛔️ TypeError: Cannot read properties of undefined (reading 'push')
myList.push('new item');

Solution: Guard your code by ensuring the variable is an array before you try to push to it. The simplest way is to initialize it with an empty array.

// ✅ Correct: Initialize the variable as an empty array.
let myList = [];
myList.push('new item');
console.log(myList); // Output: ['new item']

If the value might be null or undefined from an external source, you can use a check:

let externalData = null;

if (!Array.isArray(externalData)) {
  externalData = []; // If it's not an array, make it one.
}
externalData.push('new item');

Cause 3: The Variable is an Array-Like Object (e.g., Set, HTMLCollection)​

Some objects look and feel like arrays but are not. These "array-like" objects, such as a Set, Map, or an HTMLCollection from getElementsByClassName, do not have the .push() method.

Example of problem:

let mySet = new Set(['a', 'b']);

// ⛔️ TypeError: mySet.push is not a function
mySet.push('c');

Solution: if you need to use array methods, you must first convert the array-like object into a true array.

1. Using Array.from() (Recommended):

let mySet = new Set(['a', 'b']);

// ✅ Correct: Convert the Set to an array first.
let myArray = Array.from(mySet);
myArray.push('c');

console.log(myArray); // Output: ['a', 'b', 'c']

2. Using the Spread Syntax (...):

let mySet = new Set(['a', 'b']);

// ✅ Correct: Use spread syntax for a concise conversion.
let myArray = [...mySet];
myArray.push('c');
note

For a Set, the correct way to add an item is with the .add() method: mySet.add('c').

Conclusion​

The TypeError: .push is not a function is a clear signal that you are trying to use an array method on the wrong data type.

To solve it, follow this diagnostic process:

  1. Is your variable an object? If so, and you want to add a property, use dot or bracket notation (e.g., myObj.newKey = 'value'). If you wanted an array, wrap the object in [].
  2. Is your variable undefined or null? Ensure you initialize your variables as an empty array (let myList = []) before you try to push to them.
  3. Is your variable an array-like object? (e.g., a Set or HTMLCollection) Convert it to a true array first using Array.from() or the spread syntax (...).

Table of Contents