1. JavaScript Two-Dimensional Array
There is no direct method for creating Two-Dimensional Array in JavaScript. But using the Array of Array technique, one can create Two-Dimensional array in JavaScript. Now let us jump into the Example.
2. Declaring Two-Dimensional Array
Now have a look at the below code:

1) Here, we declared a single-dimensional array called Students
. At this stage, the array length is not known.
2) Here, we defined the length for the first dimension. The length for it is 3. Also note, each cell is an array of length unknown, and this tells we have an array of array. Say, for example, if you want to the access the third array, you can use Students[2]. So, three arrays are stacked in an array called Students
.
The below picture depicts the array at this stage:

Here, you can clearly see an Array Students
is having three cells. Means, we know the first dimension and each cell can hold an array. The array in the cell is declared in the above code snippet-2, but its length is not known.
3. Deciding the Second Dimension
Now let us proceed with defining the array inside an array. The code snippet is below:

In the code snippet above, the first dimension of the array specified by the indexing operator in the red box, whereas the second dimension is mentioned by the blue box. Here, we defined two arrays of length 4 which were kept inside the outer array. The third array is still not defined. Below picture shows how the array is now:

The index shown in red identifies the outer array. We can say it will identify a specific student. The index in green identifies a specific cell inside a single student. We can say the first cell is the student’s name, 2nd, 3rd and 4th cells denote the student’s marks. In the above code snippet, we not only defined the second dimension for the Students Array. We also populated the array with values. So, every row identifies a student record and every cell within a student record identifies data specific to a student.
4. Reading Data From 2D Array
Using the index operator, we can also read the data. First dimension locates the outer array (Student Record), the second dimension fetches a specific data about a student. Now look at the below code snippet:
1) Here, we print the student’s name. The index 1 at first dimension locates the record. In our case, it is Johnson’s record data. The second index number 0 tells, we need to get the data from the first cell location. These two indexes together identify the data as ‘Johnson’.
2) Here, we read all other data cells for the student Johnson. Note how the first index fixed to 1 and second index varies to read all the marks obtained cells.
5. Two-Dimensional Array Code Reference
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 |
<!DOCTYPE html> <html lang="en"> <head> <title>Two Dimensional Array</title> </head> <body> <script> //Sample 01: First Create One Dimension var Students = []; //Sample 02: Now create 2nd dimension Students[0] = []; Students[1] = []; Students[2] = []; //Sample 03: Store Data //3.1 Person 1 Students[0][0] = "Prasad"; Students[0][1] = 70; Students[0][2] = 67; Students[0][3] = 90; //3.1 Person 1 Students[1][0] = "Johnson"; Students[1][1] = 55; Students[1][2] = 77; Students[1][3] = 95; //Sample 04: Print Marks of Johnson document.writeln("<h1> JavaScript Two " + "Dimensional Array Example </h1>"); document.writeln("Person Name: " + Students[1][0]); document.writeln("</br>"); document.writeln("Marks - [" + Students[1][1] + "], " + "[" + Students[1][2] + "], " + "[" + Students[1][3] + "]"); </script> </body> </html> |
Output

Categories: JavaScript
Tags: 2D Array, Array of Array