How to Extend an Existing JavaScript Array with Another Array Without Creating a New Array

There are multiple widely used methods that will extend an existing JavaScript Array with another one without creating a new Array. This tutorial will help you resolve this issue right away.

push()

The push() method is generally used to push an array to the end of an existing one. In ES5 specification, this is often done as follows:

JavaScript push method

let arr1 = [0, 1, 2]; let arr2 = [3, 4, 5]; // Append all items from arr2 onto arr1 Array.prototype.push.apply(arr1, arr2) console.log(arr1);

If your browser supports ES6, you can use the spread operator:

JavaScript push method

let arr1 = [0, 1, 2]; let arr2 = [3, 4, 5]; arr1.push(...arr2); console.log(arr1);

The push() method can take more than one parameters, so you can use the apply() method for passing the array of values to be pushed as a list of function parameters:

JavaScript function when you have its name as a string

let arr1 = [0, 1, 2]; let arr2 = [3, 4, 5]; arr1.push.apply(arr1, arr2) console.log(arr1);

concat()

You can use the concat() method to extend an existing array in JavaScript:

JavaScript concat method

let num1 = [1, 3, 8]; let num2 = [2, 5]; num1 = num1.concat(num2); console.log("new numbers are : " + num1);

Beware of using the concat() method which returns a new array instead of changing the existing array containing the values of the merged arrays. However, it is also technically right for this particular situation.