How to Create a Two Dimensional Array in JavaScript

The two-dimensional array is a set of items sharing the same name. The two-dimensional array is an array of arrays, that is to say, to create an array of one-dimensional array objects. They are arranged as a matrix in the form of rows and columns.

JavaScript suggests some methods of creating two-dimensional arrays.

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

How to Create a Two-Dimensional Array?

To create a two-dimensional array in JavaScript, you can use an array of arrays. Here's an example:

var myArray = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];

In this example, we have a two-dimensional array with three rows and three columns. Each row is an array containing three values.

To access an element in a two-dimensional array, you can use two sets of square brackets. The first set of brackets specifies the row, and the second set of brackets specifies the column. For example:

How to Create a Two-Dimensional Array in JavaScript?
var myArray = [ [1, 2, 3], [4, 5, 6], [7, 8, 9] ]; var element = myArray[1][2]; // gets the value in the second row, third column (6) console.log(element)

In this example, we've accessed the element in the second row and third column of the array (with indices 1 and 2, respectively), which has a value of 6.

You can also use loops to iterate over the elements in a two-dimensional array. For example:

Example of iterating over the elements in a two-dimensional array in JavaScript
var myArray = [ [1, 2, 3], [4, 5, 6], [7, 8, 9] ]; for (var i = 0; i < myArray.length; i++) { for (var j = 0; j < myArray[i].length; j++) { console.log(myArray[i][j]); // prints each element in the array } }

Array Constructor

You can use the array constructor and the for loop to create a 2D array like this:

Javascript array constructor
const m = 4; const n = 5; let arr = new Array(m); // create an empty array of length n for (var i = 0; i < m; i++) { arr[i] = new Array(n); // make each element an array } console.log(arr); // Output: [ [ <5 empty items> ], [ <5 empty items> ], [ <5 empty items> ], [ <5 empty items> ] ]

In this example, we've used two nested loops to iterate over each element in the array and print its value to the console.

Array Literal Notation

Lieteral notation method can also be used to create 2D arrays:

Javascript array literal notation
const m = 4; const n = 5; // Note 2nd dimention is not relevant here let arr = []; for (var i = 0; i < m; i++) { arr[i] = []; } console.log(arr); // Output: [ [], [], [], [] ]

The Array.from() method

The Array.from() method will return an array object from any JavaScript object with the length property or an iterable object.

Javascript array literal notation
const m = 4; const n = 5; let arr = Array.from(Array(m), () => new Array(n)); console.log(arr); // Output: [ [ <5 empty items> ], [ <5 empty items> ], [ <5 empty items> ], [ <5 empty items> ] ]

The Array.prototype.map()Method

You can also call the map() function directly:

How to Create a Two Dimensional Array in JavaScript
const m = 4; const n = 5; let arr = Array(m).fill().map(() => Array(n)); console.log(arr); // Output: [ [ <5 empty items> ], [ <5 empty items> ], [ <5 empty items> ], , [ <5 empty items> ] ]

Multidimensional Arrays

Multidimensional arrays are known in JavaScript as arrays inside another array as they are created by using another one-dimensional array.

They can have more than two dimensions. A two-dimensional array is also called a matrix or a table of rows and columns.