concat arrays in javascript

Hello guys today i will show you how to use inbuilt concat array method in javascript.

What is concat method?

Concat is used to merge two or more arrays and it always returns a new array instead of modifying the original arrays.

Example - 1

const array1 = [1,2,3,4,5,6];
const array2 = ["A","B","C","D"];

const array1ToArray2 = array1.concat(array2)
const array2ToArray1 = array2.concat(array1)

console.log(array1ToArray2)
console.log(array2ToArray1)

Output -

[
  1, 2,   3,   4,   5,
  6, 'A', 'B', 'C', 'D'
]
[
  'A', 'B', 'C', 'D', 1,
  2,   3,   4,   5,   6
]

• As you can see we have merged two arrays, one in which we have merged array1 to array2 and second in which we have merged array2 in array1.

Example 2 -

const array1 = [1,2,3,4,5,6];
const array2d = [[1,2],[3,4],[[5,6],[7,8]]];

const array1To2dArray = array1.concat(array2d)

console.log(array1To2dArray);

Output -

[ 1, 2, 3, 4, 5, 6, [ 1, 2 ], [ 3, 4 ], [ [ 5, 6 ], [ 7, 8 ] ] ]

• We have merged array1 with a 2-d array.

Example 3 -

const array1 = [1,2,3,4,5,6];

const separateConcatening = array1.concat(7,8,9,"E","F",true,false,null,undefined,
[10,11,"G","H"],{name:"shubham",age:21},12.967)

console.log(separateConcatening)

Output-

[1,2,3,4,5,6,7,8,9,'E','F',true,false,null,undefined,
  10,11,'G','H',{ name: 'shubham', age: 21 },12.967
]

• Here we have concated array1 with seprate items of different data type like strings, numbers float, boolean,null,undefined,array,object.

Example - 4

const array1 = [1,2,3,4,5,6];
const array2 = ["A","B","C","D"];
const array2d = [[1,2],[3,4],[[5,6],[7,8]]];

const concatArray = (...args) => {
  return args.flat(Infinity)
}

console.log(concatArray([1,2,3,4],[5,6,7,8],array1,array2,array2d))

Output -

[
  1,   2,   3, 4, 5, 6, 7,   8,
  1,   2,   3, 4, 5, 6, 'A', 'B',
  'C', 'D', 1, 2, 3, 4, 5,   6,
  7,   8
]

• We have created an arrow function which accepts an argument as rest parameter so that we can pass any number of arrays to it.
• Then using the array flat() method we have flatten the those array which are 2-dimensional and the returned result will be a 1-d array.

Example - 5

const array1 = [1,2,3,4,5,6];

const array1ToArray1 = array1.concat(array1)

console.log(array1ToArray1)

Output -

[
  1, 2, 3, 4, 5,
  6, 1, 2, 3, 4,
  5, 6
]

• Here we have merged array1 with itself.

Example - 6

const array1 = [1,2,3,4,5,6];
const array2 = ["A","B","C","D"];
const array2d = [[1,2],[3,4],[[5,6],[7,8]]];

const array1ToMultiple = array1.concat(array1,array2,array2d)
console.log(array1ToMultiple)

Output -

[1,2,3,4,5,6,1,2,3,4,5,6,'A', 'B', 'C', 'D',[ 1, 2 ],
  [ 3, 4 ],
  [ [ 5, 6 ], [ 7, 8 ] ]]

• We can also merge multiple arrays by passing them inside concat method.

THANK YOU FOR CHECKING THIS POST

You can contact me on -
Instagram - https://www.instagram.com/supremacism__shubh/
LinkedIn - https://www.linkedin.com/in/shubham-tiwari-b7544b193/
Email - [e-mail]

^^You can help me by some donation at the link below Thank you👇👇 ^^
☕ --> https://www.buymeacoffee.com/waaduheck <--

Also check these posts as well
https://dev.to/shubhamtiwari909/text-animation-in-css-16j9

https://dev.to/shubhamtiwari909/tostring-in-js-27b

https://dev.to/shubhamtiwari909/join-in-javascript-4050

https://dev.to/shubhamtiwari909/going-deep-in-array-sort-js-2n90

Comments

[JoelBonetR 🥇]

Nice post! 😁

Contributing to add more to the list:

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

const arr = [...arr1, ...arr2]; // [ 1, 2, 3, 4, 5, 6]

// You can also use concat like this:
arr1.concat([...arr2]); // [ 1, 2, 3, 4, 5, 6]

Best regards

[Shubham Tiwari]

Thanks for this help like you always did 😉

[JoelBonetR 🥇]

np! :)