HTML and CSS Reference
In-Depth Information
The first two statements erase the current tally and the next two put in the updated result. The expression
"Number of matches so far: "+String(count)
deserves more explanation. It accomplishes two
tasks:
•
It takes the variable
count
, which is a number, and turns it into a string of characters.
•
It concatenates the constant string
"Number of matches so far: "
with the result o f
String(count)
.
The concatenation demonstrates that the plus sign has two meanings in JavaScript: If the operands are
numbers, the sign indicates addition. If the operands are character strings, it indicates the two strings
should be concatenated—put together. A fancy phrase for a single symbol having several meanings is
operator overloading
.
What will JavaScript do if one operand is a string and the other a number? The answer depends on which of
the two operands is what data type. Youll see examples of code in which the programmer doesnt put in
the commands to convert text to a number or vice versa, but the statement works because of the specific
order of operations.
I suggest not taking chances, though. Instead, try to remember the rules that govern interpretation of the
plus sign. If you notice that your program increases a number from, say, 1 to 11 to 111 when youre
expecting 1, 2, 3, your code is concatenating strings instead of incrementing numbers, and you need to
convert strings to numbers.
Drawing polygons
Creating polygons provides a good demonstration of HTML5s drawing facilities. To understand the code-
development process used here for drawing polygons, think of the geometric figure as a wheel-like shape
with spokes emanating from its center to each of its vertices. The spokes will not appear in the drawings,
but are to help you, like they helped me, figure out how to draw a polygon. Figure 5-10 illustrates this with a
triangle.
Figure 5-10.
Representing a triangle as a spoked geometric shape can help clarify code development for
drawing polygons. The arrow indicates the first point in the drawing path.
To determine the measure of the angle between spokes, we divide the quantity
2*Math.PI
(representing a complete circle)
by the number of sides the polygon has. We use the angle value
and the
moveTo
method to draw the points of the path.
