Hard Time with 2-D Array For-Loop Syntax

Question

I have a bit of code shown below, I understand what it is doing but I don't understand part of the syntax. I was wondering if someone could explain it to me. Basically, the code is filling a 2D Array with arrays of randoms integers between 0 and 2. What I don't get is, why do I put "result[i][j]" below after the second for loop. Why don't I just put result[j] instead. I found the code online and knew what it did, but again, I didn't understand that bit of syntax.

 function buildArray(width, height){
 var result= [];
 for (var i = 0 ; i < width; i++) {
 result[i] = [];
 for (var j = 0; j < height; j++) {
 result[i][j] = Math.floor(Math.random() * 3);
 console.log(result[i][j]);
 }
 }
 return result;
}

Answer 1

Let's say you pass into the function a width and height value of 3...

buildArray(3, 3);

You can think of the width value as representing the number of 'column' and the height value as representing the number of 'items' in each column.

In the first iteration of the first for-loop the result has one column. Because i is zero at this time we can say...

result[0] = new Array();

The array is empty, but then the second for-loop comes into play.

The second for-loop populates that newly invoked array, in this example with 3 randomly generated integers.

Let's say that the first iteration of the second for-loop produces the integer '2', the second iteration produces '0', and the third '1'. That would mean that resutl[0] now looks like this...

result[0] = [2, 0, 1];

...so that...

result[0][0] = 2;
result[0][1] = 0;
result[0][2] = 1;

Then i is incremented, and new array at position result[1] is invoked, and then that is populated with 3 items. Etc etc.

The value in the second bracket in result indicates the index-position of the value in the 'height' array, which is itself indicated by the index-position in the result array's first bracket.

By the end of the example result will be an array of length = 3 (three arrays), each containing three randomly generated integers.

Try replacing the console.log() with something like this...

console.log('result['+i+']['+j+'] = ' + result[i][j]);

...to get a better idea of the index-positions of the random numbers being generated.

Also you might like to heck out : Creating a custom two-dimensional Array @ javascriptkit.com

Answer 2

2d array has 2 reference point think of it as table i represent its row and J its column , the syntax simply tells the program that that value to be stored should be at i'th row and j'th column , if you don't provide i'th position it will not recognise row to be considered hope this helps :)

• user4531234: Yeah, that makes sense. Thanks a lot! :)

Answer 3

Lets debug it :)

function buildArray(width, height){
 var result= []; // declared a 1-D array
 for (var i = 0 ; i < width; i++) {
 result[i] = []; // create another array inside the 1-D array. 
 // result[0] = [];
 for (var j = 0; j < height; j++) {
 result[i][j] = Math.floor(Math.random() * 3); // result[0][0] = some random number
 console.log(result[i][j]);
 }
 }
 return result;
}

Coming to your doubt :

why do I put result[i][j] below after the second for loop. Why don't I just put result[j] instead.

If you want to do in that way you have to bit modify the code. See the below code for reference

function buildArray(width, height){
 var result= []; // declared a 1-D array
 for (var i = 0 ; i < width; i++) {
 // result[i] = []; not required 
 var my_array = []; // you need to define a new array
 for (var j = 0; j < height; j++) {
 my_array[j] = Math.floor(Math.random() * 3); // fill your new array with random numbers
 //console.log(result[i][j]); not required
 }
 result.push(my_array); // you need to push your array into results
 }
 return result;
}