JavaScript Array push() Method

Video Tutorial
FREE
Array Methods thumbnail
This video belongs to
JavaScript Course With Certification: Unlocking the Power of JavaScript
9 modules
Certificate
Topics Covered

Overview

I am sure you make a groceries list before going to market. We can implement the same kind of functionality in javascript using an array, and to add a new value we use the JavaScript array push method. JavaScript array push method is used to add the new value(s) at the end of an array, i.e. to append values in the array. To use the push method, we have to invoke the push method by passing the value(s) (the value we want to add) as parameter.

What is Array push() in Javascript?

In JavaScript array push method is used to add one or more than one element to the end of an array. It modifies the original array and returns the new length of the array. Here's an example:

In the example above, the push() method is used to add elements ('grape', 'melon', and 'kiwi') to the fruit array. Each new element is appended to the end of the array, and the modified array is displayed using console.log().

How to Create Array Push in JavaScript?

To append new element to the end of a JavaScript array, you can use the push() method. Here's the syntax:

array: The array to which you want to add elements. element1, element2, ..., elementN: The elements you want to add to the array. Here's an exclusive example that demonstrates how to use the push() method in javasccript:

In the example shown above, we have an array called fruits that initially contains three elements. We use the push() method to add two more elements, 'grape' and 'kiwi', to the end of the array. After pushing the elements, we log the updated array to the console, showing the result. The push() method modifies the original array by adding elements to the end, and it returns the new length of the array.

Syntax of Array push() in Javascript

Syntax of using push method-

Parameters of Array push() in Javascript

JavaScript array push() method takes a parameter, which is the value we want to add in the array. Passing any available data type in javascript as parameter will added to the array and doesn't throw any error or exception.

An example of passing a value as a parameter-

Above, we have an array myArr and we are invoking the push method on it by passing a string value "poul" as a parameter. As result, push method will add the "poul" at the end of the myArr array.

JavaScript array push() method takes value(s) as parameter that value can be a single value, many values or array itself separated by commas. Let's understand it by an example-

Above, we have an array myArr and we are invoking the push method on it by passing three new values as arguments, one of them is array itself and other two are object and string value. As result, push method added the three new values at the end of myArr array.

Return Value of Array push() in Javascript

JavaScript array push() method gives a value in return when it gets called. This value is the length of the new array on which push method gets called, let's take an example to understand it-

Above, we have an array myArr and we are invoking the push method on it by passing a string value "poul" as a parameter. We are also assigning the return value of push method call in myVal variable, on logging the value of myVal on console it prints 3 which is the new length of myArr array. This verifies push method returns the length of the new array on it gets called.

Exceptions

In JavaScript, when working with arrays, it's important to be aware of potential exceptions or errors that can occur. Here are some common exceptions related to arrays:

Index Out of Range:

Description: Trying to access an element at an index that falls outside the valid range of the array. Example:

Type Error - Not an Array:

Description: Performing array operations on a variable that is not actually an array. Example:

Undefined or Null Value:

Description: Accessing or manipulating an element that has an undefined or null value. Example:

Incorrect Array Initialization:

Description: Improperly initializing an array, leading to unexpected behavior. Example:

It's crucial to handle these exceptions correctly by verifying array lengths, confirming array types, and validating array indices to ensure your code runs smoothly without errors.

Example

Suppose, in our program, we are using an array having a long list of values, but now we need to add a new value at the end. To do that we have to use the JavaScript array push() method.

Above, we have an array myArr and we are invoking the push method on it by passing the 16 as a parameter. We are also assigning the return value of push method call in myVal variable. As result, push method adds the 16 in the myArr and myVal holds the length of new array which is 17.

Whenever we invoke the push method on an array it just adds the passed value in the parameter at the end of that array. This means the length of an array doesn't matter. In this case:

  • Time complexity will be O(1).
  • Space complexity will be O(n),

Supported Browser

BrowserCompatibility
ChromeYes
Microsoft EdgeYes
IEYes
SafariYes
FireforxYes
OperaYes

More Examples

Adding Elements to an Array:

To add elements to a JavaScript array, you can use the push() method. Here's an example:

In the above example, an array called fruits that initially contains three elements. By calling the push() method and passing in additional elements, we add 'grape' and 'kiwi' to the end of the array.

Merging Two Arrays:

To merge two JavaScript arrays, you can use the concat() method. Here's an example:

In the above example, two arrays, array1 and array2. By calling the concat() method on array1 and passing array2 as an argument, we create a new array mergedArray that contains elements from both arrays.

Calling push() on Non-Array Objects:

You can also use the push() method on non-array objects that behave like arrays. Here's an example:

In this example, we have an object obj that has a length property and numeric indices. By using Array.prototype.push.call(obj, '!'), we treat obj as an array-like object and add the exclamation mark ('!') as the third element.

Using an Object in an Array-like Fashion:

You can mimic array-like behavior using objects in JavaScript. Here's an example:

In this example, we create an object person with numeric indices (0 and 1) and a length property. We can access the values using bracket notation as if it were an array and retrieve the length property to mimic array-like behavior.

FAQs

Q. What is the purpose of the push() method in JavaScript arrays?

A: The push() method of javascript array adds elements to the end of a JavaScript array, expanding its length dynamically.

Q. How to use push() to add elements to a JavaScript array?

A: To use push(), call it on an array, and pass the elements to be added as arguments. Example:

Q. Can push() be used for repetitive element addition in arrays?

A: Certainly! Repetitive element addition can be achieved using push() through loops or multiple method calls. Example:

This adds the number 7 to the numbers array five times. Q4. Are there limitations to the number of elements push() can handle?

Ans: While push() theoretically allows adding an unlimited number of elements, practical limitations depend on available memory and JavaScript engine capabilities. Consider performance implications when dealing with a large number of elements.

Conclusion

  • push is used to add the value at the end of an array.
  • push is a predefined method that takes the new value(s) we want to add as a parameter.
  • push method returns the length of the new array as a return value.
  • Time complexity of using the push method is constant O(1) space complexity is linear O(N).

See also