Game Development Reference
In-Depth Information
Functions
Remember that in an imperative program, the
instructions
are doing the actual job of the program:
they're executed one after the other. This changes the memory and/or the screen so the user notices
that the program is doing something. In the BasicGame program, not all lines in the program are
instructions. One example of an instruction is the line
context.fillRect(0, 0, canvas.width,
canvas.height);
which instructs the canvas to draw a rectangle on the screen with a color specified
in the previous instruction. Because this rectangle happens to be the size of the canvas, the entire
canvas's color is changed.
Because JavaScript is a procedural language, the instructions can be grouped in
functions
. In
JavaScript it isn't obligatory that an instruction be part of a function. For example, the following
instruction in the BasicGame program doesn't belong to a function:
var canvas = undefined;
However, functions are very useful. They prevent duplication of code because the instructions are
only in one place, and they allow the programmer to execute those instructions easily by calling one
name. Grouping instructions in a function is done with braces (
{
and
}
). Such a block of instructions
grouped together is called the
body
of a function. Above the body, you write the
header
of the
function. An example of a function header is as follows:
function mainLoop ()
The header contains, among other things, the
name
of the function (in this case
mainLoop
). As a
programmer, you may choose any name for a function. You have seen that the game loop consists of
two parts:
update
and
draw
. In programming terms, these parts are modeled as functions, as you can
see in the example program. In these functions, you then place the instructions you want to execute
in order to update or draw the game world. The name of the function is preceded by the word
function
, and after the name is a pair of parentheses. These serve to provide information to the
instructions that are executed inside the function. For example, take a look at the following header:
function playAudio (audioFileId)
In this header, the name of the function is
playAudio
; and between the parentheses you see the word
audioFileId
. Apparently the
playAudio
function requires an audio file identifier so it knows which
audio file should be played.
Syntax Diagrams
Programming in a language such as JavaScript can be difficult if you don't know the language's rules.
This topic uses so-called
syntax diagrams
to explain how the language is structured. The
syntax
of a
programming language refers to the formal rules that define what is a valid program (in other words:
a program that a compiler or interpreter can read). By contrast, the
semantics
of a program refer
to the actual
meaning
of it. To illustrate the difference between syntax and semantics, look at the
phrase “all your base are belong to us”. Syntactically, this phrase isn't valid (an interpreter of the
English language would definitely complain about it). However, the
meaning
of this phrase is quite
clear: you apparently lost all your bases to an alien race speaking bad English.
Search WWH ::
Custom Search