JavaScript - Add Array to Array of Array

Last Updated : 02 Dec, 2024
Comments
Improve
Suggest changes
Like Article
Like
Report

Here are the different methods to Array to an Array of Array (Multidimensional Array) in JavaScript

1. Using push() Method

The push() method is one of the most common ways to add an array to an array of arrays. It adds a new element (in this case, an array) to the end of the array.

JavaScript 
let mat = [[1, 2], [3, 4]];
let a = [5, 6];

mat.push(a);

console.log(mat);

Output
[ [ 1, 2 ], [ 3, 4 ], [ 5, 6 ] ]
  • push() adds the entire newArr as a new element to the arrOfArr.
  • This method directly modifies the original array by adding a reference to the new array.

2. Using concat() Method

The concat() method creates a new array by merging two or more arrays. It does not modify the original arrays but returns a new array that combines them.

JavaScript 
let mat = [[1, 2], [3, 4]];
let a = [5, 6];

let res = mat.concat([a]);

console.log(res);

Output
[ [ 1, 2 ], [ 3, 4 ], [ 5, 6 ] ]
  • concat([newArr]) combines the arrOfArr with the newArr and returns a new array.
  • The original arrOfArr is not modified, and the result is a new array: [[1, 2], [3, 4], [5, 6]].

3. Using Spread Operator (...)

The spread operator (...) is a modern and concise way to add elements (or arrays) into another array. It can be used to add an array to an array of arrays by expanding both arrays into a new array.

JavaScript 
let mat = [[1, 2], [3, 4]];
let a = [5, 6];

let res = [...mat, a];

console.log(res);
  • [...arrOfArr, newArr] creates a new array by spreading the elements of arrOfArr and then appending the newArr at the end.
  • The resulting array is [[1, 2], [3, 4], [5, 6]].
  • The original arrOfArr remains unchanged.

4. Using unshift() Method

The unshift() method adds a new element (array) to the beginning of the array. If you want to add an array to the front of an array of arrays, this method is the right choice.

JavaScript 
let mat = [[1, 2], [3, 4]];
let a = [5, 6];

mat.unshift(a);

console.log(mat);

Output
[ [ 5, 6 ], [ 1, 2 ], [ 3, 4 ] ]
  • unshift(newArr) adds the newArr to the beginning of arrOfArr.
  • The result will be [[5, 6], [1, 2], [3, 4]].
  • This method mutates the original array by adding the newArr at the start.

5. Using splice() Method

The splice() method can be used to add elements at any position in an array, not just at the beginning or the end. You can specify the index at which to insert the array.

JavaScript 
let mat = [[1, 2], [3, 4]];
let a = [5, 6];

mat.splice(1, 0, a);

console.log(mat);

Output
[ [ 1, 2 ], [ 5, 6 ], [ 3, 4 ] ]
  • splice(1, 0, newArr) adds newArr at index 1, which means it will be inserted between [1, 2] and [3, 4].
  • After execution, arrOfArr becomes [[1, 2], [5, 6], [3, 4]].
  • The splice() method is versatile as it allows insertion at any position in the array.

Which Approach to Choose?

MethodWhen to UseWhy Choose It
push()When adding an array to the end of the array of arrays.Simple and easy for adding elements to the end of the array.
concat()When you want to create a new array without modifying the original one.Returns a new array, preserving the immutability of the original array.
Spread Operator (...)When you want a concise and modern approach to combine arrays.Clean syntax and can be used for merging arrays easily.
unshift()When you need to add an array to the beginning of the array of arrays.Adds the element at the beginning, useful when order matters.
splice()When you need to insert an array at a specific position in the array.Flexible for inserting elements at any position within the array.

Next Article
JavaScript Array of Arrays

S
souravsharma098
Improve
Article Tags :

Similar Reads