To combine arrays in JavaScript, use the concat() method. The concat() is a built-in JavaScript method that merges two or more two arrays. The concat() function returns a new array containing the joined arrays. It does not change an existing array.
Syntax
Array.concat(array1, array2, array3,..., arrayX)
Parameters
- Array1 – The second array to be merged with “Array“.
- Array2 – The third array to be merged with “Array“.
- ArrayX – Nth array that is to be merged with “Array“.
Example
arr1 = ['hp', 'dell', 'mac'];
arr2 = ['lenovo', 'msi', 'asus'];
console.log(arr1.concat(arr2));
Output
[ 'hp', 'dell', 'mac', 'lenovo', 'msi', 'asus' ]
You can see that the concat() function has combined an arr1 with the arr2 and gives us a combined array in the output. Now a question might arise, what if we want to combine more than two arrays in JavaScript. However, you can also see that it doesn’t modify or change the existing array.
Combining more than two arrays in JavaScript
To combine more than two arrays in JavaScript, use the array.concat() method. The concat() method accepts more than two arrays and returns, combining them into one array.
arr1 = ['hp', 'dell', 'mac'];
arr2 = ['lenovo', 'msi', 'asus'];
arr3 = ['Microsoft', 'LG', 'Acer'];
arr4 = ['Razer', 'Samsung', 'Xiaomi']
const combinedArray = [].concat(arr1, arr2, arr3, arr4);
console.log(combinedArray);
Output
[
'hp', 'dell',
'mac', 'lenovo',
'msi', 'asus',
'Microsoft', 'LG',
'Acer', 'Razer',
'Samsung', 'Xiaomi'
]
We can combine the value of all four arrays by writing them up in the concat method and separating them by a comma(,).
How does the concat() method work
The array.concat() method checks for all the values in the array, checks the number of arrays and then concatenates it.
arr1 = ['hp', 'dell', 'mac'];
arr2 = ['lenovo', 'msi', 'asus'];
arr3 = ['Microsoft', 'LG', 'Acer'];
console.log(arr1.concat(1, 2, 3));
Output
[ 'hp', 'dell', 'mac', 1, 2, 3 ]
Here we can see how we can even insert values into an array with the help of the concat method in JavaScript.
Combining arrays using spread operator in JavaScript
The spread is a built-in JavaScript operator(...) used to expand or spread an iterable or an array. The spread operator allows us to copy all or part of an existing array into another array. The spread operator is often used in combination with destructuring.
Syntax
[… Array1, …Array2, …Array3, ..., ArrayN]
Arguments
- Array1 – It is the first array in which the rest arrays are to be combined.
- Array2 – It is the second array that is to be combined with the first array.
- ArrayN – It is the nth array to be combined with the first array.
Example
arr1 = ['hp', 'dell', 'mac'];
arr2 = ['lenovo', 'msi', 'asus'];
arr3 = ['Microsoft', 'LG', 'Acer'];
console.log([...arr1, ...arr2, ...arr3]);
Output
[
'hp', 'dell',
'mac', 'lenovo',
'msi', 'asus',
'Microsoft', 'LG',
'Acer'
]
You can tell that the spread operator approach is a shortcut way to combine arrays as the code lines are reduced and easy to remember. Spread is excellent when you know beforehand that you are working with arrays.
Array concat vs. Spread operator
The main difference between concat() and spread operator is its use cases. If you know that you are dealing with arrays, use the spread operator but if you might be dealing with the possibility of a non-array data type like strings or objects, use the concat() method to merge an array.
Merging arrays with push() method in JavaScript
The array push() is a built-in JavaScript method used to push any value at the end of an array, and it can also be used to merge two arrays by pushing the values of the second array in the first array after the already present values.
Syntax
Array.push(…Array2, );
Arguments
Array – It is the first array in which the rest arrays are to be combined.
Array2 – It is the second array that is to be combined with the first array.
Example
Let’s combine arrays using the Spread operator.
arr1 = ['hp', 'dell', 'mac'];
arr2 = ['lenovo', 'msi', 'asus'];
arr3 = ['Microsoft', 'LG', 'Acer'];
let pushmethod = []
pushmethod.push(...arr1, ...arr2, ...arr3)
console.log(pushmethod)
Output
[
'hp', 'dell','mac',
'lenovo','msi', 'asus',
'Microsoft', 'LG','Acer'
]
In this example, we saw that we used the combination of push() method and spread operator to combine multiple arrays into one array in JavaScript.
Conclusion
In this tutorial, we learned how to combine an array with the help of the concat() method, spread operator, and array push() method. My opinion is that use the spread operator to combine arrays because it is the easiest and most concise way.
That’s it for this tutorial.
See also
How to Convert Javascript Array to JSON
How to check if a variable is an array

Krunal Lathiya is a Software Engineer with over eight years of experience. He has developed a strong foundation in computer science principles and a passion for problem-solving. Krunal has experience with various programming languages and technologies, including PHP, Python, and expert in JavaScript. He is comfortable working in front-end and back-end development.