Two dimensional array is commonly known as array of arrays. It is very useful in mathematics while working with matrix or grid. There are different approaches to create two dimensional array in JavaScript, these are -
Creating a 2D Array in JavaScript
A 2D array is created by nesting arrays within another array. Each nested array represents a "row," and each element within a row represents a "column."
JavaScript 2D Array1. Using Array Literal Notation - Most used
The basic method to create two dimensional array is by using literal notation [].
Syntax
const mat = [ [ num11, num12, ... ], [ num21, num22, ... ], ... ]
JavaScript
let mat = [
[ 10, 20, 30 ],
[ 40, 50, 60 ],
[ 20, 50, 70 ]
];
console.log(mat);
Output[ [ 10, 20, 30 ], [ 40, 50, 60 ], [ 20, 50, 70 ] ]
2. Using Array.from() Method
The JavaScript Array from() method returns an Array object from any object with a length property or an iterable object.
Syntax
const mat = Array.from({ length: rows }, () => new Array(columns).fill(0));
JavaScript
const rows = 3;
const cols = 4;
const mat = Array.from({ length: rows }, () => new Array(cols).fill(0));
console.log(mat);
Output[ [ 0, 0, 0, 0 ], [ 0, 0, 0, 0 ], [ 0, 0, 0, 0 ] ]
3. Using Nested For Loop
We can also use nested for loop to create a 2D array. The loop will iterate rows * cols times.
JavaScript
let mat = [];
let rows = 3;
let cols = 3;
let val = 0
for (let i = 0; i < rows; i++) {
mat[i] = [];
for (let j = 0; j < cols; j++) {
mat[i][j] = val++;
}
}
console.log(mat);
Output[ [ 0, 1, 2 ], [ 3, 4, 5 ], [ 6, 7, 8 ] ]
4. Using Array.fill() Method
In this approach, we will use the fill() method and map method for creating the two-dimensional array in JavaScript.
Example: This example shows the implementation of above-explained approach.
JavaScript
const rows = 3;
const cols = 4;
const mat = Array(rows).fill().map(() => Array(cols).fill(0));
console.log(mat);
Output[ [ 0, 0, 0, 0 ], [ 0, 0, 0, 0 ], [ 0, 0, 0, 0 ] ]
Accessing Elements in a 2D Array
You can access elements in a 2D array using two indices: the row index and the column index. Remember that JavaScript uses zero-based indexing.
JavaScript
let mat = [
[10, 20, 30],
[40, 50, 60],
[70, 80, 90]
];
console.log(mat[0][1]);
console.log(mat[2][0]);
Modifying Elements in a 2D Array
You can modify specific elements in a 2D array by accessing them with their indices and assigning a new value.
JavaScript
let mat = [
[10, 20, 30],
[40, 50, 60],
[70, 80, 90]
];
mat[1][2] = 100;
console.log(mat);
Output[ [ 10, 20, 30 ], [ 40, 50, 100 ], [ 70, 80, 90 ] ]
Similar Reads
JavaScript 2D Arrays Generally, in JavaScript, we deal with one-dimensional or linear arrays that contain multiple elements of the same type stored at different memory locations with the same name. But, there are also 2D array concepts that exist in JavaScript. What are 2D Arrays?A 2D array is commonly known as an array
3 min read
JavaScript Array of Arrays An array of arrays also known as a multidimensional array is simply an array that contains other arrays as its element. This structure allows you to store and organize data in a tabular format or a nested structure, making it easier to work with complex data in your applications.JavaScriptlet mat =
4 min read
JavaScript Multidimensional Array A multidimensional array in JavaScript is an array that contains other arrays as its elements. These are often used to represent data in a grid or matrix format. In JavaScript, there is no direct syntax for multidimensional arrays, but you can achieve this by creating arrays within arrays.Creating a
4 min read
Reverse an Array in Java Reversing an Array is a common task in every programming language. In Java, there are multiple ways to reverse an array. We can reverse it manually or by using built-in Java methods. In this article, we will discuss different methods to reverse an array with examples.Let us first see the most common
4 min read
How to Return an Array in Java? An array is a data structure that consists of a group of elements of the same data type such that each element of the array can be identified by a single array index or key. The elements of the array are stored in a way that the address of any of the elements can be calculated using the location of
5 min read
Java ArrayList of Arrays ArrayList of arrays can be created just like any other objects using ArrayList constructor. In 2D arrays, it might happen that most of the part in the array is empty. For optimizing the space complexity, Arraylist of arrays can be used. ArrayList<String[ ] > geeks = new ArrayList<String[ ]
2 min read
Java Multi-Dimensional Arrays Multidimensional arrays are used to store the data in rows and columns, where each row can represent another individual array are multidimensional array. It is also known as array of arrays. The multidimensional array has more than one dimension, where each row is stored in the heap independently. T
10 min read
How to Initialize an Array in Java? An array in Java is a linear data structure that is used to store multiple values of the same data type. In an array, each element has a unique index value, which makes it easy to access individual elements. We first need to declare the size of an array because the size of the array is fixed in Java
5 min read
Initialize an ArrayList in Java ArrayList is a part of the collection framework and is present in java.util package. It provides us dynamic arrays in Java. Though it may be slower than standard arrays, but can be helpful in programs where lots of manipulation in the array is needed.ArrayList inherits the AbstractList class and imp
4 min read
How to Declare Two Dimensional Empty Array in JavaScript ? In this article, we are going to learn about Declare two-dimensional empty array by using JavaScript. A two-dimensional array is also known as a 2D array. It is a data structure in JavaScript that can hold values in rows and columns form. It is an array of arrays. Each element in a 2D array is acces
3 min read