JavaScript Array concat()

Posted by

Method

JavaScript Arrays concat() Method

The concat() method in JavaScript is used to merge two or more arrays. It does not change the existing arrays, but instead returns a new array.

This method does not change the existing arrays, but instead returns a new array.

Syntax

The syntax for the concat() method is as follows:

[dm_code_snippet background=”yes” background-mobile=”yes” slim=”no” line-numbers=”no” bg-color=”#abb8c3″ theme=”dark” language=”php” wrapped=”no” height=”” copy-text=”Copy Code” copy-confirmed=”Copied”]

array1.concat(array2, array3,..., arrayX)

[/dm_code_snippet]

Where array1, array2, array3, and arrayX are the arrays to be merged.

Example

Let’s look at a simple example of the concat() method:

[dm_code_snippet background=”yes” background-mobile=”yes” slim=”no” line-numbers=”no” bg-color=”#abb8c3″ theme=”dark” language=”php” wrapped=”no” height=”” copy-text=”Copy Code” copy-confirmed=”Copied”]

var arr1 = [1,2,3];
var arr2 = [4,5,6];

var arr3 = arr1.concat(arr2);

console.log(arr3); // [1,2,3,4,5,6]

[/dm_code_snippet]

In the example above, we have two arrays arr1 and arr2. Then we use the concat() method to merge the two arrays and store the result in a new array, arr3. The result is an array containing all the elements of both arrays.

Adding Elements to an Array

The concat() method can also be used to add elements to an existing array. For example:

[dm_code_snippet background=”yes” background-mobile=”yes” slim=”no” line-numbers=”no” bg-color=”#abb8c3″ theme=”dark” language=”php” wrapped=”no” height=”” copy-text=”Copy Code” copy-confirmed=”Copied”]

var arr1 = [1,2,3];

var arr2 = arr1.concat(4,5,6);

console.log(arr2); // [1,2,3,4,5,6]

[/dm_code_snippet]

In this example, we have an array arr1 with three elements. Then we use the concat() method to add three more elements to the array and store the result in a new array, arr2. The result is an array containing all the elements of the original array plus the new elements.

Merging Arrays of Objects

The concat() method can also be used to merge two or more arrays of objects. For example:

[dm_code_snippet background=”yes” background-mobile=”yes” slim=”no” line-numbers=”no” bg-color=”#abb8c3″ theme=”dark” language=”php” wrapped=”no” height=”” copy-text=”Copy Code” copy-confirmed=”Copied”]

var arr1 = [
  {name: "John"},
  {name: "Bob"}
];

var arr2 = [
  {age: 20},
  {age: 30}
];

var arr3 = arr1.concat(arr2);

console.log(arr3); 

/*
[
  {name: "John"},
  {name: "Bob"},
  {age: 20},
  {age: 30}
]
*/

[/dm_code_snippet]

In this example, we have two arrays of objects, arr1 and arr2. Then we use the concat() method to merge the two arrays and store the result in a new array, arr3. The result is an array containing all the elements of both arrays.

Conclusion

The concat() method in JavaScript is a useful way to merge two or more arrays. It does not change the existing arrays, but instead returns a new array containing all the elements of the original arrays. It can also be used to add elements to an existing array, or to merge arrays of objects.