- 1.1 Snail Bait
- 1.2 HTML5 Game Development Best Practices
- 1.3 Special Features
- 1.4 Snail Bait's HTML and CSS
- 1.5 Snail Bait's Humble Beginning
- 1.6 The Use of JavaScript in This Book
- 1.7 Conclusion
- 1.8 Exercises
1.6 The Use of JavaScript in This Book
Proficiency in JavaScript is an absolute prerequisite for this book, as discussed in the Preface. JavaScript, however, is a flexible and dynamic language, so there are many ways to use it. The purpose of this section is to show you how this book uses JavaScript; the intent is not to teach you anything at all about the language. To get the most out of this book, you must already know everything that you are about to read, or preferably skim, in this section.
This book defines several JavaScript objects that in more traditional languages such as C++ or Java would be implemented with classes. Those objects range from the games themselves (Snail Bait and Bodega’s Revenge) to objects they contain, such as sprites and sprite behaviors. JavaScript objects are defined with a constructor function and a prototype, as shown in Example 1.6, a severely truncated listing of the SnailBait object.
Example 1.6 Defining JavaScript objects
var
SnailBait=
function
()
{
// Constants and variables are declared herethis
.
LEFT=
1
;
...
}
;
SnailBait.
prototype
=
{
// Methods are defined here draw:
function
(
now)
{
// The draw method takes a single parameter...
}
,
...
}
;
JavaScript objects are instantiated in this book with JavaScript’s new operator, as shown in Example 1.7.
Example 1.7 Creating JavaScript objects
SnailBait.
prototype
=
{
...
createSnailSprites:
function
()
{
var
snail,
snailArtist=
new
SpriteSheetArtist
(
this
.
spritesheet,
this
.
snailCells);
for
(
var
i=
0
;
i<
this
.
snailData.
length;
++
i)
{
snail=
new
Sprite
(
'snail',
snailArtist,
[
this
.
paceBehavior,
this
.
snailShootBehavior,
new
CycleBehavior
(
300
,
// 300ms per image5000
)
// 1.5 seconds interlude]);
snail.
width=
this
.
SNAIL_CELLS_WIDTH;
snail.
height=
this
.
SNAIL_CELLS_HEIGHT;
snail.
velocityX=
snailBait.
SNAIL_PACE_VELOCITY;
this
.
snails.
push
(
snail);
}
}
,
...
}
;
The createSnailSprites() function, which we refer to as a method because it resides in an object, creates a sprite sheet artist, a sprite, and an instance of CycleBehavior. That cycle behavior resides in an array of behaviors that createSnailSprites() passes to the Sprite constructor.
This book also defines objects using JSON (JavaScript Object Notation), as shown in Example 1.8.
Example 1.8 Defining JavaScript objects with JSON
var
SnailBait=
function
()
{
...
// A single object with three propertiesthis
.
fallingWhistleSound=
{
position:
0.03
,
// seconds duration:
1464
,
// milliseconds volume:
0.1
}
;
// An array containing three objects, each of which has two propertiesthis
.
audioChannels=
[
{
playing:
false
,
audio:
null
,
}
,
{
playing:
false
,
audio:
null
,
}
,
{
playing:
false
,
audio:
null
,
}
];
...
}
;
Finally, the JavaScript code in this book adheres closely to the subset of JavaScript discussed in Douglas Crockford’s book JavaScript: The Good Parts. The code in this book also follows the coding conventions discussed in that book.