How To Push Multiple Values To An Array In JavaScript

Posted on by Edward Anderson
Push multiple Values to an Array in JavaScript

We will learn how to push multiple values to an array in JavaScript using three different methods. Each method is relatively straightforward, and you can choose whichever you want.

Push multiple values to an array in JavaScript 

Using concat()

The concat() function returns a new array merged to an old one with the values provided. This method does nothing to the current array, so we will have to change it by assigning it to the returned array of concat().

Syntax:

concat(value1,value2,value3,…,valueN)

Parameter:

  • value1,2,3,N: Values to concatenate into a new array.

You can use this function to merge your array with a list of multiple values and then assign the array with the returned array from the merging:

let array = ['1'];
array = array.concat('2', 'b', 'IT');
console.log(array);

Output: 

['1', '2', 'b', 'IT']

The above example uses the concat function to create a temp array which has the same values as the current array, after that, it starts to push the values in the list of parameters of concat to the temp array and then returns the temp array. The logic behind this approach is very simple, we will take the returned temp array and assign it to the current array. Now we can receive an array with the pushed values.

Using push() function

If you don’t understand how the concat method work. You can consider using our other approach of using a push function and a list of parameters whose values you want to push into an array. This method will add value to the end of the current array without creating a new temporary one.

Syntax:

push(value1,value2,value3,…,valueN)

Parameter:

  • value1,2,3,N: Values to push into your array

This method adds one element or many elements to the last position of an array.

let array = ['1'];
array.push('push', '2', 'IT');
console.log(array);

Output: 

['1', 'push', '2', 'IT']

Using this approach still produces the same result as the first one. Moreover, it will consume less memory because of not creating any new array. All you have to do is just declare your values inside the parameter list of the push() method and call the method (remember not to assign the array variable to it like the concat() method).

Using spread syntax

Another quick way to deal with this problem is to use spread syntax.

Syntax:

[2, …array, 'IT', 'five', '6']

Parameter:

  • array: An array or an iterable object to be expanded

Spread syntax (…) will unpack an array to a representation of the elements just like they are separated by commas 

let values = ['1','push', '2', 'IT'];
let array = ['hello','world'];
array = [...array,...values]
console.log(array);

Output: 

['hello', 'world', '1', 'push', '2', 'IT']

We can imagine the … operator such as an unpacking operator which will unpack any values contained in an array (iterable object). Hence, if you want to push multiple values to an array, just unpack the current array first and then unpack the array that contains values to push, now assign the current array with a new array containing those two unpacks, you will get what you want.

Summary

We have learned how to push multiple values to an array in JavaScript using three different methods. It would help if you considered that each approach has its pros and cons. We hope you will be successful using our tutorial.

Maybe you are interested:

Related Posts

Leave a Reply

Your email address will not be published. Required fields are marked *