HTML and CSS Reference
In-Depth Information
Nothing here should be too surprising. You accept an array of tiles, and each method lets you access the tile data
without directly manipulating it. This is critical when it comes to encapsulation. You always want to make sure that
the data are protected when you try to access them. If you remember back to your
Point
class, you may have noticed
that you have a clone method on it. This allows you to get a copy of the data so that they stay protected inside your
class, and you don't accidently corrupt them. Although you don't have any safeguards here in the map class, you
definitely don't want to be directly accessing the array itself, and this class enables you to safeguard your engine from
changes in the map data structure. What if you decide that you need to use a new file format for the map data instead
of a two-dimensional array? Perhaps something that is easier to serialize and deserialize, such as JSON, for saving
state in your game? You can safely change that, and the rest of your game will never know, so long as you return the
expected values in
getTileID
and
getTiles
. A JSON map class can simply return the tile data as an array so that your
renderer doesn't break, and you can continue to grow and expand your game's code base.
Now go back to your
game.ts
file and implement the map. Add the following property to your class:
map: map.IMap;
And, below the map data, add the following code to instantiate the map class with the tile data:
this.map = new rogue.map.TileMap(this.tiles);
Next, you will modify the draw call to look like this:
this.renderer.draw(this.map.getTiles());
Note how you are asking the map for its tiles instead of passing in the array directly. Again, this is your
encapsulation, which lets you extend and modify your map over time to better fit your needs. The renderer doesn't
care so long as it gets a single two-dimensional array to render out. Before adding the player, run the game in the
browser, and check that there are no compiler errors. The game should look the same as before (see Figure
19-14
).
Figure 19-14.
Everything should look the same, with no compiler errors
