CODEWITHSUNDEEP
javascriptarrays
user11777421
user11777421

Reputation:

What does array[1][2] mean?

I was reading the breakout game tutorial from Mozilla, and I encountered a weird array thing. I searched everywhere, but I can't get anything. Code from: (https://developer.mozilla.org/en-US/docs/Games/Tutorials/2D_Breakout_game_pure_JavaScript/Build_the_brick_field )

I tried W3Schools and reading closer in the Mozilla tutorial, but I didn't find any information regarding my problem.

var bricks = [];
for(var c=0; c<brickColumnCount; c++) {
    bricks[c] = [];
    for(var r=0; r<brickRowCount; r++) {
        bricks[c][r] = { x: 0, y: 0 };
/*Right above is what I don't get: bricks[c][r]*/
    }
}

Upvotes: 3

Views: 7329

Answers (4)

user10769363
user10769363

Reputation:

JavaScript is very flexible language. Arrays can be elements of arrays. But I would avoid a term "two-dimensional" arrays in this case because elements of arrays could be of different type. Look at this example:

var arr = [1, "string", ["a", "b", "c", ["d", "e"]], {a: 1, b :2}]

arr[0][0] -> undefined
arr[1][0] -> "s"
arr[2][0] -> "a"
arr[3][0] -> undefined
arr[2][3] -> ["d", "e"]

Upvotes: 2

Travis J
Travis J

Reputation: 82297

In this example, there is a set of columns with size brickColumnCount, and a set of rows with size brickRowCount.

The c and r variables reference the current column and row. So bricks[c][r] is a reference to the current brick at column c and row r. This is because bricks is an array. Each item in the array represents a column, hence you could think of the current column as bricks[c].

The current column is an array as well, but of row data. Each item in that array represents the actual brick. So, if bricks[c] is currentColumn, then bricks[c][r] is currentColumn[r], which represents the current brick.

Essentially, each column holds the row data in this design. There is an array of columns, where each column holds an array of the row data.

If we had a brick set of 3 x 3

ABC
DEF
GHI

and c was 1 while r was 2 (0 based indexing) then we would be looking at brick F in my example.

Getting back to code shown in the question, they are then iterating through each brick in the set, and initializing it to the object { x: 0, y: 0 }, in theory preparing it to be modified to represent some sort of scalar simulation or data (looking at the linked page, it was for collision detection).

Upvotes: 3

James
James

Reputation: 211

The [x] or square brackets is a way in which you can access a list; in Javascript a list is called an array.

Let's say we had a list that was comprised of the numbers 1,2, and 3. In Javascript, this would be presented like so:

let list = [1,2,3]

Now if you wanted to fetch the values from that list, you could do so by using that [x] notation. Javascript starts the index at zero, so keep that in mind with the below examples:

list[0] === 1;
list[1] === 2;
list[2] === 3;

These lists don't have to be just integers. They can be any sort of datatype that Javascript allows like strings or objects or functions. In your case, if we were to replace the [0] index with another list and you wanted to be able access that inner list, you'd have to do list[0][x] with x being the index you want to access within the inner list.

list = [1,2,3];

changed to 

list = [['a','b'],2,3];

If we wanted to get 'a', we'd have to do:

list[0][0] === 'a';

Similarly, we could get 'b' if we did this

list[0][1] === 'b';

Upvotes: 2

entersudonym
entersudonym

Reputation: 187

The syntax array[n][m] allows you to access elements of a two dimensional array. You're probably familiar with the idea of accessing one element of an array: arr[0] will get you the first element of arr, and that value could be a string, number, boolean, etc. That value can also be an array in and of itself. Once you have that array (represented by arr[0]), you can access elements on that array, by doing arr[0][newIndex]. See the following example:

var arr = [
    "hello",
    "world",
    ["my", "new", "array"]
]

With this example, arr[0] gives you "hello", and arr[1] gives you "world". By that logic, arr[3] gives you ["my", "new", "array"]. You now can access elements on this new array: arr[3][0] gives "my", arr[3][1] gives "new", and so on.

EDIT:

To create a two dimensional array in a function, do exactly what you would do to add a number or boolean—now, however, just make it an array!

function myFunction() {
    var myArray = ["one", "two"]
    myArray.push(["embedded", "array", "here"])
}

Upvotes: 6

Related Questions