Eloquent JavaScript[1] (2) (PDF)

Eloquent JavaScript
A Modern Introduction to Programming

Marijn Haverbeke

Copyright © 2014 by Marijn Haverbeke
This work is licensed under a Creative Commons attribution-noncommercial
license (http://creativecommons.org/licenses/by-nc/3.0/). All code in the
book may also be considered licensed under an MIT license (http://
opensource.org/licenses/MIT).
The illustrations are contributed by various artists: Cover by Wasif
Hyder. Computer (introduction) and unicycle people (Chapter 21) by
Max Xiantu. Sea of bits (Chapter 1) and weresquirrel (Chapter 4) by
Margarita Martínez and José Menor. Octopuses (Chapter 2 and 4) by
Jim Tierney. Object with on/off switch (Chapter 6) by Dyle MacGregor.
Regular expression diagrams in Chapter 9 generated with regexper.com
by Jeff Avallone. Game concept for Chapter 15 by Thomas Palef. Pixel
art in Chapter 16 by Antonio Perdomo Pastor.
The second edition of Eloquent JavaScript was made possible by 454
financial backers.
You can buy a print version of this book, with an extra bonus chapter
included, printed by No Starch Press at http://www.amazon.com/gp/product/
1593275846/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&camp=1789&creative=9325&creativeASIN=
1593275846&linkCode=as2&tag=marijhaver-20&linkId=VPXXXSRYC5COG5R5.

i

Contents
On programming . . . . .
Why language matters . .
What is JavaScript? . . . .
Code, and what to do with
Overview of this book . . .
Typographic conventions .

. .
. .
. .
it
. .
. .

.
.
.
.
.
.

1 Values, Types, and Operators
Values . . . . . . . . . . . . . . .
Numbers . . . . . . . . . . . . .
Strings . . . . . . . . . . . . . .
Unary operators . . . . . . . . .
Boolean values . . . . . . . . . .
Undefined values . . . . . . . . .
Automatic type conversion . . .
Summary . . . . . . . . . . . . .
2 Program Structure
Expressions and statements .
Variables . . . . . . . . . . . .
Keywords and reserved words
The environment . . . . . . .
Functions . . . . . . . . . . . .
The console.log function . . .
Return values . . . . . . . . .
prompt and confirm . . . . . .
Control flow . . . . . . . . . .
Conditional execution . . . . .
while and do loops . . . . . . .
Indenting Code . . . . . . . .

.
.
.
.
.
.
.
.
.
.
.
.

ii

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.

2
4
6
8
9
10

.
.
.
.
.
.
.
.

11
11
12
15
16
17
19
19
22

.
.
.
.
.
.
.
.
.
.
.
.

23
23
24
26
27
27
28
28
29
30
30
32
34

for loops . . . . . . . . . . . . . . .
Breaking Out of a Loop . . . . . .
Updating variables succinctly . . .
Dispatching on a value with switch
Capitalization . . . . . . . . . . . .
Comments . . . . . . . . . . . . . .
Summary . . . . . . . . . . . . . . .
Exercises . . . . . . . . . . . . . . .
3 Functions
Defining a function . . . .
Parameters and scopes . .
Nested scope . . . . . . . .
Functions as values . . . .
Declaration notation . . .
The call stack . . . . . . .
Optional Arguments . . . .
Closure . . . . . . . . . . .
Recursion . . . . . . . . . .
Growing functions . . . . .
Functions and side effects
Summary . . . . . . . . . .
Exercises . . . . . . . . . .

.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

4 Data Structures: Objects and Arrays
The weresquirrel . . . . . . . . . . . . . .
Data sets . . . . . . . . . . . . . . . . . .
Properties . . . . . . . . . . . . . . . . .
Methods . . . . . . . . . . . . . . . . . .
Objects . . . . . . . . . . . . . . . . . . .
Mutability . . . . . . . . . . . . . . . . .
The lycanthrope’s log . . . . . . . . . . .
Computing correlation . . . . . . . . . .
Objects as maps . . . . . . . . . . . . . .
The final analysis . . . . . . . . . . . . .
Further arrayology . . . . . . . . . . . . .
Strings and their properties . . . . . . .

iii

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.

35
36
36
37
38
38
39
40

.
.
.
.
.
.
.
.
.
.
.
.
.

42
42
43
45
46
47
48
49
50
52
55
58
58
59

.
.
.
.
.
.
.
.
.
.
.
.

61
61
62
63
64
65
68
69
71
73
74
76
78

The arguments object
The Math object . . .
The global object . .
Summary . . . . . . .
Exercises . . . . . . .

.
.
.
.
.

.
.
.
.
.

.
.
.
.
.

5 Higher-Order Functions
Abstraction . . . . . . . . .
Abstracting array traversal
Higher-order functions . .
Passing along arguments .
JSON . . . . . . . . . . . .
Filtering an array . . . . .
Transforming with map . .
Summarizing with reduce .
Composability . . . . . . .
The cost . . . . . . . . . .
Great-great-great-great-… .
Binding . . . . . . . . . . .
Summary . . . . . . . . . .
Exercises . . . . . . . . . .

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

6 The Secret Life of Objects
History . . . . . . . . . . . . .
Methods . . . . . . . . . . . .
Prototypes . . . . . . . . . . .
Constructors . . . . . . . . . .
Overriding derived properties
Prototype interference . . . .
Prototype-less objects . . . . .
Polymorphism . . . . . . . . .
Laying out a table . . . . . . .
Getters and setters . . . . . .
Inheritance . . . . . . . . . . .
The instanceof operator . . . .
Summary . . . . . . . . . . . .
Exercises . . . . . . . . . . . .

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

iv

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.

79
80
82
82
83

.
.
.
.
.
.
.
.
.
.
.
.
.
.

86
87
88
90
91
92
94
95
95
96
98
99
102
102
103

.
.
.
.
.
.
.
.
.
.
.
.
.
.

105
105
107
108
109
110
112
114
115
115
121
122
124
125
126

7 Project: Electronic Life
Definition . . . . . . . . . . . . . .
Representing space . . . . . . . .
A critter’s programming interface
The world object . . . . . . . . .
this and its scope . . . . . . . . .
Animating life . . . . . . . . . . .
It moves . . . . . . . . . . . . . .
More life forms . . . . . . . . . . .
A more lifelike simulation . . . .
Action handlers . . . . . . . . . .
Populating the new world . . . .
Bringing it to life . . . . . . . . .
Exercises . . . . . . . . . . . . . .
8 Bugs and Error Handling
Programmer mistakes . . . .
Strict mode . . . . . . . . . .
Testing . . . . . . . . . . . .
Debugging . . . . . . . . . .
Error propagation . . . . . .
Exceptions . . . . . . . . . .
Cleaning up after exceptions
Selective catching . . . . . .
Assertions . . . . . . . . . .
Summary . . . . . . . . . . .
Exercises . . . . . . . . . . .

.
.
.
.
.
.
.
.
.
.
.

9 Regular Expressions
Creating a regular expression
Testing for matches . . . . . .
Matching a set of characters .
Repeating parts of a pattern .
Grouping subexpressions . . .
Matches and groups . . . . . .
The date type . . . . . . . . .
Word and string boundaries .

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

v

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.

128
128
129
131
132
134
136
139
140
141
142
144
145
147

.
.
.
.
.
.
.
.
.
.
.

149
149
150
151
153
154
156
157
159
161
162
163

.
.
.
.
.
.
.
.

164
164
165
165
167
168
168
170
171

Choice patterns . . . . . . . . . . . . .
The mechanics of matching . . . . . .
Backtracking . . . . . . . . . . . . . . .
The replace method . . . . . . . . . . .
Greed . . . . . . . . . . . . . . . . . . .
Dynamically creating RegExp objects
The search method . . . . . . . . . . .
The lastIndex property . . . . . . . . .
Parsing an INI file . . . . . . . . . . . .
International characters . . . . . . . . .
Summary . . . . . . . . . . . . . . . . .
Exercises . . . . . . . . . . . . . . . . .
10 Modules
Why modules help . . . . . . . . .
Using functions as namespaces . .
Objects as interfaces . . . . . . .
Detaching from the global scope .
Evaluating data as code . . . . .
Require . . . . . . . . . . . . . . .
Slow-loading modules . . . . . . .
Interface design . . . . . . . . . .
Summary . . . . . . . . . . . . . .
Exercises . . . . . . . . . . . . . .

.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.

11 Project: A Programming Language
Parsing . . . . . . . . . . . . . . . . . .
The evaluator . . . . . . . . . . . . . .
Special forms . . . . . . . . . . . . . . .
The environment . . . . . . . . . . . .
Functions . . . . . . . . . . . . . . . . .
Compilation . . . . . . . . . . . . . . .
Cheating . . . . . . . . . . . . . . . . .
Exercises . . . . . . . . . . . . . . . . .

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.

172
172
174
176
177
179
180
180
182
184
185
186

.
.
.
.
.
.
.
.
.
.

188
188
191
192
193
194
195
197
200
202
203

.
.
.
.
.
.
.
.

205
205
210
211
213
215
216
217
218

12 JavaScript and the Browser
220
Networks and the Internet . . . . . . . . . . . . . . . . . . . . . 220

vi

The Web . . . . . . . . . . . . . . . .
HTML . . . . . . . . . . . . . . . . .
HTML and JavaScript . . . . . . . .
In the sandbox . . . . . . . . . . . . .
Compatibility and the browser wars
13 The Document Object Model
Document structure . . . . . . .
Trees . . . . . . . . . . . . . . .
The standard . . . . . . . . . . .
Moving through the tree . . . .
Finding elements . . . . . . . .
Changing the document . . . .
Creating nodes . . . . . . . . . .
Attributes . . . . . . . . . . . .
Layout . . . . . . . . . . . . . .
Styling . . . . . . . . . . . . . .
Cascading styles . . . . . . . . .
Query selectors . . . . . . . . . .
Positioning and animating . . .
Summary . . . . . . . . . . . . .
Exercises . . . . . . . . . . . . .
14 Handling Events
Event handlers . . . . . .
Events and DOM nodes
Event objects . . . . . . .
Propagation . . . . . . .
Default actions . . . . . .
Key events . . . . . . . .
Mouse clicks . . . . . . .
Mouse motion . . . . . .
Scroll events . . . . . . .
Focus events . . . . . . .
Load event . . . . . . . .
Script execution timeline
Setting timers . . . . . .

.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

vii

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.

222
223
225
226
227

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

229
229
230
232
233
234
235
236
238
240
242
244
245
246
249
249

.
.
.
.
.
.
.
.
.
.
.
.
.

252
252
253
254
254
256
257
259
260
263
264
265
266
267

Debouncing . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 268
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 270
Exercises . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 270
15 Project: A Platform Game
The game . . . . . . . . . . .
The technology . . . . . . .
Levels . . . . . . . . . . . . .
Reading a level . . . . . . . .
Actors . . . . . . . . . . . . .
Encapsulation as a burden .
Drawing . . . . . . . . . . . .
Motion and collision . . . . .
Actors and actions . . . . . .
Tracking keys . . . . . . . .
Running the game . . . . . .
Exercises . . . . . . . . . . .

.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.

16 Drawing on Canvas
SVG . . . . . . . . . . . . . . . . . . .
The canvas element . . . . . . . . . .
Filling and stroking . . . . . . . . . .
Paths . . . . . . . . . . . . . . . . . .
Curves . . . . . . . . . . . . . . . . .
Drawing a pie chart . . . . . . . . . .
Text . . . . . . . . . . . . . . . . . . .
Images . . . . . . . . . . . . . . . . .
Transformation . . . . . . . . . . . .
Storing and clearing transformations
Back to the game . . . . . . . . . . .
Choosing a graphics interface . . . .
Summary . . . . . . . . . . . . . . . .
Exercises . . . . . . . . . . . . . . . .

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

.
.
.
.
.
.
.
.
.
.
.
.

272
272
273
274
275
276
279
280
285
288
292
293
295

.
.
.
.
.
.
.
.
.
.
.
.
.
.

297
297
298
300
301
302
306
307
308
310
313
314
320
321
322

17 HTTP
324
The protocol . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 324
Browsers and HTTP . . . . . . . . . . . . . . . . . . . . . . . . 326

viii