- Preparing to Build the Classes 0:34
- Practice Brainstorming Properties
- Player Properties Solution 2:57
- Token Properties Brainstorming
- Token Properties Solution 2:33
- Build the createTokens() Method
- createTokens() Method Solution 3:06
- Board and Space Class Constructor Methods
- Board and Space Class Constructor Methods Solution 3:58
- Build the createSpaces() Method
- createSpaces() Method Solution 2:46
- Game Class Constructor Method
- Game Class Constructor Method Solution 2:45
- Reviewing Constructor Methods and Generating Objects 5 questions
Preview
Video Player
00:00
00:00
createSpaces() Method Solution
2:46See the solution for the createSpaces() method.
Well done,
0:00
I hope you enjoyed working through the
createSpaces method in the Board.js file.
0:01
Let's take a look at the solution.
0:06
First, you can see the documentation
written for this method.
0:08
There's a summary line explaining that
this method would generate a 2D array of
0:13
space objects.
0:17
And then there's a line indicating
that an array will be returned,
0:18
followed by a description of the array.
0:21
The first step in this method is to
create a variable called spaces that
0:23
holds an empty array.
0:28
This is the variable that will
eventually be returned from the method.
0:29
After we create the variable,
0:33
we can go through the business
of populating the array.
0:35
We know that the returned
array should be a 2D array.
0:38
This means it's an array whose
elements are also arrays.
0:42
The variable will hold
an array of columns,
0:46
where each column is an array
of individual space objects.
0:49
By setting it up this way, we can access
each column of spaces as a whole,
0:53
which will be really helpful when
it comes time to drop tokens.
0:57
So with that in mind,
the first step is to create a for
1:01
loop that iterates through
the number of columns.
1:04
Remember, the number of columns wias
set in the constructor method and
1:07
can be accessed using this.columns.
1:13
Once we're inside the loop, we'll
declare a new variable called column.
1:16
column is going to hold an array of the
individual space objects in that column.
1:21
First, the column variable
gets set to an empty array.
1:26
Then we write another for loop to
iterate through the rows of that column.
1:29
Inside this nested for loop is where
the new space objects are created.
1:34
We pass the space constructor
method the value for the x and
1:39
y index of the for loops.
1:43
On the next line, we push the newly
created space to the column array.
1:45
On each iteration through this nested for
loop,
1:50
another space is added to the column.
1:52
After the column is complete, and
the nested for loop is finished,
1:54
we push the entire column
back into the spaces array.
1:59
Then the x index is increased by 1, and
2:02
the process continues until the entire
board of spaces has been created.
2:04
After that, we return our array.
2:09
Don't forget about the method call,
though.
2:12
At this point, we have to go
back to our constructor method.
2:14
Make sure to adjust the spaces property so
2:17
then instead of being set to an empty
array, it's set to the return value from
2:19
a call to the createSpaces method,
like you see on the screen.
2:23
To clarify, this means that when
the Board object is created,
2:27
all of the space objects
are created as well.
2:30
Okay, that was pretty tough.
2:33
Nested for loops and two-dimensional
arrays can be complicated to think about.
2:35
If you have any questions,
head over to the Treehouse community.
2:39
All right, only two steps left and
the foundation of our game is complete.
2:42