JavaScript "Add to Array" Functions (push vs unshift vs others)

How to add element(s) to an array in JavaScript

There are several methods for adding new elements to a JavaScript array. If you instead want to remove elements from an array in JavaScript, we’ve got an article for that too.

Feel free to click the links below to jump ahead to the explanation of each method:

  1. Using push() to add to the end of an array
  2. Using unshift() to add to the beginning of an array
  3. Using splice() to add elements within an array
  4. Using concat() to combine and create new, longer arrays
  5. Using Index Notation to specify an index at which to add an element

Now let’s discuss how and when to execute each of these commands.

Add to the End of an Array Using push()

The push() method will add an element to the end of an array, while its twin function, the pop() method, will remove an element from the end of the array.

To add an element to the end of an array using push(), you would do this:

You can also add multiple elements to an array using push(), as shown below:

If you need to add an element or multiple elements to the end of an array, the push() method will almost always be your simplest and quickest option.

Add to the Beginning of an Array Using unshift()

The unshift() method will add an element to the beginning of an array, while its twin function, shift(), will remove one element from the beginning of the array.

To add an element to the beginning of an array using unshift() try this:

To add multiple elements to the beginning of an array using unshift() try this:

If you need to add elements to the beginning of an array, the unshift() method will almost always be your simplest and quickest option.

Add Element(s) to the Middle of an Array Using splice()

The splice() method modifies the content of an array by removing existing elements and/or adding new elements.

Below you’ll find the proper splice() function syntax:

If you want to insert an element (or elements) into a particular point somewhere within the array, besides the beginning or end, then you should most likely be using the splice() method.

To use splice() your code should look like this:

To add multiple elements in the middle of an array using splice() try this:

The splice command is like the Swiss Army Knife of array manipulation; however, you should first try using the much simpler push or unshift commands before using splice() to add to an array.

Add to an Array By Forming a New Array Using concat()

The concat() method returns a new combined array comprised of the array on which it is called, joined with the array (or arrays) from its argument.

To add some elements to another array using concat() do the following:

It is also possible to directly add non-array values using concat():

The concat() method is a simple solution in situations where you need to combine some arrays together, without bloating your code with for loops or other iterative loops.

Add an Array Element at a Particular Index Using Index Notation

We can also directly manipulate the array, without the use of any array methods, by referring to the index position within the array.

Here we add two new elements at specified positions:

Here we add an element to the end of the array:

The index notation method is often useful when you know exactly where to place an element in the array, regardless of where that position may be. This situation often applies to many sorts of algorithm implementations.

Final Words on Adding to an Array in JavaScript

Adding an element to an array in JavaScript is pretty simple, as it should be, but no one single method is always the best to use. Hopefully you can now feel confident in when to use a particular array-expanding approach in various code contexts. As always, if you have additional questions, comments, additions, or subtractions, give us a heads up below.

Alexandra Leslie

Questions or Comments? Ask Alexandra!

Ask a question and Alexandra will respond to you. We strive to provide the best advice on the net and we are here to help you in any way we can.