When working with JavaScript arrays, you have to be careful that you are not calling the push() , pop() , shift() , unShift() , or splice() methods on a variable that is meant to be an array but has a value of undefined .

If you mistakenly do this, you'll get this error:

If you call pop() or any of these other methods instead of push (as in the example above), the error above will carry 'pop' (or the other method you're using) instead. This means the approach you'll learn in the article will work for all methods.

For you to properly understand this article and this error, it is essential to highlight the various reasons that can trigger this issue:

Remember that this method can be push() , pop() , shift() , unShift() or splice() . Let's now analyze each scenario and learn how to fix the error.

Calling the method on a variable that was previously set to undefined

When working with variables and data types like strings, we tend to assign the variable's values like undefined and null before passing in the original value. Sometimes we do this when calling functions or handling certain actions.

For arrays, it doesn't work that way – else, you will get the error:

let myArray = undefined;
myArray.push("John Doe"); // Uncaught TypeError: Cannot read properties of undefined (reading 'push')
console.log(myArray);
To fix this, You must declare that the variable is an array before array methods like the push(), pop(), and others can work on it:
let myArray = [];
myArray.push("John Doe");
console.log(myArray); // ["John Doe"]
Note:  When a variable is declared, it is not recognized as an array variable until it is initialized using either the Array constructor or using array literal notation ([]).
Calling the method on a variable before it has been initialized with an array
As you just learned above, another way you can declare variables is to create them without assigning them a value.
let myArray;
myArray.push("John Doe"); // Uncaught TypeError: Cannot read properties of undefined (reading 'push')
console.log(myArray);
This works well for data types like strings, numbers, and others but doesn't work well for an array. You must initialize arrays with the Array constructor or an array literal notation ([]).
let myArray = [];
// Or
let myArray = new Array();
Our code will now look like this:
let myArray = [];
myArray.push("John Doe");
console.log(myArray); // ["John Doe"]
Calling the method on an array element rather than the array itself
Array methods are meant to be called on the array itself (meaning the array or the variable used to store the array) and not an array element.
// Example of arrays
let myArray = [12, 13, 17];
let myArray2 = [];
let myArray3 = new Array();
// Example of array elements
myArray[0];
myArray[1];
myArray[2];
You might want to push an element to a particular position of an array and think that attaching either the push() or unShift() method to the element directly will fix that. Unfortunately, you will get the "cannot read property 'push' of undefined" error:
let myArray = [12, 13, 17];
myArray[3].push(15); // Uncaught TypeError: Cannot read properties of undefined (reading 'push')
console.log(myArray);
To fix this, you have to call the push method on the variable itself and not on its element:
let myArray = [12, 13, 17];
myArray.push(15);
console.log(myArray); // [12,13,17,15]
Calling the method on an object property that does not exist or has an undefined value
A final scenario could be when you try to call the method on an object property that does not exist or whose value is set to undefined:
const user = { name: 'John Doe', scores: undefined };
const user2 = { name: 'John Doe' };
user.scores.push(50);
user2.scores.push(50); 
// Uncaught TypeError: Cannot read properties of undefined (reading 'push')
In the scenario above, there are two objects: the first object has a key-value pair scores whose value is set to undefined, but it's meant to receive array values. While for the second object, scores does not exist. Both situations can cause errors.
To fix it, all you have to do is initialize the key, so it expects array values using the array literal:
const user = { name: "John Doe", scores: [] };
user.scores.push(50);
console.log(user);
Wrapping Up
In this article, you have learned how to fix the "Cannot read properties of undefined" error, which occurs when you attach these array methods to variables that are not declared or initialized as variables.
Have fun coding!
                
freeCodeCamp is a donor-supported tax-exempt 501(c)(3) charity organization (United States Federal Tax Identification Number: 82-0779546)
                
Our mission: to help people learn to code for free. We accomplish this by creating thousands of videos, articles, and interactive coding lessons - all freely available to the public. We also have thousands of freeCodeCamp study groups around the world.
                
Donations to freeCodeCamp go toward our education initiatives, and help pay for servers, services, and staff.
                    You can make a tax-deductible donation here.
                
Trending Guides
                        Exponents in Python
                        sizeof Operator in C
                        Dijkstra’s Algorithm
                        enumerate() in Python
                        What is an Algorithm?
                        Parse a Boolean in JS
                        Python Datetime.now()
                        Int to String in Java
                        Python Length of List
                        Escape a String in JS
                        What is SQL?
                        HTML New Line
                        Python Slicing
                        JavaScript Range
                        JS Check for Null
                        Java List Example
                        Merge Arrays in JS
                        JS Modulo Operator
                        What is a REST API?
                        JavaScript Encoding