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.

Watch a video course JavaScript -The Complete Guide (Beginner + Advanced)

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.