You are on page 1of 490

1HQ[m2Mi Cpa+`BTi

 JQ/2`M AMi`Q/m+iBQM iQ S`Q;`KKBM;

J`BDM >p2`#2F2
*QTv`B;?i Ü kyR9 #v J`BDM >p2`#2F2

h?Bb rQ`F Bb HB+2Mb2/ mM/2`  *`2iBp2 *QKKQMb ii`B#miBQM@MQM+QKK2`+BH


HB+2Mb2 Uhttp://creativecommons.org/licenses/by-nc/3.0/VX HH +Q/2 BM i?2
#QQF Kv HbQ #2 +QMbB/2`2/ HB+2Mb2/ mM/2` M JAh HB+2Mb2 Uhttp://
opensource.org/licenses/MITVX
h?2 BHHmbi`iBQMb `2 +QMi`B#mi2/ #v p`BQmb `iBbib, *Qp2` #v qbB7
>v/2`X *QKTmi2` UBMi`Q/m+iBQMV M/ mMB+v+H2 T2QTH2 U*?Ti2` kRV #v
Jt sBMimX a2 Q7 #Bib U*?Ti2` RV M/ r2`2b[mB``2H U*?Ti2` 9V #v
J`;`Bi J`iőM2x M/ CQbû J2MQ`X P+iQTmb2b U*?Ti2` k M/ 9V #v
CBK hB2`M2vX P#D2+i rBi? QMfQz brBi+? U*?Ti2` eV #v .vH2 J+:`2;Q`X
_2;mH` 2tT`2bbBQM /B;`Kb BM *?Ti2` N ;2M2`i2/ rBi? `2;2tT2`X+QK
#v C2z pHHQM2X :K2 +QM+2Ti 7Q` *?Ti2` R8 #v h?QKb SH27X SBt2H
`i BM *?Ti2` Re #v MiQMBQ S2`/QKQ SbiQ`X
h?2 b2+QM/ 2/BiBQM Q7 1HQ[m2Mi Cpa+`BTi rb K/2 TQbbB#H2 #v 989
}MM+BH #+F2`bX

uQm +M #mv  T`BMi p2`bBQM Q7 i?Bb #QQF- rBi? M 2ti` #QMmb +?Ti2`
BM+Hm/2/- T`BMi2/ #v LQ ai`+? S`2bb i 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=VPXXXSRYC5COG5R5X

B
*QMi2Mib
PM T`Q;`KKBM; X X X X X X X X X X X X X X X X X X X X X X X X X X k
q?v HM;m;2 Kii2`b X X X X X X X X X X X X X X X X X X X X X X X 9
q?i Bb Cpa+`BTi\ X X X X X X X X X X X X X X X X X X X X X X X X X e
*Q/2- M/ r?i iQ /Q rBi? Bi X X X X X X X X X X X X X X X X X X X 3
Pp2`pB2r Q7 i?Bb #QQF X X X X X X X X X X X X X X X X X X X X X X X X N
hvTQ;`T?B+ +QMp2MiBQMb X X X X X X X X X X X X X X X X X X X X X X Ry

R oHm2b- hvT2b- M/ PT2`iQ`b RR


oHm2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X RR
LmK#2`b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X Rk
ai`BM;b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X R8
lM`v QT2`iQ`b X X X X X X X X X X X X X X X X X X X X X X X X X X X Re
"QQH2M pHm2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X Rd
lM/2}M2/ pHm2b X X X X X X X X X X X X X X X X X X X X X X X X X X X RN
miQKiB+ ivT2 +QMp2`bBQM X X X X X X X X X X X X X X X X X X X X X RN
amKK`v X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X kk

k S`Q;`K ai`m+im`2 kj
1tT`2bbBQMb M/ bii2K2Mib X X X X X X X X X X X X X X X X X X X X kj
o`B#H2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X k9
E2vrQ`/b M/ `2b2`p2/ rQ`/b X X X X X X X X X X X X X X X X X X X ke
h?2 2MpB`QMK2Mi X X X X X X X X X X X X X X X X X X X X X X X X X X kd
6mM+iBQMb X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X kd
h?2 +QMbQH2XHQ; 7mM+iBQM X X X X X X X X X X X X X X X X X X X X X X k3
_2im`M pHm2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X k3
T`QKTi M/ +QM}`K X X X X X X X X X X X X X X X X X X X X X X X X X kN
*QMi`QH ~Qr X X X X X X X X X X X X X X X X X X X X X X X X X X X X X jy
*QM/BiBQMH 2t2+miBQM X X X X X X X X X X X X X X X X X X X X X X X X jy
r?BH2 M/ /Q HQQTb X X X X X X X X X X X X X X X X X X X X X X X X X X jk
AM/2MiBM; *Q/2 X X X X X X X X X X X X X X X X X X X X X X X X X X X j9

BB
7Q` HQQTb X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X j8
"`2FBM; Pmi Q7  GQQT X X X X X X X X X X X X X X X X X X X X X X je
lT/iBM; p`B#H2b bm++BM+iHv X X X X X X X X X X X X X X X X X X X je
.BbTi+?BM; QM  pHm2 rBi? brBi+? X X X X X X X X X X X X X X X X jd
*TBiHBxiBQM X X X X X X X X X X X X X X X X X X X X X X X X X X X X j3
*QKK2Mib X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X j3
amKK`v X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X jN
1t2`+Bb2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X 9y

j 6mM+iBQMb 9k
.2}MBM;  7mM+iBQM X X X X X X X X X X X X X X X X X X X X X X X X X 9k
S`K2i2`b M/ b+QT2b X X X X X X X X X X X X X X X X X X X X X X X 9j
L2bi2/ b+QT2 X X X X X X X X X X X X X X X X X X X X X X X X X X X X X 98
6mM+iBQMb b pHm2b X X X X X X X X X X X X X X X X X X X X X X X X X 9e
.2+H`iBQM MQiiBQM X X X X X X X X X X X X X X X X X X X X X X X X 9d
h?2 +HH bi+F X X X X X X X X X X X X X X X X X X X X X X X X X X X X 93
PTiBQMH `;mK2Mib X X X X X X X X X X X X X X X X X X X X X X X X X 9N
*HQbm`2 X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X 8y
_2+m`bBQM X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X 8k
:`QrBM; 7mM+iBQMb X X X X X X X X X X X X X X X X X X X X X X X X X X 88
6mM+iBQMb M/ bB/2 2z2+ib X X X X X X X X X X X X X X X X X X X X X 83
amKK`v X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X 83
1t2`+Bb2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X 8N

9 .i ai`m+im`2b, P#D2+ib M/ ``vb eR


h?2 r2`2b[mB``2H X X X X X X X X X X X X X X X X X X X X X X X X X X X eR
.i b2ib X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X ek
S`QT2`iB2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X ej
J2i?Q/b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X e9
P#D2+ib X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X e8
Jmi#BHBiv X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X e3
h?2 Hv+Mi?`QT2Ƕb HQ; X X X X X X X X X X X X X X X X X X X X X X X X eN
*QKTmiBM; +Q``2HiBQM X X X X X X X X X X X X X X X X X X X X X X X dR
P#D2+ib b KTb X X X X X X X X X X X X X X X X X X X X X X X X X X X dj
h?2 }MH MHvbBb X X X X X X X X X X X X X X X X X X X X X X X X X X d9
6m`i?2` ``vQHQ;v X X X X X X X X X X X X X X X X X X X X X X X X X X de
ai`BM;b M/ i?2B` T`QT2`iB2b X X X X X X X X X X X X X X X X X X X X d3

BBB
h?2 `;mK2Mib Q#D2+i X X X X X X X X X X X X X X X X X X X X X X X X dN
h?2 Ji? Q#D2+i X X X X X X X X X X X X X X X X X X X X X X X X X X X 3y
h?2 ;HQ#H Q#D2+i X X X X X X X X X X X X X X X X X X X X X X X X X X 3k
amKK`v X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X 3k
1t2`+Bb2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X 3j

8 >B;?2`@P`/2` 6mM+iBQMb 3e
#bi`+iBQM X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X 3d
#bi`+iBM; ``v i`p2`bH X X X X X X X X X X X X X X X X X X X X X 33
>B;?2`@Q`/2` 7mM+iBQMb X X X X X X X X X X X X X X X X X X X X X X X Ny
SbbBM; HQM; `;mK2Mib X X X X X X X X X X X X X X X X X X X X X X NR
CaPL X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X Nk
6BHi2`BM; M ``v X X X X X X X X X X X X X X X X X X X X X X X X X X N9
h`Mb7Q`KBM; rBi? KT X X X X X X X X X X X X X X X X X X X X X X X N8
amKK`BxBM; rBi? `2/m+2 X X X X X X X X X X X X X X X X X X X X X X N8
*QKTQb#BHBiv X X X X X X X X X X X X X X X X X X X X X X X X X X X X Ne
h?2 +Qbi X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X N3
:`2i@;`2i@;`2i@;`2i@Ę X X X X X X X X X X X X X X X X X X X X X X NN
"BM/BM; X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X Ryk
amKK`v X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X Ryk
1t2`+Bb2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X Ryj

e h?2 a2+`2i GB72 Q7 P#D2+ib Ry8


>BbiQ`v X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X Ry8
J2i?Q/b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X Ryd
S`QiQivT2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X Ry3
*QMbi`m+iQ`b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X RyN
Pp2``B/BM; /2`Bp2/ T`QT2`iB2b X X X X X X X X X X X X X X X X X X X RRy
S`QiQivT2 BMi2`72`2M+2 X X X X X X X X X X X X X X X X X X X X X X X RRk
S`QiQivT2@H2bb Q#D2+ib X X X X X X X X X X X X X X X X X X X X X X X X RR9
SQHvKQ`T?BbK X X X X X X X X X X X X X X X X X X X X X X X X X X X X RR8
GvBM; Qmi  i#H2 X X X X X X X X X X X X X X X X X X X X X X X X X X RR8
:2ii2`b M/ b2ii2`b X X X X X X X X X X X X X X X X X X X X X X X X X RkR
AM?2`BiM+2 X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X Rkk
h?2 BMbiM+2Q7 QT2`iQ` X X X X X X X X X X X X X X X X X X X X X X X Rk9
amKK`v X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X Rk8
1t2`+Bb2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X Rke

Bp
d S`QD2+i, 1H2+i`QMB+ GB72 Rk3
.2}MBiBQM X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X Rk3
_2T`2b2MiBM; bT+2 X X X X X X X X X X X X X X X X X X X X X X X X X RkN
 +`Bii2`Ƕb T`Q;`KKBM; BMi2`7+2 X X X X X X X X X X X X X X X X X RjR
h?2 rQ`H/ Q#D2+i X X X X X X X X X X X X X X X X X X X X X X X X X X Rjk
i?Bb M/ Bib b+QT2 X X X X X X X X X X X X X X X X X X X X X X X X X X Rj9
MBKiBM; HB72 X X X X X X X X X X X X X X X X X X X X X X X X X X X X Rje
Ai KQp2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X RjN
JQ`2 HB72 7Q`Kb X X X X X X X X X X X X X X X X X X X X X X X X X X X X R9y
 KQ`2 HB72HBF2 bBKmHiBQM X X X X X X X X X X X X X X X X X X X X X R9R
+iBQM ?M/H2`b X X X X X X X X X X X X X X X X X X X X X X X X X X X R9k
SQTmHiBM; i?2 M2r rQ`H/ X X X X X X X X X X X X X X X X X X X X X R99
"`BM;BM; Bi iQ HB72 X X X X X X X X X X X X X X X X X X X X X X X X X X R98
1t2`+Bb2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X R9d

3 "m;b M/ 1``Q` >M/HBM; R9N


S`Q;`KK2` KBbiF2b X X X X X X X X X X X X X X X X X X X X X X X X R9N
ai`B+i KQ/2 X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X R8y
h2biBM; X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X R8R
.2#m;;BM; X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X R8j
1``Q` T`QT;iBQM X X X X X X X X X X X X X X X X X X X X X X X X X X R89
1t+2TiBQMb X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X R8e
*H2MBM; mT 7i2` 2t+2TiBQMb X X X X X X X X X X X X X X X X X X X X R8d
a2H2+iBp2 +i+?BM; X X X X X X X X X X X X X X X X X X X X X X X X X X R8N
bb2`iBQMb X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X ReR
amKK`v X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X Rek
1t2`+Bb2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X Rej

N _2;mH` 1tT`2bbBQMb Re9


*`2iBM;  `2;mH` 2tT`2bbBQM X X X X X X X X X X X X X X X X X X X Re9
h2biBM; 7Q` Ki+?2b X X X X X X X X X X X X X X X X X X X X X X X X X Re8
Ji+?BM;  b2i Q7 +?`+i2`b X X X X X X X X X X X X X X X X X X X X Re8
_2T2iBM; T`ib Q7  Tii2`M X X X X X X X X X X X X X X X X X X X X Red
:`QmTBM; bm#2tT`2bbBQMb X X X X X X X X X X X X X X X X X X X X X X Re3
Ji+?2b M/ ;`QmTb X X X X X X X X X X X X X X X X X X X X X X X X X Re3
h?2 /i2 ivT2 X X X X X X X X X X X X X X X X X X X X X X X X X X X X Rdy
qQ`/ M/ bi`BM; #QmM/`B2b X X X X X X X X X X X X X X X X X X X X RdR

p
*?QB+2 Tii2`Mb X X X X X X X X X X X X X X X X X X X X X X X X X X X Rdk
h?2 K2+?MB+b Q7 Ki+?BM; X X X X X X X X X X X X X X X X X X X X Rdk
"+Fi`+FBM; X X X X X X X X X X X X X X X X X X X X X X X X X X X X X Rd9
h?2 `2TH+2 K2i?Q/ X X X X X X X X X X X X X X X X X X X X X X X X X Rde
:`22/ X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X Rdd
.vMKB+HHv +`2iBM; _2;1tT Q#D2+ib X X X X X X X X X X X X X X RdN
h?2 b2`+? K2i?Q/ X X X X X X X X X X X X X X X X X X X X X X X X X R3y
h?2 HbiAM/2t T`QT2`iv X X X X X X X X X X X X X X X X X X X X X X X R3y
S`bBM; M ALA }H2 X X X X X X X X X X X X X X X X X X X X X X X X X X R3k
AMi2`MiBQMH +?`+i2`b X X X X X X X X X X X X X X X X X X X X X X X R39
amKK`v X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X R38
1t2`+Bb2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X R3e

Ry JQ/mH2b R33
q?v KQ/mH2b ?2HT X X X X X X X X X X X X X X X X X X X X X X X X X X R33
lbBM; 7mM+iBQMb b MK2bT+2b X X X X X X X X X X X X X X X X X X X RNR
P#D2+ib b BMi2`7+2b X X X X X X X X X X X X X X X X X X X X X X X X RNk
.2i+?BM; 7`QK i?2 ;HQ#H b+QT2 X X X X X X X X X X X X X X X X X X RNj
1pHmiBM; /i b +Q/2 X X X X X X X X X X X X X X X X X X X X X X RN9
_2[mB`2 X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X RN8
aHQr@HQ/BM; KQ/mH2b X X X X X X X X X X X X X X X X X X X X X X X X RNd
AMi2`7+2 /2bB;M X X X X X X X X X X X X X X X X X X X X X X X X X X X kyy
amKK`v X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X kyk
1t2`+Bb2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X kyj

RR S`QD2+i,  S`Q;`KKBM; GM;m;2 ky8


S`bBM; X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X ky8
h?2 2pHmiQ` X X X X X X X X X X X X X X X X X X X X X X X X X X X X kRy
aT2+BH 7Q`Kb X X X X X X X X X X X X X X X X X X X X X X X X X X X X X kRR
h?2 2MpB`QMK2Mi X X X X X X X X X X X X X X X X X X X X X X X X X X kRj
6mM+iBQMb X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X kR8
*QKTBHiBQM X X X X X X X X X X X X X X X X X X X X X X X X X X X X X kRe
*?2iBM; X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X kRd
1t2`+Bb2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X kR3

Rk Cpa+`BTi M/ i?2 "`Qrb2` kky


L2irQ`Fb M/ i?2 AMi2`M2i X X X X X X X X X X X X X X X X X X X X X kky

pB
h?2 q2# X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X kkk
>hJG X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X kkj
>hJG M/ Cpa+`BTi X X X X X X X X X X X X X X X X X X X X X X X kk8
AM i?2 bM/#Qt X X X X X X X X X X X X X X X X X X X X X X X X X X X X kke
*QKTiB#BHBiv M/ i?2 #`Qrb2` r`b X X X X X X X X X X X X X X X kkd

Rj h?2 .Q+mK2Mi P#D2+i JQ/2H kkN


.Q+mK2Mi bi`m+im`2 X X X X X X X X X X X X X X X X X X X X X X X X X kkN
h`22b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X kjy
h?2 biM/`/ X X X X X X X X X X X X X X X X X X X X X X X X X X X X X kjk
JQpBM; i?`Qm;? i?2 i`22 X X X X X X X X X X X X X X X X X X X X X X kjj
6BM/BM; 2H2K2Mib X X X X X X X X X X X X X X X X X X X X X X X X X X kj9
*?M;BM; i?2 /Q+mK2Mi X X X X X X X X X X X X X X X X X X X X X X kj8
*`2iBM; MQ/2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X kje
ii`B#mi2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X kj3
GvQmi X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X k9y
aivHBM; X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X k9k
*b+/BM; bivH2b X X X X X X X X X X X X X X X X X X X X X X X X X X X k99
Zm2`v b2H2+iQ`b X X X X X X X X X X X X X X X X X X X X X X X X X X X X k98
SQbBiBQMBM; M/ MBKiBM; X X X X X X X X X X X X X X X X X X X X X k9e
amKK`v X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X k9N
1t2`+Bb2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X k9N

R9 >M/HBM; 1p2Mib k8k


1p2Mi ?M/H2`b X X X X X X X X X X X X X X X X X X X X X X X X X X X X k8k
1p2Mib M/ .PJ MQ/2b X X X X X X X X X X X X X X X X X X X X X X k8j
1p2Mi Q#D2+ib X X X X X X X X X X X X X X X X X X X X X X X X X X X X X k89
S`QT;iBQM X X X X X X X X X X X X X X X X X X X X X X X X X X X X X k89
.27mHi +iBQMb X X X X X X X X X X X X X X X X X X X X X X X X X X X X k8e
E2v 2p2Mib X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X k8d
JQmb2 +HB+Fb X X X X X X X X X X X X X X X X X X X X X X X X X X X X X k8N
JQmb2 KQiBQM X X X X X X X X X X X X X X X X X X X X X X X X X X X X key
a+`QHH 2p2Mib X X X X X X X X X X X X X X X X X X X X X X X X X X X X X kej
6Q+mb 2p2Mib X X X X X X X X X X X X X X X X X X X X X X X X X X X X X ke9
GQ/ 2p2Mi X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X ke8
a+`BTi 2t2+miBQM iBK2HBM2 X X X X X X X X X X X X X X X X X X X X X X kee
a2iiBM; iBK2`b X X X X X X X X X X X X X X X X X X X X X X X X X X X X ked

pBB
.2#QmM+BM; X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X ke3
amKK`v X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X kdy
1t2`+Bb2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X kdy

R8 S`QD2+i,  SHi7Q`K :K2 kdk


h?2 ;K2 X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X kdk
h?2 i2+?MQHQ;v X X X X X X X X X X X X X X X X X X X X X X X X X X X kdj
G2p2Hb X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X kd9
_2/BM;  H2p2H X X X X X X X X X X X X X X X X X X X X X X X X X X X X kd8
+iQ`b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X kde
1M+TbmHiBQM b  #m`/2M X X X X X X X X X X X X X X X X X X X X X kdN
.`rBM; X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X k3y
JQiBQM M/ +QHHBbBQM X X X X X X X X X X X X X X X X X X X X X X X X X k38
+iQ`b M/ +iBQMb X X X X X X X X X X X X X X X X X X X X X X X X X X k33
h`+FBM; F2vb X X X X X X X X X X X X X X X X X X X X X X X X X X X X kNk
_mMMBM; i?2 ;K2 X X X X X X X X X X X X X X X X X X X X X X X X X X kNj
1t2`+Bb2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X kN8

Re .`rBM; QM *Mpb kNd


ao: X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X kNd
h?2 +Mpb 2H2K2Mi X X X X X X X X X X X X X X X X X X X X X X X X X kN3
6BHHBM; M/ bi`QFBM; X X X X X X X X X X X X X X X X X X X X X X X X X jyy
Si?b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X jyR
*m`p2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X jyk
.`rBM;  TB2 +?`i X X X X X X X X X X X X X X X X X X X X X X X X X jye
h2ti X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X jyd
AK;2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X jy3
h`Mb7Q`KiBQM X X X X X X X X X X X X X X X X X X X X X X X X X X X jRy
aiQ`BM; M/ +H2`BM; i`Mb7Q`KiBQMb X X X X X X X X X X X X X X X jRj
"+F iQ i?2 ;K2 X X X X X X X X X X X X X X X X X X X X X X X X X X jR9
*?QQbBM;  ;`T?B+b BMi2`7+2 X X X X X X X X X X X X X X X X X X X jky
amKK`v X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X jkR
1t2`+Bb2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X jkk

Rd >hhS jk9
h?2 T`QiQ+QH X X X X X X X X X X X X X X X X X X X X X X X X X X X X X jk9
"`Qrb2`b M/ >hhS X X X X X X X X X X X X X X X X X X X X X X X X jke

pBBB
sJG>iiT_2[m2bi X X X X X X X X X X X X X X X X X X X X X X X X X X jk3
a2M/BM;  `2[m2bi X X X X X X X X X X X X X X X X X X X X X X X X X X jk3
bvM+?`QMQmb _2[m2bib X X X X X X X X X X X X X X X X X X X X X X X jjy
62i+?BM; sJG .i X X X X X X X X X X X X X X X X X X X X X X X X X jjy
>hhS bM/#QtBM; X X X X X X X X X X X X X X X X X X X X X X X X X X jjR
#bi`+iBM; `2[m2bib X X X X X X X X X X X X X X X X X X X X X X X X jjk
S`QKBb2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X jj8
TT`2+BiBM; >hhS X X X X X X X X X X X X X X X X X X X X X X X X X jj3
a2+m`Biv M/ >hhSa X X X X X X X X X X X X X X X X X X X X X X X X jj3
amKK`v X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X jjN
1t2`+Bb2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X j9y

R3 6Q`Kb M/ 6Q`K 6B2H/b j9k


6B2H/b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X j9k
6Q+mb X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X j99
.Bb#H2/ }2H/b X X X X X X X X X X X X X X X X X X X X X X X X X X X X j98
h?2 7Q`K b  r?QH2 X X X X X X X X X X X X X X X X X X X X X X X X j98
h2ti }2H/b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X j9d
*?2+F#Qt2b M/ `/BQ #miiQMb X X X X X X X X X X X X X X X X X X X j93
a2H2+i }2H/b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X j9N
6BH2 }2H/b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X j8R
aiQ`BM; /i +HB2Mi@bB/2 X X X X X X X X X X X X X X X X X X X X X X X j8j
amKK`v X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X j8e
1t2`+Bb2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X j8d

RN S`QD2+i,  SBMi S`Q;`K j8N


AKTH2K2MiiBQM X X X X X X X X X X X X X X X X X X X X X X X X X X X jey
"mBH/BM; i?2 .PJ X X X X X X X X X X X X X X X X X X X X X X X X X jey
h?2 7QmM/iBQM X X X X X X X X X X X X X X X X X X X X X X X X X X X jeR
hQQH b2H2+iBQM X X X X X X X X X X X X X X X X X X X X X X X X X X X X jek
*QHQ` M/ #`mb? bBx2 X X X X X X X X X X X X X X X X X X X X X X X X je8
apBM; X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X jed
GQ/BM; BK;2 }H2b X X X X X X X X X X X X X X X X X X X X X X X X X je3
6BMBb?BM; mT X X X X X X X X X X X X X X X X X X X X X X X X X X X X X jdy
1t2`+Bb2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X jdk

ky LQ/2XDb jde

Bt
"+F;`QmM/ X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X jde
bvM+?`QMB+Biv X X X X X X X X X X X X X X X X X X X X X X X X X X X X jdd
h?2 MQ/2 +QKKM/ X X X X X X X X X X X X X X X X X X X X X X X X X jd3
JQ/mH2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X j3y
AMbiHHBM; rBi? LSJ X X X X X X X X X X X X X X X X X X X X X X X X j3R
h?2 }H2 bvbi2K KQ/mH2 X X X X X X X X X X X X X X X X X X X X X X X j3k
h?2 >hhS KQ/mH2 X X X X X X X X X X X X X X X X X X X X X X X X X j39
ai`2Kb X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X j3e
 bBKTH2 }H2 b2`p2` X X X X X X X X X X X X X X X X X X X X X X X X X j33
1``Q` ?M/HBM; X X X X X X X X X X X X X X X X X X X X X X X X X X X X jNj
amKK`v X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X jN8
1t2`+Bb2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X jN8

kR S`QD2+i, aFBHH@a?`BM; q2#bBi2 jNN


.2bB;M X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X 9yy
GQM; TQHHBM; X X X X X X X X X X X X X X X X X X X X X X X X X X X X X 9yR
>hhS BMi2`7+2 X X X X X X X X X X X X X X X X X X X X X X X X X X X 9yk
h?2 b2`p2` X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X 9y9
h?2 +HB2Mi X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X 9Rj
1t2`+Bb2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X 9kR
S`Q;`K ai`m+im`2 X X X X X X X X X X X X X X X X X X X X X X X X X 9k9
6mM+iBQMb X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X 9k8
.i ai`m+im`2b, P#D2+ib M/ ``vb X X X X X X X X X X X X X X X 9ke
>B;?2`@P`/2` 6mM+iBQMb X X X X X X X X X X X X X X X X X X X X X X X 9k3
h?2 a2+`2i GB72 Q7 P#D2+ib X X X X X X X X X X X X X X X X X X X X X 9kN
S`QD2+i, 1H2+i`QMB+ GB72 X X X X X X X X X X X X X X X X X X X X X X X 9jy
"m;b M/ 1``Q` >M/HBM; X X X X X X X X X X X X X X X X X X X X X X 9jk
_2;mH` 1tT`2bbBQMb X X X X X X X X X X X X X X X X X X X X X X X X X 9jk
JQ/mH2b X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X 9jj
S`QD2+i,  S`Q;`KKBM; GM;m;2 X X X X X X X X X X X X X X X X 9j8
h?2 .Q+mK2Mi P#D2+i JQ/2H X X X X X X X X X X X X X X X X X X X 9je
>M/HBM; 1p2Mib X X X X X X X X X X X X X X X X X X X X X X X X X X X 9jd
S`QD2+i,  SHi7Q`K :K2 X X X X X X X X X X X X X X X X X X X X X 9j3
.`rBM; QM *Mpb X X X X X X X X X X X X X X X X X X X X X X X X X 9jN
>hhS X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X 99R
6Q`Kb M/ 6Q`K 6B2H/b X X X X X X X X X X X X X X X X X X X X X X X 99k
S`QD2+i,  SBMi S`Q;`K X X X X X X X X X X X X X X X X X X X X X 999

t
LQ/2XDb X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X 99e
S`QD2+i, aFBHH@a?`BM; q2#bBi2 X X X X X X X X X X X X X X X X X X X 993

tB
AMi`Q/m+iBQM
h?Bb Bb  #QQF #Qmi ;2iiBM; +QKTmi2`b iQ /Q r?i vQm rMi i?2K iQ
/QX *QKTmi2`b `2 #Qmi b +QKKQM b b+`2r/`Bp2`b iQ/v- #mi i?2v
+QMiBM  HQi KQ`2 ?B//2M +QKTH2tBiv M/ i?mb `2 ?`/2` iQ QT2`i2 M/
mM/2`biM/X hQ KMv- i?2v `2KBM HB2M- bHB;?iHv i?`2i2MBM; i?BM;bX

q2Ƕp2 7QmM/ irQ 2z2+iBp2 rvb Q7 #`B/;BM; i?2 +QKKmMB+iBQM ;T #2@
ir22M mb- b[mBb?v #BQHQ;B+H Q`;MBbKb rBi?  iH2Mi 7Q` bQ+BH M/ bTiBH
`2bQMBM;- M/ +QKTmi2`b- mM722HBM; KMBTmHiQ`b Q7 K2MBM;H2bb /iX
h?2 }`bi Bb iQ TT2H iQ Qm` b2Mb2 Q7 i?2 T?vbB+H rQ`H/ M/ #mBH/ BM@
i2`7+2b i?i KBKB+ i?i rQ`H/ M/ HHQr mb iQ KMBTmHi2 b?T2b QM 
b+`22M rBi? Qm` }M;2`bX h?Bb rQ`Fb p2`v r2HH 7Q` +bmH K+?BM2 BMi2`@
+iBQMX
"mi r2 ?p2 MQi v2i 7QmM/  ;QQ/ rv iQ mb2 i?2 TQBMi@M/@+HB+F T@
T`Q+? iQ +QKKmMB+i2 i?BM;b iQ i?2 +QKTmi2` i?i i?2 /2bB;M2` Q7 i?2
BMi2`7+2 /B/ MQi MiB+BTi2X 6Q` QT2M@2M/2/ BMi2`7+2b- bm+? b BMbi`m+i@
BM; i?2 +QKTmi2` iQ T2`7Q`K `#Bi``v ibFb- r2Ƕp2 ?/ KQ`2 Hm+F rBi?
M TT`Q+? i?i KF2b mb2 Q7 Qm` iH2Mi 7Q` HM;m;2, i2+?BM; i?2
K+?BM2  HM;m;2X
>mKM HM;m;2b HHQr rQ`/b M/ T?`b2b iQ #2 +QK#BM2/ BM KMv
rvb- r?B+? HHQrb mb iQ bv KMv /Bz2`2Mi i?BM;bX *QKTmi2` HM;m;2b-
i?Qm;? ivTB+HHv H2bb ;`KKiB+HHv ~2tB#H2- 7QHHQr  bBKBH` T`BM+BTH2X

R
*bmH +QKTmiBM; ?b #2+QK2 Km+? KQ`2 rB/2bT`2/ BM i?2 Tbi ky
v2`b- M/ HM;m;2@#b2/ BMi2`7+2b- r?B+? QM+2 r2`2 i?2 /27mHi rv
BM r?B+? T2QTH2 BMi2`+i2/ rBi? +QKTmi2`b- ?p2 H`;2Hv #22M `2TH+2/
rBi? ;`T?B+H BMi2`7+2bX "mi i?2v `2 biBHH i?2`2- B7 vQm FMQr r?2`2
iQ HQQFX PM2 bm+? HM;m;2- Cpa+`BTi- Bb #mBHi BMiQ HKQbi 2p2`v r2#
#`Qrb2` M/ Bb i?mb pBH#H2 QM Dmbi #Qmi 2p2`v +QMbmK2` /2pB+2X
h?Bb #QQF BMi2M/b iQ KF2 vQm 7KBHB` 2MQm;? rBi? i?Bb HM;m;2 iQ
#2 #H2 iQ KF2  +QKTmi2` /Q r?i vQm rMiX

PM T`Q;`KKBM;
A /Q MQi 2MHB;?i2M i?Qb2 r?Q `2 MQi 2;2` iQ H2`M- MQ` `Qmb2
i?Qb2 r?Q `2 MQi MtBQmb iQ ;Bp2 M 2tTHMiBQM i?2Kb2Hp2bX
A7 A ?p2 T`2b2Mi2/ QM2 +Q`M2` Q7 i?2 b[m`2 M/ i?2v +MMQi
+QK2 #+F iQ K2 rBi? i?2 Qi?2` i?`22- A b?QmH/ MQi ;Q Qp2`
i?2 TQBMib ;BMX
ě*QM7m+Bmb
"2bB/2b 2tTHBMBM; Cpa+`BTi- A HbQ rBHH BMi`Q/m+2 i?2 #bB+ T`BM+BTH2b
Q7 T`Q;`KKBM;X S`Q;`KKBM;- Bi im`Mb Qmi- Bb ?`/X h?2 7mM/K2MiH
`mH2b `2 ivTB+HHv bBKTH2 M/ +H2`X "mi T`Q;`Kb #mBHi QM iQT Q7 i?2b2
`mH2b i2M/ iQ #2+QK2 +QKTH2t 2MQm;? iQ BMi`Q/m+2 i?2B` QrM `mH2b M/
+QKTH2tBivX uQmǶ`2 #mBH/BM; vQm` QrM Kx2- BM  rv- M/ vQm KB;?i
Dmbi ;2i HQbi BM BiX
h?2`2 rBHH #2 iBK2b r?2M `2/BM; i?Bb #QQF 722Hb i2``B#Hv 7`mbi`iBM;X
A7 vQm `2 M2r iQ T`Q;`KKBM;- i?2`2 rBHH #2  HQi Q7 M2r Ki2`BH iQ
/B;2biX Jm+? Q7 i?Bb Ki2`BH rBHH i?2M #2 +QK#BM2/ BM rvb i?i `2[mB`2
vQm iQ KF2 //BiBQMH +QMM2+iBQMbX
Ai Bb mT iQ vQm iQ KF2 i?2 M2+2bb`v 2zQ`iX q?2M vQm `2 bi`m;;HBM;
iQ 7QHHQr i?2 #QQF- /Q MQi DmKT iQ Mv +QM+HmbBQMb #Qmi vQm` QrM
+T#BHBiB2bX uQm `2 }M2ěvQm Dmbi M22/ iQ F22T i BiX hF2  #`2F-
`2`2/ bQK2 Ki2`BH- M/ Hrvb KF2 bm`2 vQm `2/ M/ mM/2`biM/ i?2
2tKTH2 T`Q;`Kb M/ 2t2`+Bb2bX G2`MBM; Bb ?`/ rQ`F- #mi 2p2`vi?BM;
vQm H2`M Bb vQm`b M/ rBHH KF2 bm#b2[m2Mi H2`MBM; 2bB2`X
h?2 +QKTmi2` T`Q;`KK2` Bb  +`2iQ` Q7 mMBp2`b2b 7Q` r?B+?
?2 (bB+) HQM2 Bb `2bTQMbB#H2X lMBp2`b2b Q7 pB`imHHv mMHBKBi2/

k
+QKTH2tBiv +M #2 +`2i2/ BM i?2 7Q`K Q7 +QKTmi2` T`Q;`KbX
ěCQb2T? q2Bx2M#mK- *QKTmi2` SQr2` M/ >mKM _2bQM

 T`Q;`K Bb KMv i?BM;bX Ai Bb  TB2+2 Q7 i2ti ivT2/ #v  T`Q;`KK2`-


Bi Bb i?2 /B`2+iBM; 7Q`+2 i?i KF2b i?2 +QKTmi2` /Q r?i Bi /Q2b- Bi Bb
/i BM i?2 +QKTmi2`Ƕb K2KQ`v- v2i Bi +QMi`QHb i?2 +iBQMb T2`7Q`K2/ QM
i?Bb bK2 K2KQ`vX MHQ;B2b i?i i`v iQ +QKT`2 T`Q;`Kb iQ Q#D2+ib
r2 `2 7KBHB` rBi? i2M/ iQ 7HH b?Q`iX  bmT2`}+BHHv }iiBM; QM2 Bb i?i
Q7  K+?BM2ěHQib Q7 b2T`i2 T`ib i2M/ iQ #2 BMpQHp2/- M/ iQ KF2
i?2 r?QH2 i?BM; iB+F- r2 ?p2 iQ +QMbB/2` i?2 rvb BM r?B+? i?2b2 T`ib
BMi2`+QMM2+i M/ +QMi`B#mi2 iQ i?2 QT2`iBQM Q7 i?2 r?QH2X
 +QKTmi2` Bb  K+?BM2 #mBHi iQ +i b  ?Qbi 7Q` i?2b2 BKKi2`BH
K+?BM2bX *QKTmi2`b i?2Kb2Hp2b +M /Q QMHv bimTB/Hv bi`B;?i7Q`r`/
i?BM;bX h?2 `2bQM i?2v `2 bQ mb27mH Bb i?i i?2v /Q i?2b2 i?BM;b i M
BM+`2/B#Hv ?B;? bT22/X  T`Q;`K +M BM;2MBQmbHv +QK#BM2 M 2MQ`KQmb
MmK#2` Q7 i?2b2 bBKTH2 +iBQMb BM Q`/2` iQ /Q p2`v +QKTHB+i2/ i?BM;bX
hQ bQK2 Q7 mb- r`BiBM; +QKTmi2` T`Q;`Kb Bb  7b+BMiBM; ;K2X 
T`Q;`K Bb  #mBH/BM; Q7 i?Qm;?iX Ai Bb +QbiH2bb iQ #mBH/- Bi Bb r2B;?iH2bb-
M/ Bi ;`Qrb 2bBHv mM/2` Qm` ivTBM; ?M/bX
"mi rBi?Qmi +`2-  T`Q;`KǶb bBx2 M/ +QKTH2tBiv rBHH ;`Qr Qmi Q7
+QMi`QH- +QM7mbBM; 2p2M i?2 T2`bQM r?Q +`2i2/ BiX E22TBM; T`Q;`Kb
mM/2` +QMi`QH Bb i?2 KBM T`Q#H2K Q7 T`Q;`KKBM;X q?2M  T`Q;`K
rQ`Fb- Bi Bb #2miB7mHX h?2 `i Q7 T`Q;`KKBM; Bb i?2 bFBHH Q7 +QMi`QHHBM;
+QKTH2tBivX h?2 ;`2i T`Q;`K Bb bm#/m2/ěK/2 bBKTH2 BM Bib +QK@
TH2tBivX
JMv T`Q;`KK2`b #2HB2p2 i?i i?Bb +QKTH2tBiv Bb #2bi KM;2/ #v
mbBM; QMHv  bKHH b2i Q7 r2HH@mM/2`biQQ/ i2+?MB[m2b BM i?2B` T`Q;`KbX
h?2v ?p2 +QKTQb2/ bi`B+i `mH2b Udz#2bi T`+iB+2bǴV T`2b+`B#BM; i?2 7Q`K
T`Q;`Kb b?QmH/ ?p2- M/ i?2 KQ`2 x2HQmb KQM; i?2K rBHH +QMbB/2`
i?Qb2 r?Q ;Q QmibB/2 Q7 i?Bb b72 HBiiH2 xQM2 iQ #2 #/ T`Q;`KK2`bX
q?i ?QbiBHBiv iQ i?2 `B+?M2bb Q7 T`Q;`KKBM;ěiQ i`v iQ `2/m+2 Bi
iQ bQK2i?BM; bi`B;?i7Q`r`/ M/ T`2/B+i#H2- iQ TH+2  i#QQ QM HH
i?2 r2B`/ M/ #2miB7mH T`Q;`Kb5 h?2 HM/b+T2 Q7 T`Q;`KKBM; i2+?@
MB[m2b Bb 2MQ`KQmb- 7b+BMiBM; BM Bib /Bp2`bBiv- M/ biBHH H`;2Hv mM2t@
THQ`2/X Ai Bb +2`iBMHv /M;2`Qmb ;QBM;- Hm`BM; i?2 BM2tT2`B2M+2/ T`Q@
;`KK2` BMiQ HH FBM/b Q7 +QM7mbBQM- #mi i?i QMHv K2Mb vQm b?QmH/
T`Q+22/ rBi? +miBQM M/ F22T vQm` rBib #Qmi vQmX b vQm H2`M i?2`2

j
rBHH Hrvb #2 M2r +?HH2M;2b M/ M2r i2``BiQ`v iQ 2tTHQ`2X S`Q;`K@
K2`b r?Q `27mb2 iQ F22T 2tTHQ`BM; rBHH bi;Mi2- 7Q`;2i i?2B` DQv- M/ ;2i
#Q`2/ rBi? i?2B` +`7iX

q?v HM;m;2 Kii2`b


AM i?2 #2;BMMBM;- i i?2 #B`i? Q7 +QKTmiBM;- i?2`2 r2`2 MQ T`Q;`KKBM;
HM;m;2bX S`Q;`Kb HQQF2/ bQK2i?BM; HBF2 i?Bb,
00110001 00000000 00000000
00110001 00000001 00000001
00110011 00000001 00000010
01010001 00001011 00000010
00100010 00000010 00001000
01000011 00000001 00000000
01000001 00000001 00000001
00010000 00000010 00000000
01100010 00000000 00000000

h?i Bb  T`Q;`K iQ // i?2 MmK#2`b 7`QK R iQ Ry iQ;2i?2` M/ T`BMi


Qmi i?2 `2bmHi, 1 + 2 + ... + 10 = 55X Ai +QmH/ `mM QM  bBKTH2- ?vTQ@
i?2iB+H K+?BM2X hQ T`Q;`K 2`Hv +QKTmi2`b- Bi rb M2+2bb`v iQ b2i
H`;2 ``vb Q7 brBi+?2b BM i?2 `B;?i TQbBiBQM Q` TmM+? ?QH2b BM bi`BTb Q7
+`/#Q`/ M/ 722/ i?2K iQ i?2 +QKTmi2`X uQm +M T`Q##Hv BK;BM2
?Qr i2/BQmb M/ 2``Q`@T`QM2 i?Bb T`Q+2/m`2 rbX 1p2M r`BiBM; bBKTH2
T`Q;`Kb `2[mB`2/ Km+? +H2p2`M2bb M/ /Bb+BTHBM2X *QKTH2t QM2b r2`2
M2`Hv BM+QM+2Bp#H2X
P7 +Qm`b2- KMmHHv 2Mi2`BM; i?2b2 `+M2 Tii2`Mb Q7 #Bib Ui?2 QM2b
M/ x2`QbV /B/ ;Bp2 i?2 T`Q;`KK2`  T`Q7QmM/ b2Mb2 Q7 #2BM;  KB;?iv
rBx`/X M/ i?i ?b iQ #2 rQ`i? bQK2i?BM; BM i2`Kb Q7 DQ# biBb7+iBQMX
1+? HBM2 Q7 i?2 T`2pBQmb T`Q;`K +QMiBMb  bBM;H2 BMbi`m+iBQMX Ai
+QmH/ #2 r`Bii2M BM 1M;HBb? HBF2 i?Bb,
1. Store the number 0 in memory location 0.
2. Store the number 1 in memory location 1.
3. Store the value of memory location 1 in memory location 2.
4. Subtract the number 11 from the value in memory location 2.
5. If the value in memory location 2 is the number 0 ,
continue with instruction 9.

9
6. Add the value of memory location 1 to memory location 0.
7. Add the number 1 to the value of memory location 1.
8. Continue with instruction 3.
9. Output the value of memory location 0.

Hi?Qm;? i?i Bb H`2/v KQ`2 `2/#H2 i?M i?2 bQmT Q7 #Bib- Bi Bb biBHH
`i?2` mMTH2bMiX Ai KB;?i ?2HT iQ mb2 MK2b BMbi2/ Q7 MmK#2`b 7Q`
i?2 BMbi`m+iBQMb M/ K2KQ`v HQ+iBQMbX
Set " total " to 0.
Set " count " to 1.
[ loop ]
Set " compare " to " count ".
Subtract 11 from " compare ".
If " compare " is zero , continue at [ end ].
Add " count " to " total ".
Add 1 to " count ".
Continue at [ loop ].
[ end ]
Output " total ".

*M vQm b22 ?Qr i?2 T`Q;`K rQ`Fb i i?Bb TQBMi\ h?2 }`bi irQ HBM2b
;Bp2 irQ K2KQ`v HQ+iBQMb i?2B` bi`iBM; pHm2b, total rBHH #2 mb2/ iQ
#mBH/ mT i?2 `2bmHi Q7 i?2 +QKTmiiBQM- M/ count rBHH F22T i`+F Q7 i?2
MmK#2` i?i r2 `2 +m``2MiHv HQQFBM; iX h?2 HBM2b mbBM; compare `2
T`Q##Hv i?2 r2B`/2bi QM2bX h?2 T`Q;`K rMib iQ b22 r?2i?2` count
Bb 2[mH iQ RR BM Q`/2` iQ /2+B/2 r?2i?2` Bi +M biQT `mMMBM;X "2+mb2
Qm` ?vTQi?2iB+H K+?BM2 Bb `i?2` T`BKBiBp2- Bi +M QMHv i2bi r?2i?2`
 MmK#2` Bb x2`Q M/ KF2  /2+BbBQM UQ` DmKTV #b2/ QM i?iX aQ Bi
mb2b i?2 K2KQ`v HQ+iBQM H#2H2/ compare iQ +QKTmi2 i?2 pHm2 Q7 count
- 11 M/ KF2b  /2+BbBQM #b2/ QM i?i pHm2X h?2 M2ti irQ HBM2b //
i?2 pHm2 Q7 count iQ i?2 `2bmHi M/ BM+`2K2Mi count #v R 2p2`v iBK2 i?2
T`Q;`K ?b /2+B/2/ i?i count Bb MQi RR v2iX
>2`2 Bb i?2 bK2 T`Q;`K BM Cpa+`BTi,
var total = 0 , count = 1;
while ( count <= 10) {
total += count ;
count += 1;
}
console . log ( total ) ;

8
// → 55

h?Bb p2`bBQM ;Bp2b mb  72r KQ`2 BKT`Qp2K2MibX JQbi BKTQ`iMiHv- i?2`2


Bb MQ M22/ iQ bT2+B7v i?2 rv r2 rMi i?2 T`Q;`K iQ DmKT #+F M/ 7Q`i?
MvKQ`2X h?2 while HM;m;2 +QMbi`m+i iF2b +`2 Q7 i?iX Ai +QMiBMm2b
2t2+miBM; i?2 #HQ+F Ur`TT2/ BM #`+2bV #2HQr Bi b HQM; b i?2 +QM/BiBQM
Bi rb ;Bp2M ?QH/bX h?i +QM/BiBQM Bb count <= 10- r?B+? K2Mb dzcount Bb
H2bb i?M Q` 2[mH iQ RyǴX q2 MQ HQM;2` ?p2 iQ +`2i2  i2KTQ``v pHm2
M/ +QKT`2 i?i iQ x2`Q- r?B+? rb M mMBMi2`2biBM; /2iBHX S`i Q7 i?2
TQr2` Q7 T`Q;`KKBM; HM;m;2b Bb i?i i?2v iF2 +`2 Q7 mMBMi2`2biBM;
/2iBHb 7Q` mbX
i i?2 2M/ Q7 i?2 T`Q;`K- 7i2` i?2 while +QMbi`m+i ?b }MBb?2/- i?2
console.log QT2`iBQM Bb TTHB2/ iQ i?2 `2bmHi BM Q`/2` iQ r`Bi2 Bi b QmiTmiX
6BMHHv- ?2`2 Bb r?i i?2 T`Q;`K +QmH/ HQQF HBF2 B7 r2 ?TT2M2/ iQ
?p2 i?2 +QMp2MB2Mi QT2`iBQMb range M/ sum pBH#H2- r?B+? `2bT2+iBp2Hv
+`2i2  +QHH2+iBQM Q7 MmK#2`b rBi?BM  `M;2 M/ +QKTmi2 i?2 bmK Q7 
+QHH2+iBQM Q7 MmK#2`b,
console . log ( sum ( range (1 , 10) ) );
// → 55

h?2 KQ`H Q7 i?Bb biQ`v Bb i?i i?2 bK2 T`Q;`K +M #2 2tT`2bb2/ BM
HQM; M/ b?Q`i- mM`2/#H2 M/ `2/#H2 rvbX h?2 }`bi p2`bBQM Q7 i?2
T`Q;`K rb 2ti`2K2Hv Q#b+m`2- r?2`2b i?Bb Hbi QM2 Bb HKQbi 1M;HBb?,
log i?2 sum Q7 i?2 range Q7 MmK#2`b 7`QK R iQ RyX Uq2 rBHH b22 BM Hi2`
+?Ti2`b ?Qr iQ #mBH/ QT2`iBQMb HBF2 sum M/ rangeXV
 ;QQ/ T`Q;`KKBM; HM;m;2 ?2HTb i?2 T`Q;`KK2` #v HHQrBM; i?2K
iQ iHF #Qmi i?2 +iBQMb i?i i?2 +QKTmi2` ?b iQ T2`7Q`K QM  ?B;?2`
H2p2HX Ai ?2HTb QKBi mMBMi2`2biBM; /2iBHb- T`QpB/2b +QMp2MB2Mi #mBH/BM;
#HQ+Fb Ubm+? b while M/ console.logV- HHQrb vQm iQ /2}M2 vQm` QrM
#mBH/BM; #HQ+Fb Ubm+? b sum M/ rangeV- M/ KF2b i?Qb2 #HQ+Fb 2bv iQ
+QKTQb2X

q?i Bb Cpa+`BTi\
Cpa+`BTi rb BMi`Q/m+2/ BM RNN8 b  rv iQ // T`Q;`Kb iQ r2# T;2b
BM i?2 L2ib+T2 LpB;iQ` #`Qrb2`X h?2 HM;m;2 ?b bBM+2 #22M /QTi2/
#v HH Qi?2` KDQ` ;`T?B+H r2# #`Qrb2`bX Ai ?b K/2 KQ/2`M r2#

e
TTHB+iBQMb TQbbB#H2ěTTHB+iBQMb rBi? r?B+? vQm +M BMi2`+i /B`2+iHv-
rBi?Qmi /QBM;  T;2 `2HQ/ 7Q` 2p2`v +iBQMX "mi Bi Bb HbQ mb2/ BM
KQ`2 i`/BiBQMH r2#bBi2b iQ T`QpB/2 p`BQmb 7Q`Kb Q7 BMi2`+iBpBiv M/
+H2p2`M2bbX
Ai Bb BKTQ`iMi iQ MQi2 i?i Cpa+`BTi ?b HKQbi MQi?BM; iQ /Q
rBi? i?2 T`Q;`KKBM; HM;m;2 MK2/ CpX h?2 bBKBH` MK2 rb BM@
bTB`2/ #v K`F2iBM; +QMbB/2`iBQMb- `i?2` i?M ;QQ/ Dm/;K2MiX q?2M
Cpa+`BTi rb #2BM; BMi`Q/m+2/- i?2 Cp HM;m;2 rb #2BM; ?2pBHv
K`F2i2/ M/ rb ;BMBM; TQTmH`BivX aQK2QM2 i?Qm;?i Bi rb  ;QQ/
B/2 iQ i`v iQ `B/2 HQM; QM i?Bb bm++2bbX LQr r2 `2 bim+F rBi? i?2
MK2X
7i2` Bib /QTiBQM QmibB/2 Q7 L2ib+T2-  biM/`/ /Q+mK2Mi rb r`Bi@
i2M iQ /2b+`B#2 i?2 rv i?2 Cpa+`BTi HM;m;2 b?QmH/ rQ`F iQ KF2
bm`2 i?2 p`BQmb TB2+2b Q7 bQ7ir`2 i?i +HBK2/ iQ bmTTQ`i Cpa+`BTi
r2`2 +imHHv iHFBM; #Qmi i?2 bK2 HM;m;2X h?Bb Bb +HH2/ i?2 1*@
Ja+`BTi biM/`/- 7i2` i?2 1+K AMi2`MiBQMH Q`;MBxiBQM i?i /B/
i?2 biM/`/BxiBQMX AM T`+iB+2- i?2 i2`Kb 1*Ja+`BTi M/ Cpa+`BTi
+M #2 mb2/ BMi2`+?M;2#Hvěi?2v `2 irQ MK2b 7Q` i?2 bK2 HM;m;2X
h?2`2 `2 i?Qb2 r?Q rBHH bv i2``B#H2 i?BM;b #Qmi i?2 Cpa+`BTi HM@
;m;2X JMv Q7 i?2b2 i?BM;b `2 i`m2X q?2M A rb `2[mB`2/ iQ r`Bi2
bQK2i?BM; BM Cpa+`BTi 7Q` i?2 }`bi iBK2- A [mB+FHv +K2 iQ /2bTBb2 BiX
Ai rQmH/ ++2Ti HKQbi Mvi?BM; A ivT2/ #mi BMi2`T`2i Bi BM  rv i?i
rb +QKTH2i2Hv /Bz2`2Mi 7`QK r?i A K2MiX h?Bb ?/  HQi iQ /Q rBi?
i?2 7+i i?i A /B/ MQi ?p2  +Hm2 r?i A rb /QBM;- Q7 +Qm`b2- #mi i?2`2
Bb  `2H Bbbm2 ?2`2, Cpa+`BTi Bb `B/B+mHQmbHv HB#2`H BM r?i Bi HHQrbX
h?2 B/2 #2?BM/ i?Bb /2bB;M rb i?i Bi rQmH/ KF2 T`Q;`KKBM; BM
Cpa+`BTi 2bB2` 7Q` #2;BMM2`bX AM +imHBiv- Bi KQbiHv KF2b }M/BM;
T`Q#H2Kb BM vQm` T`Q;`Kb ?`/2` #2+mb2 i?2 bvbi2K rBHH MQi TQBMi
i?2K Qmi iQ vQmX
h?Bb ~2tB#BHBiv HbQ ?b Bib /pMi;2b- i?Qm;?X Ai H2p2b bT+2 7Q` 
HQi Q7 i2+?MB[m2b i?i `2 BKTQbbB#H2 BM KQ`2 `B;B/ HM;m;2b- M/ b vQm
rBHH b22 U7Q` 2tKTH2 BM *?Ti2` RyV Bi +M #2 mb2/ iQ Qp2`+QK2 bQK2
Q7 Cpa+`BTiǶb b?Q`i+QKBM;bX 7i2` H2`MBM; i?2 HM;m;2 T`QT2`Hv M/
rQ`FBM; rBi? Bi 7Q`  r?BH2- A ?p2 H2`M2/ iQ +imHHv HBF2 Cpa+`BTiX
h?2`2 ?p2 #22M b2p2`H p2`bBQMb Q7 Cpa+`BTiX 1*Ja+`BTi p2`bBQM
j rb i?2 rB/2Hv bmTTQ`i2/ p2`bBQM BM i?2 iBK2 Q7 Cpa+`BTiǶb b+2Mi
iQ /QKBMM+2- `Qm;?Hv #2ir22M kyyy M/ kyRyX .m`BM; i?Bb iBK2- rQ`F

d
rb mM/2`rv QM M K#BiBQmb p2`bBQM 9- r?B+? THMM2/  MmK#2` Q7
`/B+H BKT`Qp2K2Mib M/ 2ti2MbBQMb iQ i?2 HM;m;2X *?M;BM;  HBpBM;-
rB/2Hv mb2/ HM;m;2 BM bm+?  `/B+H rv im`M2/ Qmi iQ #2 TQHBiB+HHv
/B{+mHi- M/ rQ`F QM i?2 p2`bBQM 9 rb #M/QM2/ BM kyy3- H2/BM; iQ
i?2 Km+? H2bb K#BiBQmb p2`bBQM 8 +QKBM; Qmi BM kyyNX q2Ƕ`2 MQr i i?2
TQBMi r?2`2 HH KDQ` #`Qrb2`b bmTTQ`i p2`bBQM 8- r?B+? Bb i?2 HM;m;2
p2`bBQM i?i i?Bb #QQF rBHH #2 7Q+mbBM; QMX  p2`bBQM e Bb BM i?2 T`Q+2bb Q7
#2BM; }MHBx2/- M/ bQK2 #`Qrb2`b `2 bi`iBM; iQ bmTTQ`i M2r 72im`2b
7`QK i?Bb p2`bBQMX
q2# #`Qrb2`b `2 MQi i?2 QMHv THi7Q`Kb QM r?B+? Cpa+`BTi Bb mb2/X
aQK2 /i#b2b- bm+? b JQM;Q." M/ *Qm+?."- mb2 Cpa+`BTi b
i?2B` b+`BTiBM; M/ [m2`v HM;m;2X a2p2`H THi7Q`Kb 7Q` /2bFiQT M/
b2`p2` T`Q;`KKBM;- KQbi MQi#Hv i?2 LQ/2XDb T`QD2+i Ui?2 bm#D2+i Q7
*?Ti2` kyV `2 T`QpB/BM;  TQr2`7mH 2MpB`QMK2Mi 7Q` T`Q;`KKBM;
Cpa+`BTi QmibB/2 Q7 i?2 #`Qrb2`X

*Q/2- M/ r?i iQ /Q rBi? Bi


*Q/2 Bb i?2 i2ti i?i KF2b mT T`Q;`KbX JQbi +?Ti2`b BM i?Bb #QQF
+QMiBM [mBi2  HQi Q7 BiX AM Kv 2tT2`B2M+2- `2/BM; +Q/2 M/ r`BiBM; +Q/2
`2 BM/BbT2Mb#H2 T`ib Q7 H2`MBM; iQ T`Q;`K- bQ i`v iQ MQi Dmbi ;HM+2
Qp2` i?2 2tKTH2bX _2/ i?2K ii2MiBp2Hv M/ mM/2`biM/ i?2KX h?Bb
Kv #2 bHQr M/ +QM7mbBM; i }`bi- #mi A T`QKBb2 i?i vQm rBHH [mB+FHv
;2i i?2 ?M; Q7 BiX h?2 bK2 ;Q2b 7Q` i?2 2t2`+Bb2bX .QMǶi bbmK2 vQm
mM/2`biM/ i?2K mMiBH vQmǶp2 +imHHv r`Bii2M  rQ`FBM; bQHmiBQMX
A `2+QKK2M/ vQm i`v vQm` bQHmiBQMb iQ 2t2`+Bb2b BM M +imH Cpa+`BTi
BMi2`T`2i2`X h?i rv- vQmǶHH ;2i BKK2/Bi2 722/#+F QM r?2i?2` r?i
vQm `2 /QBM; Bb rQ`FBM;- M/- A ?QT2- vQmǶHH #2 i2KTi2/ iQ 2tT2`BK2Mi
M/ ;Q #2vQM/ i?2 2t2`+Bb2bX
h?2 2bB2bi rv iQ `mM i?2 2tKTH2 +Q/2 BM i?2 #QQF- M/ iQ 2t@
T2`BK2Mi rBi? Bi- Bb iQ HQQF Bi mT BM i?2 QMHBM2 p2`bBQM Q7 i?2 #QQF i
2HQ[m2MiDpb+`BTiXM2iX h?2`2- vQm +M +HB+F Mv +Q/2 2tKTH2 iQ 2/Bi
M/ `mM Bi M/ iQ b22 i?2 QmiTmi Bi T`Q/m+2bX hQ rQ`F QM i?2 2t2`+Bb2b-
;Q iQ 2HQ[m2MiDpb+`BTiXM2if+Q/2- r?B+? T`QpB/2b bi`iBM; +Q/2 7Q` 2+?
+Q/BM; 2t2`+Bb2 M/ HHQrb vQm iQ HQQF i i?2 bQHmiBQMbX
A7 vQm rMi iQ `mM i?2 T`Q;`Kb /2}M2/ BM i?Bb #QQF QmibB/2 Q7 i?2

3
#QQFǶb bM/#Qt- bQK2 +`2 Bb `2[mB`2/X JMv 2tKTH2b biM/ QM i?2B`
QrM M/ b?QmH/ rQ`F BM Mv Cpa+`BTi 2MpB`QMK2MiX "mi +Q/2 BM Hi2`
+?Ti2`b Bb KQbiHv r`Bii2M 7Q`  bT2+B}+ 2MpB`QMK2Mi Ui?2 #`Qrb2` Q`
LQ/2XDbV M/ +M `mM QMHv i?2`2X AM //BiBQM- KMv +?Ti2`b /2}M2
#B;;2` T`Q;`Kb- M/ i?2 TB2+2b Q7 +Q/2 i?i TT2` BM i?2K /2T2M/ QM
2+? Qi?2` Q` QM 2ti2`MH }H2bX h?2 bM/#Qt QM i?2 r2#bBi2 T`QpB/2b
HBMFb iQ wBT }H2b +QMiBMBM; HH Q7 i?2 b+`BTib M/ /i }H2b M2+2bb`v iQ
`mM i?2 +Q/2 7Q`  ;Bp2M +?Ti2`X

Pp2`pB2r Q7 i?Bb #QQF


h?Bb #QQF +QMiBMb `Qm;?Hv i?`22 T`ibX h?2 }`bi RR +?Ti2`b /Bb+mbb
i?2 Cpa+`BTi HM;m;2 Bib2H7X h?2 M2ti 2B;?i +?Ti2`b `2 #Qmi r2#
#`Qrb2`b M/ i?2 rv Cpa+`BTi Bb mb2/ iQ T`Q;`K i?2KX 6BMHHv-
irQ +?Ti2`b `2 /2pQi2/ iQ LQ/2XDb- MQi?2` 2MpB`QMK2Mi iQ T`Q;`K
Cpa+`BTi BMX
h?`Qm;?Qmi i?2 #QQF- i?2`2 `2 }p2 T`QD2+i +?Ti2`b- r?B+? /2b+`B#2
H`;2` 2tKTH2 T`Q;`Kb iQ ;Bp2 vQm  ibi2 Q7 `2H T`Q;`KKBM;X AM
Q`/2` Q7 TT2`M+2- r2 rBHH rQ`F i?`Qm;? #mBH/BM; M `iB}+BH HB72 bBK@
mHiBQM-  T`Q;`KKBM; HM;m;2-  THi7Q`K ;K2-  TBMi T`Q;`K-
M/  /vMKB+ r2#bBi2X
h?2 HM;m;2 T`i Q7 i?2 #QQF bi`ib rBi? 7Qm` +?Ti2`b iQ BMi`Q/m+2
i?2 #bB+ bi`m+im`2 Q7 i?2 Cpa+`BTi HM;m;2X h?2v BMi`Q/m+2 +QMi`QH
bi`m+im`2b Ubm+? b i?2 while rQ`/ vQm br BM i?Bb BMi`Q/m+iBQMV- 7mM+iBQMb
Ur`BiBM; vQm` QrM QT2`iBQMbV- M/ /i bi`m+im`2bX 7i2` i?2b2- vQm
rBHH #2 #H2 iQ r`Bi2 bBKTH2 T`Q;`KbX L2ti- *?Ti2`b 8 M/ e BMi`Q/m+2
i2+?MB[m2b iQ mb2 7mM+iBQMb M/ Q#D2+ib iQ r`Bi2 KQ`2 #bi`+i +Q/2 M/
i?mb F22T +QKTH2tBiv mM/2` +QMi`QHX
7i2`  }`bi T`QD2+i +?Ti2`- i?2 }`bi T`i Q7 i?2 #QQF +QMiBMm2b rBi?
+?Ti2`b QM 2``Q` ?M/HBM; M/ }tBM;- QM `2;mH` 2tT`2bbBQMb UM BK@
TQ`iMi iQQH 7Q` rQ`FBM; rBi? i2ti /iV- M/ QM KQ/mH`BivěMQi?2`
r2TQM ;BMbi +QKTH2tBivX h?2 b2+QM/ T`QD2+i +?Ti2` +QM+Hm/2b i?2
}`bi T`i Q7 i?2 #QQFX
h?2 b2+QM/ T`i- *?Ti2`b Rk iQ RN- /2b+`B#2b i?2 iQQHb i?i #`Qrb2`
Cpa+`BTi ?b ++2bb iQX uQmǶHH H2`M iQ /BbTHv i?BM;b QM i?2 b+`22M
U*?Ti2`b Rj M/ ReV- `2bTQM/ iQ mb2` BMTmi U*?Ti2`b R9 M/ R3V- M/

N
+QKKmMB+i2 Qp2` i?2 M2irQ`F U*?Ti2` RdVX h?2`2 `2 ;BM irQ T`QD2+i
+?Ti2`b BM i?Bb T`iX
7i2` i?i- *?Ti2` ky /2b+`B#2b LQ/2XDb- M/ *?Ti2` kR #mBH/b 
bBKTH2 r2# bvbi2K mbBM; i?i iQQHX

hvTQ;`T?B+ +QMp2MiBQMb
AM i?Bb #QQF- i2ti r`Bii2M BM  monospaced 7QMi rBHH `2T`2b2Mi 2H2K2Mib Q7
T`Q;`KběbQK2iBK2b i?2v `2 b2H7@bm{+B2Mi 7`;K2Mib- M/ bQK2iBK2b
i?2v Dmbi `272` iQ T`i Q7  M2`#v T`Q;`KX S`Q;`Kb UQ7 r?B+? vQm
?p2 H`2/v b22M  72rV- `2 r`Bii2M b 7QHHQrb,
function fac ( n ) {
if ( n == 0)
return 1;
else
return fac ( n - 1) * n;
}

aQK2iBK2b- BM Q`/2` iQ b?Qr i?2 QmiTmi i?i  T`Q;`K T`Q/m+2b- i?2


2tT2+i2/ QmiTmi Bb r`Bii2M 7i2` Bi- rBi? irQ bHb?2b M/ M ``Qr BM
7`QMiX
console . log ( fac (8) ) ;
// → 40320

:QQ/ Hm+F5

Ry
dz"2HQr i?2 bm`7+2 Q7 i?2 K+?BM2- i?2 T`Q;`K KQp2bX
qBi?Qmi 2zQ`i- Bi 2tTM/b M/ +QMi`+ibX AM ;`2i ?`KQMv-
2H2+i`QMb b+ii2` M/ `2;`QmTX h?2 7Q`Kb QM i?2 KQMBiQ` `2
#mi `BTTH2b QM i?2 ri2`X h?2 2bb2M+2 bivb BMpBbB#Hv #2HQrXǴ
ěJbi2` umM@J- h?2 "QQF Q7 S`Q;`KKBM;

R oHm2b- hvT2b- M/ PT2`iQ`b


AMbB/2 i?2 +QKTmi2`Ƕb rQ`H/- i?2`2 Bb QMHv /iX uQm +M `2/ /i-
KQ/B7v /i- +`2i2 M2r /iě#mi Mvi?BM; i?i BbMǶi /i bBKTHv /Q2b
MQi 2tBbiX HH i?Bb /i Bb biQ`2/ b HQM; b2[m2M+2b Q7 #Bib M/ Bb i?mb
7mM/K2MiHHv HBF2X
"Bib `2 Mv FBM/ Q7 irQ@pHm2/ i?BM;b- mbmHHv /2b+`B#2/ b x2`Qb M/
QM2bX AMbB/2 i?2 +QKTmi2`- i?2v iF2 7Q`Kb bm+? b  ?B;? Q` HQr 2H2+i`B+H
+?`;2-  bi`QM; Q` r2F bB;MH- Q`  b?BMv Q` /mHH bTQi QM i?2 bm`7+2 Q7
 *.X Mv TB2+2 Q7 /Bb+`2i2 BM7Q`KiBQM +M #2 `2/m+2/ iQ  b2[m2M+2 Q7
x2`Qb M/ QM2b M/ i?mb `2T`2b2Mi2/ BM #BibX
6Q` 2tKTH2- i?BMF #Qmi ?Qr vQm KB;?i b?Qr i?2 MmK#2` Rj BM #BibX
Ai rQ`Fb i?2 bK2 rv vQm r`Bi2 /2+BKH MmK#2`b- #mi BMbi2/ Q7 Ry
/Bz2`2Mi /B;Bib- vQm ?p2 QMHv k- M/ i?2 r2B;?i Q7 2+? BM+`2b2b #v 
7+iQ` Q7 k 7`QK `B;?i iQ H27iX >2`2 `2 i?2 #Bib i?i KF2 mT i?2 MmK#2`
Rj- rBi? i?2 r2B;?ib Q7 i?2 /B;Bib b?QrM #2HQr i?2K,
0 0 0 0 1 1 0 1
128 64 32 16 8 4 2 1

aQ i?iǶb i?2 #BM`v MmK#2` yyyyRRyR- Q` 3 Y 9 Y R- r?B+? 2[mHb RjX

oHm2b
AK;BM2  b2 Q7 #BibX M Q+2M Q7 i?2KX  ivTB+H KQ/2`M +QKTmi2`
?b KQ`2 i?M jy #BHHBQM #Bib BM Bib pQHiBH2 /i biQ`;2X LQMpQHiBH2
biQ`;2 Ui?2 ?`/ /BbF Q` 2[mBpH2MiV i2M/b iQ ?p2 v2i  72r Q`/2`b Q7
K;MBim/2 KQ`2X

RR
hQ #2 #H2 iQ rQ`F rBi? bm+? [mMiBiB2b Q7 #Bib rBi?Qmi ;2iiBM; HQbi- vQm
+M b2T`i2 i?2K BMiQ +?mMFb i?i `2T`2b2Mi TB2+2b Q7 BM7Q`KiBQMX AM
 Cpa+`BTi 2MpB`QMK2Mi- i?Qb2 +?mMFb `2 +HH2/ pHm2bX h?Qm;? HH
pHm2b `2 K/2 Q7 #Bib- i?2v THv /Bz2`2Mi `QH2bX 1p2`v pHm2 ?b  ivT2
i?i /2i2`KBM2b Bib `QH2X h?2`2 `2 bBt #bB+ ivT2b Q7 pHm2b BM Cpa+`BTi,
MmK#2`b- bi`BM;b- "QQH2Mb- Q#D2+ib- 7mM+iBQMb- M/ mM/2}M2/ pHm2bX
hQ +`2i2  pHm2- vQm Kmbi K2`2Hv BMpQF2 Bib MK2X h?Bb Bb +QMp2MB2MiX
uQm /QMǶi ?p2 iQ ;i?2` #mBH/BM; Ki2`BH 7Q` vQm` pHm2b Q` Tv 7Q`
i?2KX uQm Dmbi +HH 7Q` QM2- M/ rQQb?- vQm ?p2 BiX h?2v `2 MQi +`2i2/
7`QK i?BM B`- Q7 +Qm`b2X 1p2`v pHm2 ?b iQ #2 biQ`2/ bQK2r?2`2- M/ B7
vQm rMi iQ mb2  ;B;MiB+ KQmMi Q7 i?2K i i?2 bK2 iBK2- vQm KB;?i
`mM Qmi Q7 #BibX 6Q`imMi2Hv- i?Bb Bb  T`Q#H2K QMHv B7 vQm M22/ i?2K HH
bBKmHiM2QmbHvX b bQQM b vQm MQ HQM;2` mb2  pHm2- Bi rBHH /BbbBTi2-
H2pBM; #2?BM/ Bib #Bib iQ #2 `2+v+H2/ b #mBH/BM; Ki2`BH 7Q` i?2 M2ti
;2M2`iBQM Q7 pHm2bX
h?Bb +?Ti2` BMi`Q/m+2b i?2 iQKB+ 2H2K2Mib Q7 Cpa+`BTi T`Q;`Kb-
i?i Bb- i?2 bBKTH2 pHm2 ivT2b M/ i?2 QT2`iQ`b i?i +M +i QM bm+?
pHm2bX

LmK#2`b
oHm2b Q7 i?2 MmK#2` ivT2 `2- mMbm`T`BbBM;Hv- MmK2`B+ pHm2bX AM 
Cpa+`BTi T`Q;`K- i?2v `2 r`Bii2M b 7QHHQrb,
13

lb2 i?i BM  T`Q;`K- M/ Bi rBHH +mb2 i?2 #Bi Tii2`M 7Q` i?2 MmK#2`
Rj iQ +QK2 BMiQ 2tBbi2M+2 BMbB/2 i?2 +QKTmi2`Ƕb K2KQ`vX

Rk
Cpa+`BTi mb2b  }t2/ MmK#2` Q7 #Bib- MK2Hv e9 Q7 i?2K- iQ biQ`2
 bBM;H2 MmK#2` pHm2X h?2`2 `2 QMHv bQ KMv Tii2`Mb vQm +M KF2
rBi? e9 #Bib- r?B+? K2Mb i?i i?2 KQmMi Q7 /Bz2`2Mi MmK#2`b i?i +M
#2 `2T`2b2Mi2/ Bb HBKBi2/X 6Q` L /2+BKH /B;Bib- i?2 KQmMi Q7 MmK#2`b
i?i +M #2 `2T`2b2Mi2/ Bb RyL X aBKBH`Hv- ;Bp2M e9 #BM`v /B;Bib- vQm
+M `2T`2b2Mi ke9 /Bz2`2Mi MmK#2`b- r?B+? Bb #Qmi R3 [mBMiBHHBQM UM R3
rBi? R3 x2`Qb 7i2` BiVX h?Bb Bb  HQiX
*QKTmi2` K2KQ`v mb2/ iQ #2  HQi bKHH2`- M/ T2QTH2 i2M/2/ iQ
mb2 ;`QmTb Q7 3 Q` Re #Bib iQ `2T`2b2Mi i?2B` MmK#2`bX Ai rb 2bv iQ
++B/2MiHHv Qp2`~Qr bm+? bKHH MmK#2`běiQ 2M/ mT rBi?  MmK#2`
i?i /B/ MQi }i BMiQ i?2 ;Bp2M KQmMi Q7 #BibX hQ/v- 2p2M T2`bQMH
+QKTmi2`b ?p2 TH2Miv Q7 K2KQ`v- bQ vQm `2 7`22 iQ mb2 e9@#Bi +?mMFb-
r?B+? K2Mb vQm M22/ iQ rQ``v #Qmi Qp2`~Qr QMHv r?2M /2HBM; rBi?
i`mHv bi`QMQKB+H MmK#2`bX
LQi HH r?QH2 MmK#2`b #2HQr R3 [mBMiBHHBQM }i BM  Cpa+`BTi MmK#2`-
i?Qm;?X h?Qb2 #Bib HbQ biQ`2 M2;iBp2 MmK#2`b- bQ QM2 #Bi BM/B+i2b
i?2 bB;M Q7 i?2 MmK#2`X  #B;;2` Bbbm2 Bb i?i MQMr?QH2 MmK#2`b Kmbi
HbQ #2 `2T`2b2Mi2/X hQ /Q i?Bb- bQK2 Q7 i?2 #Bib `2 mb2/ iQ biQ`2 i?2
TQbBiBQM Q7 i?2 /2+BKH TQBMiX h?2 +imH KtBKmK r?QH2 MmK#2` i?i
+M #2 biQ`2/ Bb KQ`2 BM i?2 `M;2 Q7 N [m/`BHHBQM UR8 x2`QbV- r?B+? Bb
biBHH TH2bMiHv ?m;2X
6`+iBQMH MmK#2`b `2 r`Bii2M #v mbBM;  /QiX
9.81

6Q` p2`v #B; Q` p2`v bKHH MmK#2`b- vQm +M HbQ mb2 b+B2MiB}+ MQiiBQM #v
//BM; M dz2Ǵ U7Q` dz2tTQM2MiǴV- 7QHHQr2/ #v i?2 2tTQM2Mi Q7 i?2 MmK#2`,
2.998 e8

h?i Bb kXNN3 × Ry3 4 kNN-3yy-yyyX


*H+mHiBQMb rBi? r?QH2 MmK#2`b UHbQ +HH2/ BMi2;2`bV bKHH2` i?M
i?2 7Q`2K2MiBQM2/ N [m/`BHHBQM `2 ;m`Mi22/ iQ Hrvb #2 T`2+Bb2X
lM7Q`imMi2Hv- +H+mHiBQMb rBi? 7`+iBQMH MmK#2`b `2 ;2M2`HHv MQiX
Cmbi b π UTBV +MMQi #2 T`2+Bb2Hv 2tT`2bb2/ #v  }MBi2 MmK#2` Q7 /2+BKH
/B;Bib- KMv MmK#2`b HQb2 bQK2 T`2+BbBQM r?2M QMHv e9 #Bib `2 pBH#H2
iQ biQ`2 i?2KX h?Bb Bb  b?K2- #mi Bi +mb2b T`+iB+H T`Q#H2Kb QMHv BM
bT2+B}+ bBimiBQMbX h?2 BKTQ`iMi i?BM; Bb iQ #2 r`2 Q7 Bi M/ i`2i

Rj
7`+iBQMH /B;BiH MmK#2`b b TT`QtBKiBQMb- MQi b T`2+Bb2 pHm2bX

`Bi?K2iB+
h?2 KBM i?BM; iQ /Q rBi? MmK#2`b Bb `Bi?K2iB+X `Bi?K2iB+ QT2`iBQMb
bm+? b //BiBQM Q` KmHiBTHB+iBQM iF2 irQ MmK#2` pHm2b M/ T`Q/m+2
 M2r MmK#2` 7`QK i?2KX >2`2 Bb r?i i?2v HQQF HBF2 BM Cpa+`BTi,
100 + 4 * 11

h?2 + M/ * bvK#QHb `2 +HH2/ QT2`iQ`bX h?2 }`bi biM/b 7Q` //BiBQM-
M/ i?2 b2+QM/ biM/b 7Q` KmHiBTHB+iBQMX SmiiBM; M QT2`iQ` #2ir22M
irQ pHm2b rBHH TTHv Bi iQ i?Qb2 pHm2b M/ T`Q/m+2  M2r pHm2X
.Q2b i?2 2tKTH2 K2M dz// 9 M/ Ryy- M/ KmHiBTHv i?2 `2bmHi #v
RRǴ- Q` Bb i?2 KmHiBTHB+iBQM /QM2 #27Q`2 i?2 //BM;\ b vQm KB;?i ?p2
;m2bb2/- i?2 KmHiBTHB+iBQM ?TT2Mb }`biX "mi b BM Ki?2KiB+b- vQm
+M +?M;2 i?Bb #v r`TTBM; i?2 //BiBQM BM T`2Mi?2b2bX
(100 + 4) * 11

6Q` bm#i`+iBQM- i?2`2 Bb i?2 - QT2`iQ`- M/ /BpBbBQM +M #2 /QM2 rBi?
i?2 / QT2`iQ`X
q?2M QT2`iQ`b TT2` iQ;2i?2` rBi?Qmi T`2Mi?2b2b- i?2 Q`/2` BM
r?B+? i?2v `2 TTHB2/ Bb /2i2`KBM2/ #v i?2 T`2+2/2M+2 Q7 i?2 QT2`iQ`bX
h?2 2tKTH2 b?Qrb i?i KmHiBTHB+iBQM +QK2b #27Q`2 //BiBQMX h?2 /
QT2`iQ` ?b i?2 bK2 T`2+2/2M+2 b *X GBF2rBb2 7Q` + M/ -X q?2M
KmHiBTH2 QT2`iQ`b rBi? i?2 bK2 T`2+2/2M+2 TT2` M2ti iQ 2+? Qi?2`-
b BM 1 - 2 + 1- i?2v `2 TTHB2/ H27i iQ `B;?i, (1 - 2)+ 1X
h?2b2 `mH2b Q7 T`2+2/2M+2 `2 MQi bQK2i?BM; vQm b?QmH/ rQ``v #QmiX
q?2M BM /Qm#i- Dmbi // T`2Mi?2b2bX
h?2`2 Bb QM2 KQ`2 `Bi?K2iB+ QT2`iQ`- r?B+? vQm KB;?i MQi BKK2/B@
i2Hv `2+Q;MBx2X h?2 % bvK#QH Bb mb2/ iQ `2T`2b2Mi i?2 `2KBM/2` QT2`@
iBQMX X % Y Bb i?2 `2KBM/2` Q7 /BpB/BM; X #v YX 6Q` 2tKTH2- 314 % 100
T`Q/m+2b 14- M/ 144 % 12 ;Bp2b 0X _2KBM/2`Ƕb T`2+2/2M+2 Bb i?2 bK2 b
i?i Q7 KmHiBTHB+iBQM M/ /BpBbBQMX uQmǶHH Q7i2M b22 i?Bb QT2`iQ` `272``2/
iQ b KQ/mHQ- i?Qm;? i2+?MB+HHv `2KBM/2` Bb KQ`2 ++m`i2X

R9
aT2+BH MmK#2`b
h?2`2 `2 i?`22 bT2+BH pHm2b BM Cpa+`BTi i?i `2 +QMbB/2`2/ MmK#2`b
#mi /QMǶi #2?p2 HBF2 MQ`KH MmK#2`bX
h?2 }`bi irQ `2 Infinity M/ -Infinity- r?B+? `2T`2b2Mi i?2 TQbBiBp2
M/ M2;iBp2 BM}MBiB2bX Infinity - 1 Bb biBHH Infinity- M/ bQ QMX .QMǶi Tmi
iQQ Km+? i`mbi BM BM}MBiv@#b2/ +QKTmiiBQMX Ai BbMǶi Ki?2KiB+HHv
bQHB/- M/ Bi rBHH [mB+FHv H2/ iQ Qm` M2ti bT2+BH MmK#2`, NaNX
NaN biM/b 7Q` dzMQi  MmK#2`Ǵ- 2p2M i?Qm;? Bi Bb  pHm2 Q7 i?2 MmK#2`
ivT2X uQmǶHH ;2i i?Bb `2bmHi r?2M vQm- 7Q` 2tKTH2- i`v iQ +H+mHi2 0
/ 0 Ux2`Q /BpB/2/ #v x2`QV- Infinity - Infinity- Q` Mv MmK#2` Q7 Qi?2`
MmK2`B+ QT2`iBQMb i?i /QMǶi vB2H/  T`2+Bb2- K2MBM;7mH `2bmHiX

ai`BM;b
h?2 M2ti #bB+ /i ivT2 Bb i?2 bi`BM;X ai`BM;b `2 mb2/ iQ `2T`2b2Mi
i2tiX h?2v `2 r`Bii2M #v 2M+HQbBM; i?2B` +QMi2Mi BM [mQi2bX
" Patch my boat with chewing gum "
Monkeys wave goodbye

"Qi? bBM;H2 M/ /Qm#H2 [mQi2b +M #2 mb2/ iQ K`F bi`BM;b b HQM; b
i?2 [mQi2b i i?2 bi`i M/ i?2 2M/ Q7 i?2 bi`BM; Ki+?X
HKQbi Mvi?BM; +M #2 Tmi #2ir22M [mQi2b- M/ Cpa+`BTi rBHH KF2
 bi`BM; pHm2 Qmi Q7 BiX "mi  72r +?`+i2`b `2 KQ`2 /B{+mHiX uQm +M
BK;BM2 ?Qr TmiiBM; [mQi2b #2ir22M [mQi2b KB;?i #2 ?`/X L2rHBM2b
Ui?2 +?`+i2`b vQm ;2i r?2M vQm T`2bb 1Mi2`V HbQ +MǶi #2 Tmi #2ir22M
[mQi2bX h?2 bi`BM; ?b iQ biv QM  bBM;H2 HBM2X
hQ KF2 Bi TQbbB#H2 iQ BM+Hm/2 bm+? +?`+i2`b BM  bi`BM;- i?2 7QHHQrBM;
MQiiBQM Bb mb2/, r?2M2p2`  #+FbHb? U\V Bb 7QmM/ BMbB/2 [mQi2/ i2ti-
Bi BM/B+i2b i?i i?2 +?`+i2` 7i2` Bi ?b  bT2+BH K2MBM;X h?Bb Bb
+HH2/ 2b+TBM; i?2 +?`+i2`X  [mQi2 i?i Bb T`2+2/2/ #v  #+FbHb?
rBHH MQi 2M/ i?2 bi`BM; #mi #2 T`i Q7 BiX q?2M M n +?`+i2` Q++m`b
7i2`  #+FbHb?- Bi Bb BMi2`T`2i2/ b  M2rHBM2X aBKBH`Hv-  t 7i2` 
#+FbHb? K2Mb  i# +?`+i2`X hF2 i?2 7QHHQrBM; bi`BM;,
" This is the first line \ nAnd this is the second "

h?2 +imH i2ti +QMiBM2/ Bb i?Bb,

R8
This is the first line
And this is the second

h?2`2 `2- Q7 +Qm`b2- bBimiBQMb r?2`2 vQm rMi  #+FbHb? BM  bi`BM;


iQ #2 Dmbi  #+FbHb?- MQi  bT2+BH +Q/2X A7 irQ #+FbHb?2b 7QHHQr 2+?
Qi?2`- i?2v rBHH +QHHTb2 iQ;2i?2`- M/ QMHv QM2 rBHH #2 H27i BM i?2 `2bmHiBM;
bi`BM; pHm2X h?Bb Bb ?Qr i?2 bi`BM; dzA newline character is written like
"\n".Ǵ +M #2 2tT`2bb2/,

"A newline character is written like \"\\ n \"."

ai`BM;b +MMQi #2 /BpB/2/- KmHiBTHB2/- Q` bm#i`+i2/- #mi i?2 + QT2`iQ`


+M #2 mb2/ QM i?2KX Ai /Q2b MQi //- #mi Bi +QM+i2Mi2běBi ;Hm2b irQ
bi`BM;b iQ;2i?2`X h?2 7QHHQrBM; HBM2 rBHH T`Q/m+2 i?2 bi`BM; "concatenate",
" con " + " cat " + " e " + " nate "

h?2`2 `2 KQ`2 rvb Q7 KMBTmHiBM; bi`BM;b- r?B+? r2 rBHH /Bb+mbb r?2M
r2 ;2i iQ K2i?Q/b BM *?Ti2` 9X

lM`v QT2`iQ`b
LQi HH QT2`iQ`b `2 bvK#QHbX aQK2 `2 r`Bii2M b rQ`/bX PM2 2tKTH2
Bb i?2 typeof QT2`iQ`- r?B+? T`Q/m+2b  bi`BM; pHm2 MKBM; i?2 ivT2 Q7
i?2 pHm2 vQm ;Bp2 BiX
console . log ( typeof 4.5)
// → number
console . log ( typeof " x ")
// → string

q2 rBHH mb2 console.log BM 2tKTH2 +Q/2 iQ BM/B+i2 i?i r2 rMi iQ b22


i?2 `2bmHi Q7 2pHmiBM; bQK2i?BM;X q?2M vQm `mM bm+? +Q/2- i?2 pHm2
T`Q/m+2/ b?QmH/ #2 b?QrM QM i?2 b+`22M- i?Qm;? ?Qr Bi TT2`b rBHH
/2T2M/ QM i?2 Cpa+`BTi 2MpB`QMK2Mi vQm mb2 iQ `mM BiX
h?2 Qi?2` QT2`iQ`b r2 br HH QT2`i2/ QM irQ pHm2b- #mi typeof iF2b
QMHv QM2X PT2`iQ`b i?i mb2 irQ pHm2b `2 +HH2/ #BM`v QT2`iQ`b-
r?BH2 i?Qb2 i?i iF2 QM2 `2 +HH2/ mM`v QT2`iQ`bX h?2 KBMmb QT2`iQ`
+M #2 mb2/ #Qi? b  #BM`v QT2`iQ` M/ b  mM`v QT2`iQ`X

Re
console . log ( - (10 - 2) )
// → -8

"QQH2M pHm2b
P7i2M- vQm rBHH M22/  pHm2 i?i bBKTHv /BbiBM;mBb?2b #2ir22M irQ TQb@
bB#BHBiB2b- HBF2 dzv2bǴ M/ dzMQǴ Q` dzQMǴ M/ dzQzǴX 6Q` i?Bb- Cpa+`BTi ?b
 "QQH2M ivT2- r?B+? ?b Dmbi irQ pHm2b, i`m2 M/ 7Hb2 Ur?B+? `2
r`Bii2M bBKTHv b i?Qb2 rQ`/bVX

*QKT`BbQMb
>2`2 Bb QM2 rv iQ T`Q/m+2 "QQH2M pHm2b,
console . log (3 > 2)
// → true
console . log (3 < 2)
// → false

h?2 > M/ < bB;Mb `2 i?2 i`/BiBQMH bvK#QHb 7Q` dzBb ;`2i2` i?MǴ M/
dzBb H2bb i?MǴ- `2bT2+iBp2HvX h?2v `2 #BM`v QT2`iQ`bX TTHvBM; i?2K
`2bmHib BM  "QQH2M pHm2 i?i BM/B+i2b r?2i?2` i?2v ?QH/ i`m2 BM i?Bb
+b2X
ai`BM;b +M #2 +QKT`2/ BM i?2 bK2 rvX
console . log (" Aardvark " < " Zoroaster ")
// → true

h?2 rv bi`BM;b `2 Q`/2`2/ Bb KQ`2 Q` H2bb HT?#2iB+, mTT2`+b2 H2ii2`b
`2 Hrvb dzH2bbǴ i?M HQr2`+b2 QM2b- bQ "Z" < "a" Bb i`m2- M/ MQM@
HT?#2iB+ +?`+i2`b U5- @- M/ bQ QMV `2 HbQ BM+Hm/2/ BM i?2 Q`/2`BM;X
h?2 +imH +QKT`BbQM Bb #b2/ QM i?2 lMB+Q/2 biM/`/X h?Bb biM@
/`/ bbB;Mb  MmK#2` iQ pB`imHHv 2p2`v +?`+i2` vQm rQmH/ 2p2` M22/-
BM+Hm/BM; +?`+i2`b 7`QK :`22F- `#B+- CTM2b2- hKBH- M/ bQ QMX
>pBM; bm+? MmK#2`b Bb mb27mH 7Q` biQ`BM; bi`BM;b BMbB/2  +QKTmi2` #2@
+mb2 Bi KF2b Bi TQbbB#H2 iQ `2T`2b2Mi i?2K b  b2[m2M+2 Q7 MmK#2`bX
q?2M +QKT`BM; bi`BM;b- Cpa+`BTi ;Q2b Qp2` i?2K 7`QK H27i iQ `B;?i-
+QKT`BM; i?2 MmK2`B+ +Q/2b Q7 i?2 +?`+i2`b QM2 #v QM2X

Rd
Pi?2` bBKBH` QT2`iQ`b `2 >= U;`2i2` i?M Q` 2[mH iQV- <= UH2bb i?M
Q` 2[mH iQV- == U2[mH iQV- M/ != UMQi 2[mH iQVX
console . log (" Itchy " != " Scratchy ")
// → true

h?2`2 Bb QMHv QM2 pHm2 BM Cpa+`BTi i?i Bb MQi 2[mH iQ Bib2H7- M/ i?i
Bb NaN- r?B+? biM/b 7Q` dzMQi  MmK#2`ǴX
console . log ( NaN == NaN )
// → false

NaNBb bmTTQb2/ iQ /2MQi2 i?2 `2bmHi Q7  MQMb2MbB+H +QKTmiiBQM- M/ b


bm+?- Bi BbMǶi 2[mH iQ i?2 `2bmHi Q7 Mv Qi?2` MQMb2MbB+H +QKTmiiBQMbX

GQ;B+H QT2`iQ`b
h?2`2 `2 HbQ bQK2 QT2`iBQMb i?i +M #2 TTHB2/ iQ "QQH2M pHm2b
i?2Kb2Hp2bX Cpa+`BTi bmTTQ`ib i?`22 HQ;B+H QT2`iQ`b, M/- Q`- M/
MQiX h?2b2 +M #2 mb2/ iQ dz`2bQMǴ #Qmi "QQH2MbX
h?2 && QT2`iQ` `2T`2b2Mib HQ;B+H M/X Ai Bb  #BM`v QT2`iQ`- M/ Bib
`2bmHi Bb i`m2 QMHv B7 #Qi? i?2 pHm2b ;Bp2M iQ Bi `2 i`m2X
console . log ( true && false )
// → false
console . log ( true && true )
// → true

h?2 || QT2`iQ` /2MQi2b HQ;B+H Q`X Ai T`Q/m+2b i`m2 B7 2Bi?2` Q7 i?2 pHm2b
;Bp2M iQ Bi Bb i`m2X
console . log ( false || true )
// → true
console . log ( false || false )
// → false

LQi Bb r`Bii2M b M 2t+HKiBQM K`F U!VX Ai Bb  mM`v QT2`iQ` i?i


~BTb i?2 pHm2 ;Bp2M iQ Biě!true T`Q/m+2b false M/ !false ;Bp2b trueX
q?2M KBtBM; i?2b2 "QQH2M QT2`iQ`b rBi? `Bi?K2iB+ M/ Qi?2` QT2`@
iQ`b- Bi Bb MQi Hrvb Q#pBQmb r?2M T`2Mi?2b2b `2 M22/2/X AM T`+iB+2-
vQm +M mbmHHv ;2i #v rBi? FMQrBM; i?i Q7 i?2 QT2`iQ`b r2 ?p2 b22M
bQ 7`- || ?b i?2 HQr2bi T`2+2/2M+2- i?2M +QK2b &&- i?2M i?2 +QKT`BbQM

R3
QT2`iQ`b U>- ==- M/ bQ QMV- M/ i?2M i?2 `2biX h?Bb Q`/2` ?b #22M
+?Qb2M bm+? i?i- BM ivTB+H 2tT`2bbBQMb HBF2 i?2 7QHHQrBM; QM2- b 72r
T`2Mi?2b2b b TQbbB#H2 `2 M2+2bb`v,
1 + 1 == 2 && 10 * 10 > 50

h?2 Hbi HQ;B+H QT2`iQ` A rBHH /Bb+mbb Bb MQi mM`v- MQi #BM`v- #mi
i2`M`v- QT2`iBM; QM i?`22 pHm2bX Ai Bb r`Bii2M rBi?  [m2biBQM K`F
M/  +QHQM- HBF2 i?Bb,
console . log ( true ? 1 : 2) ;
// → 1
console . log ( false ? 1 : 2) ;
// → 2

h?Bb QM2 Bb +HH2/ i?2 +QM/BiBQMH QT2`iQ` UQ` bQK2iBK2b Dmbi i2`M`v
QT2`iQ` bBM+2 Bi Bb i?2 QMHv bm+? QT2`iQ` BM i?2 HM;m;2VX h?2 pHm2
QM i?2 H27i Q7 i?2 [m2biBQM K`F dzTB+FbǴ r?B+? Q7 i?2 Qi?2` irQ pHm2b
rBHH +QK2 QmiX q?2M Bi Bb i`m2- i?2 KB//H2 pHm2 Bb +?Qb2M- M/ r?2M Bi
Bb 7Hb2- i?2 pHm2 QM i?2 `B;?i +QK2b QmiX

lM/2}M2/ pHm2b
h?2`2 `2 irQ bT2+BH pHm2b- r`Bii2M null M/ undefined- i?i `2 mb2/ iQ
/2MQi2 i?2 #b2M+2 Q7  K2MBM;7mH pHm2X h?2v `2 i?2Kb2Hp2b pHm2b-
#mi i?2v +``v MQ BM7Q`KiBQMX
JMv QT2`iBQMb BM i?2 HM;m;2 i?i /QMǶi T`Q/m+2  K2MBM;7mH pHm2
UvQmǶHH b22 bQK2 Hi2`V vB2H/ undefined bBKTHv #2+mb2 i?2v ?p2 iQ vB2H/
bQK2 pHm2X
h?2 /Bz2`2M+2 BM K2MBM; #2ir22M undefined M/ null Bb M ++B/2Mi Q7
Cpa+`BTiǶb /2bB;M- M/ Bi /Q2bMǶi Kii2` KQbi Q7 i?2 iBK2X AM i?2 +b2b
r?2`2 vQm +imHHv ?p2 iQ +QM+2`M vQm`b2H7 rBi? i?2b2 pHm2b- A `2+QK@
K2M/ i`2iBM; i?2K b BMi2`+?M;2#H2 UKQ`2 QM i?i BM  KQK2MiVX

miQKiB+ ivT2 +QMp2`bBQM


AM i?2 BMi`Q/m+iBQM- A K2MiBQM2/ i?i Cpa+`BTi ;Q2b Qmi Q7 Bib rv
iQ ++2Ti HKQbi Mv T`Q;`K vQm ;Bp2 Bi- 2p2M T`Q;`Kb i?i /Q Q//

RN
i?BM;bX h?Bb Bb MB+2Hv /2KQMbi`i2/ #v i?2 7QHHQrBM; 2tT`2bbBQMb,
console . log (8 * null )
// → 0
console . log ("5" - 1)
// → 4
console . log ("5" + 1)
// → 51
console . log (" five " * 2)
// → NaN
console . log ( false == 0)
// → true

q?2M M QT2`iQ` Bb TTHB2/ iQ i?2 dzr`QM;Ǵ ivT2 Q7 pHm2- Cpa+`BTi rBHH


[mB2iHv +QMp2`i i?i pHm2 iQ i?2 ivT2 Bi rMib- mbBM;  b2i Q7 `mH2b i?i
Q7i2M `2MǶi r?i vQm rMi Q` 2tT2+iX h?Bb Bb +HH2/ ivT2 +Q2`+BQMX aQ i?2
null BM i?2 }`bi 2tT`2bbBQM #2+QK2b 0- M/ i?2 "5" BM i?2 b2+QM/ 2tT`2bbBQM
#2+QK2b 5 U7`QK bi`BM; iQ MmK#2`VX u2i BM i?2 i?B`/ 2tT`2bbBQM- + i`B2b
bi`BM; +QM+i2MiBQM #27Q`2 MmK2`B+ //BiBQM- bQ i?2 1 Bb +QMp2`i2/ iQ "1"
U7`QK MmK#2` iQ bi`BM;VX
q?2M bQK2i?BM; i?i /Q2bMǶi KT iQ  MmK#2` BM M Q#pBQmb rv
Ubm+? b "five" Q` undefinedV Bb +QMp2`i2/ iQ  MmK#2`- i?2 pHm2 NaN Bb
T`Q/m+2/X 6m`i?2` `Bi?K2iB+ QT2`iBQMb QM NaN F22T T`Q/m+BM; NaN- bQ
B7 vQm }M/ vQm`b2H7 ;2iiBM; QM2 Q7 i?Qb2 BM M mM2tT2+i2/ TH+2- HQQF 7Q`
++B/2MiH ivT2 +QMp2`bBQMbX
q?2M +QKT`BM; pHm2b Q7 i?2 bK2 ivT2 mbBM; ==- i?2 Qmi+QK2 Bb 2bv
iQ T`2/B+i, vQm b?QmH/ ;2i i`m2 r?2M #Qi? pHm2b `2 i?2 bK2- 2t+2Ti BM
i?2 +b2 Q7 NaNX "mi r?2M i?2 ivT2b /Bz2`- Cpa+`BTi mb2b  +QKTHB+i2/
M/ +QM7mbBM; b2i Q7 `mH2b iQ /2i2`KBM2 r?i iQ /QX AM KQbi +b2b- Bi Dmbi
i`B2b iQ +QMp2`i QM2 Q7 i?2 pHm2b iQ i?2 Qi?2` pHm2Ƕb ivT2X >Qr2p2`-
r?2M null Q` undefined Q++m`b QM 2Bi?2` bB/2 Q7 i?2 QT2`iQ`- Bi T`Q/m+2b
i`m2 QMHv B7 #Qi? bB/2b `2 QM2 Q7 null Q` undefinedX
console . log ( null == undefined );
// → true
console . log ( null == 0) ;
// → false

h?i Hbi TB2+2 Q7 #2?pBQ` Bb Q7i2M mb27mHX q?2M vQm rMi iQ i2bi
r?2i?2`  pHm2 ?b  `2H pHm2 BMbi2/ Q7 null Q` undefined- vQm +M

ky
bBKTHv +QKT`2 Bi iQ null rBi? i?2 == UQ` !=V QT2`iQ`X
"mi r?i B7 vQm rMi iQ i2bi r?2i?2` bQK2i?BM; `272`b iQ i?2 T`2+Bb2
pHm2 false\ h?2 `mH2b 7Q` +QMp2`iBM; bi`BM;b M/ MmK#2`b iQ "QQH2M
pHm2b bii2 i?i 0- NaN- M/ i?2 2KTiv bi`BM; U""V +QmMi b false- r?BH2
HH i?2 Qi?2` pHm2b +QmMi b trueX "2+mb2 Q7 i?Bb- 2tT`2bbBQMb HBF2 0
== false M/ "" == false `2 HbQ i`m2X 6Q` +b2b HBF2 i?Bb- r?2`2 vQm /Q
MQi rMi Mv miQKiB+ ivT2 +QMp2`bBQMb iQ ?TT2M- i?2`2 `2 irQ 2ti`
QT2`iQ`b, === M/ !==X h?2 }`bi i2bib r?2i?2`  pHm2 Bb T`2+Bb2Hv 2[mH
iQ i?2 Qi?2`- M/ i?2 b2+QM/ i2bib r?2i?2` Bi Bb MQi T`2+Bb2Hv 2[mHX aQ
"" === false Bb 7Hb2 b 2tT2+i2/X
A `2+QKK2M/ mbBM; i?2 i?`22@+?`+i2` +QKT`BbQM QT2`iQ`b /272M@
bBp2Hv iQ T`2p2Mi mM2tT2+i2/ ivT2 +QMp2`bBQMb 7`QK i`BTTBM; vQm mTX
"mi r?2M vQmǶ`2 +2`iBM i?2 ivT2b QM #Qi? bB/2b rBHH #2 i?2 bK2- i?2`2
Bb MQ T`Q#H2K rBi? mbBM; i?2 b?Q`i2` QT2`iQ`bX

a?Q`i@+B`+mBiBM; Q7 HQ;B+H QT2`iQ`b


h?2 HQ;B+H QT2`iQ`b && M/ || ?M/H2 pHm2b Q7 /Bz2`2Mi ivT2b BM 
T2+mHB` rvX h?2v rBHH +QMp2`i i?2 pHm2 QM i?2B` H27i bB/2 iQ "QQH2M
ivT2 BM Q`/2` iQ /2+B/2 r?i iQ /Q- #mi /2T2M/BM; QM i?2 QT2`iQ` M/
i?2 `2bmHi Q7 i?i +QMp2`bBQM- i?2v `2im`M 2Bi?2` i?2 Q`B;BMH H27i@?M/
pHm2 Q` i?2 `B;?i@?M/ pHm2X
h?2 || QT2`iQ`- 7Q` 2tKTH2- rBHH `2im`M i?2 pHm2 iQ Bib H27i r?2M i?i
+M #2 +QMp2`i2/ iQ i`m2 M/ rBHH `2im`M i?2 pHm2 QM Bib `B;?i Qi?2`rBb2X
h?Bb +QMp2`bBQM rQ`Fb b vQmǶ/ 2tT2+i 7Q` "QQH2M pHm2b M/ b?QmH/ /Q
bQK2i?BM; MHQ;Qmb 7Q` pHm2b Q7 Qi?2` ivT2bX
console . log ( null || " user ")
// → user
console . log (" Karl " || " user ")
// → Karl

h?Bb 7mM+iBQMHBiv HHQrb i?2 || QT2`iQ` iQ #2 mb2/ b  rv iQ 7HH


#+F QM  /27mHi pHm2X A7 vQm ;Bp2 Bi M 2tT`2bbBQM i?i KB;?i T`Q/m+2
M 2KTiv pHm2 QM i?2 H27i- i?2 pHm2 QM i?2 `B;?i rBHH #2 mb2/ b 
`2TH+2K2Mi BM i?i +b2X
h?2 && QT2`iQ` rQ`Fb bBKBH`Hv- #mi i?2 Qi?2` rv `QmM/X q?2M i?2
pHm2 iQ Bib H27i Bb bQK2i?BM; i?i +QMp2`ib iQ 7Hb2- Bi `2im`Mb i?i pHm2-

kR
M/ Qi?2`rBb2 Bi `2im`Mb i?2 pHm2 QM Bib `B;?iX
MQi?2` BKTQ`iMi T`QT2`iv Q7 i?2b2 irQ QT2`iQ`b Bb i?i i?2 2tT`2b@
bBQM iQ i?2B` `B;?i Bb 2pHmi2/ QMHv r?2M M2+2bb`vX AM i?2 +b2 Q7 true
|| X- MQ Kii2` r?i X Bbě2p2M B7 BiǶb M 2tT`2bbBQM i?i /Q2b bQK2i?BM;
i2``B#H2ěi?2 `2bmHi rBHH #2 i`m2- M/ X Bb M2p2` 2pHmi2/X h?2 bK2 ;Q2b
7Q` false && X- r?B+? Bb 7Hb2 M/ rBHH B;MQ`2 XX h?Bb Bb +HH2/ b?Q`i@+B`+mBi
2pHmiBQMX
h?2 +QM/BiBQMH QT2`iQ` rQ`Fb BM  bBKBH` rvX h?2 }`bi 2tT`2bbBQM
Bb Hrvb 2pHmi2/- #mi i?2 b2+QM/ Q` i?B`/ pHm2- i?2 QM2 i?i Bb MQi
TB+F2/- Bb MQiX

amKK`v
q2 HQQF2/ i 7Qm` ivT2b Q7 Cpa+`BTi pHm2b BM i?Bb +?Ti2`, MmK#2`b-
bi`BM;b- "QQH2Mb- M/ mM/2}M2/ pHm2bX
am+? pHm2b `2 +`2i2/ #v ivTBM; BM i?2B` MK2 Utrue- nullV Q` pHm2 U13-
"abc"VX uQm +M +QK#BM2 M/ i`Mb7Q`K pHm2b rBi? QT2`iQ`bX q2 br
#BM`v QT2`iQ`b 7Q` `Bi?K2iB+ U+- -- *- /- M/ %V- bi`BM; +QM+i2MiBQM
U+V- +QKT`BbQM U==- !=- ===- !==- <- >- <=- >=V- M/ HQ;B+ U&&- ||V- b r2HH b
b2p2`H mM`v QT2`iQ`b U- iQ M2;i2  MmK#2`- ! iQ M2;i2 HQ;B+HHv- M/
typeof iQ }M/  pHm2Ƕb ivT2V M/  i2`M`v QT2`iQ` U?,V iQ TB+F QM2 Q7
irQ pHm2b #b2/ QM  i?B`/ pHm2X
h?Bb ;Bp2b vQm 2MQm;? BM7Q`KiBQM iQ mb2 Cpa+`BTi b  TQ+F2i +H@
+mHiQ`- #mi MQi Km+? KQ`2X h?2 M2ti +?Ti2` rBHH bi`i ivBM; i?2b2
2tT`2bbBQMb iQ;2i?2` BMiQ #bB+ T`Q;`KbX

kk
dzM/ Kv ?2`i ;HQrb #`B;?i `2/ mM/2` Kv }HKv- i`MbHm+2Mi
bFBM M/ i?2v ?p2 iQ /KBMBbi2` Ry++ Q7 Cpa+`BTi iQ ;2i K2
iQ +QK2 #+FX UA `2bTQM/ r2HH iQ iQtBMb BM i?2 #HQQ/XV JM-
i?i bimz rBHH FB+F i?2 T2+?2b `B;?i Qmi vQm` ;BHHb5Ǵ
ěnr?v- q?vǶb USQB;MMiV :mB/2 iQ _m#v

k S`Q;`K ai`m+im`2
AM i?Bb +?Ti2`- r2 rBHH bi`i iQ /Q i?BM;b i?i +M +imHHv #2 +HH2/
T`Q;`KKBM;X q2 rBHH 2tTM/ Qm` +QKKM/ Q7 i?2 Cpa+`BTi HM;m;2
#2vQM/ i?2 MQmMb M/ b2Mi2M+2 7`;K2Mib r2Ƕp2 b22M bQ 7`- iQ i?2 TQBMi
r?2`2 r2 +M 2tT`2bb bQK2 K2MBM;7mH T`Qb2X

1tT`2bbBQMb M/ bii2K2Mib


AM *?Ti2` R- r2 K/2 bQK2 pHm2b M/ i?2M TTHB2/ QT2`iQ`b iQ i?2K
iQ ;2i M2r pHm2bX *`2iBM; pHm2b HBF2 i?Bb Bb M 2bb2MiBH T`i Q7 2p2`v
Cpa+`BTi T`Q;`K- #mi Bi Bb QMHv  T`iX
 7`;K2Mi Q7 +Q/2 i?i T`Q/m+2b  pHm2 Bb +HH2/ M 2tT`2bbBQMX 1p@
2`v pHm2 i?i Bb r`Bii2M HBi2`HHv Ubm+? b 22 Q` "psychoanalysis"V Bb M
2tT`2bbBQMX M 2tT`2bbBQM #2ir22M T`2Mi?2b2b Bb HbQ M 2tT`2bbBQM-
b Bb  #BM`v QT2`iQ` TTHB2/ iQ irQ 2tT`2bbBQMb Q`  mM`v QT2`iQ`
TTHB2/ iQ QM2X
h?Bb b?Qrb T`i Q7 i?2 #2miv Q7  HM;m;2@#b2/ BMi2`7+2X 1tT`2b@
bBQMb +M M2bi BM  rv p2`v bBKBH` iQ i?2 rv bm#b2Mi2M+2b BM ?mKM
HM;m;2b `2 M2bi2/ě bm#b2Mi2M+2 +M +QMiBM Bib QrM bm#b2Mi2M+2b-
M/ bQ QMX h?Bb HHQrb mb iQ +QK#BM2 2tT`2bbBQMb iQ 2tT`2bb `#Bi``BHv
+QKTH2t +QKTmiiBQMbX
A7 M 2tT`2bbBQM +Q``2bTQM/b iQ  b2Mi2M+2 7`;K2Mi-  Cpa+`BTi bii2@
K2Mi +Q``2bTQM/b iQ  7mHH b2Mi2M+2 BM  ?mKM HM;m;2X  T`Q;`K Bb
bBKTHv  HBbi Q7 bii2K2MibX
h?2 bBKTH2bi FBM/ Q7 bii2K2Mi Bb M 2tT`2bbBQM rBi?  b2KB+QHQM 7i2`
BiX h?Bb Bb  T`Q;`K,
1;
! false ;

Ai Bb  mb2H2bb T`Q;`K- i?Qm;?X M 2tT`2bbBQM +M #2 +QMi2Mi iQ Dmbi

kj
T`Q/m+2  pHm2- r?B+? +M i?2M #2 mb2/ #v i?2 2M+HQbBM; 2tT`2bbBQMX 
bii2K2Mi biM/b QM Bib QrM M/ KQmMib iQ bQK2i?BM; QMHv B7 Bi z2+ib
i?2 rQ`H/X Ai +QmH/ /BbTHv bQK2i?BM; QM i?2 b+`22Měi?i +QmMib b
+?M;BM; i?2 rQ`H/ěQ` Bi +QmH/ +?M;2 i?2 BMi2`MH bii2 Q7 i?2 K+?BM2
BM  rv i?i rBHH z2+i i?2 bii2K2Mib i?i +QK2 7i2` BiX h?2b2 +?M;2b
`2 +HH2/ bB/2 2z2+ibX h?2 bii2K2Mib BM i?2 T`2pBQmb 2tKTH2 Dmbi
T`Q/m+2 i?2 pHm2b 1 M/ true M/ i?2M BKK2/Bi2Hv i?`Qr i?2K rvX
h?Bb H2p2b MQ BKT`2bbBQM QM i?2 rQ`H/ i HHX q?2M 2t2+miBM; i?2
T`Q;`K- MQi?BM; Q#b2`p#H2 ?TT2MbX
AM bQK2 +b2b- Cpa+`BTi HHQrb vQm iQ QKBi i?2 b2KB+QHQM i i?2 2M/
Q7  bii2K2MiX AM Qi?2` +b2b- Bi ?b iQ #2 i?2`2- Q` i?2 M2ti HBM2 rBHH
#2 i`2i2/ b T`i Q7 i?2 bK2 bii2K2MiX h?2 `mH2b 7Q` r?2M Bi +M
#2 b72Hv QKBii2/ `2 bQK2r?i +QKTH2t M/ 2``Q`@T`QM2X AM i?Bb #QQF-
2p2`v bii2K2Mi i?i M22/b  b2KB+QHQM rBHH Hrvb #2 i2`KBMi2/ #v
QM2X A `2+QKK2M/ vQm /Q i?2 bK2 BM vQm` QrM T`Q;`Kb- i H2bi mMiBH
vQmǶp2 H2`M2/ KQ`2 #Qmi bm#iH2iB2b BMpQHp2/ BM H2pBM; Qmi b2KB+QHQMbX

o`B#H2b
>Qr /Q2b  T`Q;`K F22T M BMi2`MH bii2\ >Qr /Q2b Bi `2K2K#2`
i?BM;b\ q2 ?p2 b22M ?Qr iQ T`Q/m+2 M2r pHm2b 7`QK QH/ pHm2b- #mi
i?Bb /Q2b MQi +?M;2 i?2 QH/ pHm2b- M/ i?2 M2r pHm2 ?b iQ #2 BKK2/B@
i2Hv mb2/ Q` Bi rBHH /BbbBTi2 ;BMX hQ +i+? M/ ?QH/ pHm2b- Cpa+`BTi
T`QpB/2b  i?BM; +HH2/  p`B#H2X
var caught = 5 * 5;

M/ i?i ;Bp2b mb Qm` b2+QM/ FBM/ Q7 bii2K2MiX h?2 bT2+BH rQ`/ UF2v@
rQ`/V var BM/B+i2b i?i i?Bb b2Mi2M+2 Bb ;QBM; iQ /2}M2  p`B#H2X Ai Bb
7QHHQr2/ #v i?2 MK2 Q7 i?2 p`B#H2 M/- B7 r2 rMi iQ BKK2/Bi2Hv ;Bp2
Bi  pHm2- #v M = QT2`iQ` M/ M 2tT`2bbBQMX
h?2 T`2pBQmb bii2K2Mi +`2i2b  p`B#H2 +HH2/ caught M/ mb2b Bi iQ
;`# ?QH/ Q7 i?2 MmK#2` i?i Bb T`Q/m+2/ #v KmHiBTHvBM; 8 #v 8X
7i2`  p`B#H2 ?b #22M /2}M2/- Bib MK2 +M #2 mb2/ b M 2tT`2b@
bBQMX h?2 pHm2 Q7 bm+? M 2tT`2bbBQM Bb i?2 pHm2 i?2 p`B#H2 +m``2MiHv
?QH/bX >2`2Ƕb M 2tKTH2,

k9
var ten = 10;
console . log ( ten * ten ) ;
// → 100

o`B#H2 MK2b +M #2 Mv rQ`/ i?i BbMǶi  `2b2`p2/ rQ`/ Ubm+? b
varVX h?2v Kv MQi BM+Hm/2 bT+2bX .B;Bib +M HbQ #2 T`i Q7 p`B#H2
MK2běcatch22 Bb  pHB/ MK2- 7Q` 2tKTH2ě#mi i?2 MK2 Kmbi MQi
bi`i rBi?  /B;BiX  p`B#H2 MK2 +MMQi BM+Hm/2 TmM+imiBQM- 2t+2Ti
7Q` i?2 +?`+i2`b $ M/ _X
q?2M  p`B#H2 TQBMib i  pHm2- i?i /Q2b MQi K2M Bi Bb iB2/ iQ
i?i pHm2 7Q`2p2`X h?2 = QT2`iQ` +M #2 mb2/ i Mv iBK2 QM 2tBbiBM;
p`B#H2b iQ /Bb+QMM2+i i?2K 7`QK i?2B` +m``2Mi pHm2 M/ ?p2 i?2K
TQBMi iQ  M2r QM2X
var mood = " light ";
console . log ( mood ) ;
// → light
mood = " dark ";
console . log ( mood ) ;
// → dark

uQm b?QmH/ BK;BM2 p`B#H2b b i2Mi+H2b- `i?2` i?M #Qt2bX h?2v /Q


MQi +QMiBM pHm2bc i?2v ;`bT i?2KěirQ p`B#H2b +M `272` iQ i?2 bK2
pHm2X  T`Q;`K +M ++2bb QMHv i?2 pHm2b i?i Bi biBHH ?b  ?QH/ QMX
q?2M vQm M22/ iQ `2K2K#2` bQK2i?BM;- vQm ;`Qr  i2Mi+H2 iQ ?QH/ QM
iQ Bi Q` vQm `2ii+? QM2 Q7 vQm` 2tBbiBM; i2Mi+H2b iQ BiX

k8
G2iǶb HQQF i M 2tKTH2X hQ `2K2K#2` i?2 MmK#2` Q7 /QHH`b i?i GmB;B
biBHH Qr2b vQm- vQm +`2i2  p`B#H2X M/ i?2M r?2M ?2 Tvb #+F 0j8-
vQm ;Bp2 i?Bb p`B#H2  M2r pHm2X
var luigisDebt = 140;
luigisDebt = luigisDebt - 35;
console . log ( luigisDebt ) ;
// → 105

q?2M vQm /2}M2  p`B#H2 rBi?Qmi ;BpBM; Bi  pHm2- i?2 i2Mi+H2 ?b
MQi?BM; iQ ;`bT- bQ Bi 2M/b BM i?BM B`X A7 vQm bF 7Q` i?2 pHm2 Q7 M
2KTiv p`B#H2- vQmǶHH ;2i i?2 pHm2 undefinedX
 bBM;H2 var bii2K2Mi Kv /2}M2 KmHiBTH2 p`B#H2bX h?2 /2}MBiBQMb
Kmbi #2 b2T`i2/ #v +QKKbX
var one = 1 , two = 2;
console . log ( one + two ) ;
// → 3

E2vrQ`/b M/ `2b2`p2/ rQ`/b


qQ`/b rBi?  bT2+BH K2MBM;- bm+? b var- `2 F2vrQ`/b- M/ i?2v Kv
MQi #2 mb2/ b p`B#H2 MK2bX h?2`2 `2 HbQ  MmK#2` Q7 rQ`/b i?i `2
dz`2b2`p2/ 7Q` mb2Ǵ BM 7mim`2 p2`bBQMb Q7 Cpa+`BTiX h?2b2 `2 HbQ Q{@
+BHHv MQi HHQr2/ iQ #2 mb2/ b p`B#H2 MK2b- i?Qm;? bQK2 Cpa+`BTi
2MpB`QMK2Mib /Q HHQr i?2KX h?2 7mHH HBbi Q7 F2vrQ`/b M/ `2b2`p2/
rQ`/b Bb `i?2` HQM;X
break case catch class const continue debugger
default delete do else enum export extends false
finally for function if implements import in
instanceof interface let new null package private
protected public return static super switch this
throw true try typeof var void while with yield

.QMǶi rQ``v #Qmi K2KQ`BxBM; i?2b2- #mi `2K2K#2` i?i i?Bb KB;?i #2
i?2 T`Q#H2K r?2M  p`B#H2 /2}MBiBQM /Q2b MQi rQ`F b 2tT2+i2/X

ke
h?2 2MpB`QMK2Mi
h?2 +QHH2+iBQM Q7 p`B#H2b M/ i?2B` pHm2b i?i 2tBbi i  ;Bp2M iBK2 Bb
+HH2/ i?2 2MpB`QMK2MiX q?2M  T`Q;`K bi`ib mT- i?Bb 2MpB`QMK2Mi Bb
MQi 2KTivX Ai Hrvb +QMiBMb p`B#H2b i?i `2 T`i Q7 i?2 HM;m;2
biM/`/- M/ KQbi Q7 i?2 iBK2- Bi ?b p`B#H2b i?i T`QpB/2 rvb iQ
BMi2`+i rBi? i?2 bm``QmM/BM; bvbi2KX 6Q` 2tKTH2- BM  #`Qrb2`- i?2`2
`2 p`B#H2b M/ 7mM+iBQMb iQ BMbT2+i M/ BM~m2M+2 i?2 +m``2MiHv HQ/2/
r2#bBi2 M/ iQ `2/ KQmb2 M/ F2v#Q`/ BMTmiX

6mM+iBQMb
 HQi Q7 i?2 pHm2b T`QpB/2/ BM i?2 /27mHi 2MpB`QMK2Mi ?p2 i?2 ivT2
7mM+iBQMX  7mM+iBQM Bb  TB2+2 Q7 T`Q;`K r`TT2/ BM  pHm2X am+?
pHm2b +M #2 TTHB2/ BM Q`/2` iQ `mM i?2 r`TT2/ T`Q;`KX 6Q` 2tKTH2-
BM  #`Qrb2` 2MpB`QMK2Mi- i?2 p`B#H2 alert ?QH/b  7mM+iBQM i?i b?Qrb
 HBiiH2 /BHQ; #Qt rBi?  K2bb;2X Ai Bb mb2/ HBF2 i?Bb,
alert (" Good morning !") ;

1t2+miBM;  7mM+iBQM Bb +HH2/ BMpQFBM;- +HHBM;- Q` TTHvBM; BiX uQm +M


+HH  7mM+iBQM #v TmiiBM; T`2Mi?2b2b 7i2` M 2tT`2bbBQM i?i T`Q/m+2b
 7mM+iBQM pHm2X lbmHHv vQmǶHH /B`2+iHv mb2 i?2 MK2 Q7 i?2 p`B#H2
i?i ?QH/b i?2 7mM+iBQMX h?2 pHm2b #2ir22M i?2 T`2Mi?2b2b `2 ;Bp2M
iQ i?2 T`Q;`K BMbB/2 i?2 7mM+iBQMX AM i?2 2tKTH2- i?2 alert 7mM+iBQM
mb2b i?2 bi`BM; i?i r2 ;Bp2 Bi b i?2 i2ti iQ b?Qr BM i?2 /BHQ; #QtX
oHm2b ;Bp2M iQ 7mM+iBQMb `2 +HH2/ `;mK2MibX h?2 alert 7mM+iBQM M22/b
QMHv QM2 Q7 i?2K- #mi Qi?2` 7mM+iBQMb KB;?i M22/  /Bz2`2Mi MmK#2` Q`
/Bz2`2Mi ivT2b Q7 `;mK2MibX

kd
h?2 +QMbQH2XHQ; 7mM+iBQM
h?2 alert 7mM+iBQM +M #2 mb27mH b M QmiTmi /2pB+2 r?2M 2tT2`BK2MiBM;-
#mi +HB+FBM; rv HH i?Qb2 HBiiH2 rBM/Qrb rBHH ;2i QM vQm` M2`p2bX AM Tbi
2tKTH2b- r2Ƕp2 mb2/ console.log iQ QmiTmi pHm2bX JQbi Cpa+`BTi bvb@
i2Kb UBM+Hm/BM; HH KQ/2`M r2# #`Qrb2`b M/ LQ/2XDbV T`QpB/2  console
.log 7mM+iBQM i?i r`Bi2b Qmi Bib `;mK2Mib iQ bQK2 i2ti QmiTmi /2pB+2X
AM #`Qrb2`b- i?2 QmiTmi HM/b BM i?2 Cpa+`BTi +QMbQH2X h?Bb T`i Q7
i?2 #`Qrb2` BMi2`7+2 Bb ?B//2M #v /27mHi- #mi KQbi #`Qrb2`b QT2M Bi
r?2M vQm T`2bb 6Rk Q`- QM J+- r?2M vQm T`2bb *QKKM/@PTiBQM@AX A7
i?i /Q2b MQi rQ`F- b2`+? i?`Qm;? i?2 K2Mmb 7Q` M Bi2K MK2/ dzr2#
+QMbQH2Ǵ Q` dz/2p2HQT2` iQQHbǴX
var x = 30;
console . log (" the value of x is ", x);
// → the value of x is 30

h?Qm;? p`B#H2 MK2b +MMQi +QMiBM T2`BQ/ +?`+i2`b- console.log


+H2`Hv ?b QM2X h?Bb Bb #2+mb2 console.log BbMǶi  bBKTH2 p`B#H2X Ai
Bb +imHHv M 2tT`2bbBQM i?i `2i`B2p2b i?2 log T`QT2`iv 7`QK i?2 pHm2
?2H/ #v i?2 console p`B#H2X q2 rBHH }M/ Qmi 2t+iHv r?i i?Bb K2Mb
BM *?Ti2` 9X

_2im`M pHm2b
a?QrBM;  /BHQ; #Qt Q` r`BiBM; i2ti iQ i?2 b+`22M Bb  bB/2 2z2+iX  HQi Q7
7mM+iBQMb `2 mb27mH #2+mb2 Q7 i?2 bB/2 2z2+ib i?2v T`Q/m+2X 6mM+iBQMb
Kv HbQ T`Q/m+2 pHm2b- M/ BM i?i +b2- i?2v /QMǶi M22/ iQ ?p2  bB/2
2z2+i iQ #2 mb27mHX 6Q` 2tKTH2- i?2 7mM+iBQM Math.max iF2b Mv MmK#2`
Q7 MmK#2` pHm2b M/ ;Bp2b #+F i?2 ;`2i2biX
console . log ( Math . max (2 , 4) );
// → 4

q?2M  7mM+iBQM T`Q/m+2b  pHm2- Bi Bb bB/ iQ `2im`M i?i pHm2X Mv@


i?BM; i?i T`Q/m+2b  pHm2 Bb M 2tT`2bbBQM BM Cpa+`BTi- r?B+? K2Mb
7mM+iBQM +HHb +M #2 mb2/ rBi?BM H`;2` 2tT`2bbBQMbX >2`2  +HH iQ Math
.min- r?B+? Bb i?2 QTTQbBi2 Q7 Math.max- Bb mb2/ b M BMTmi iQ i?2 THmb

k3
QT2`iQ`,
console . log ( Math . min (2 , 4) + 100) ;
// → 102

h?2 M2ti +?Ti2` 2tTHBMb ?Qr iQ r`Bi2 vQm` QrM 7mM+iBQMbX

T`QKTi M/ +QM}`K


"`Qrb2` 2MpB`QMK2Mib +QMiBM Qi?2` 7mM+iBQMb #2bB/2b alert 7Q` TQTTBM;
mT rBM/QrbX uQm +M bF i?2 mb2` M PEf*M+2H [m2biBQM mbBM; confirmX
h?Bb `2im`Mb  "QQH2M, true B7 i?2 mb2` +HB+Fb PE M/ false B7 i?2 mb2`
+HB+Fb *M+2HX
confirm (" Shall we , then ?") ;

h?2 prompt 7mM+iBQM +M #2 mb2/ iQ bF M dzQT2MǴ [m2biBQMX h?2 }`bi
`;mK2Mi Bb i?2 [m2biBQM- i?2 b2+QM/ QM2 Bb i?2 i2ti i?i i?2 mb2` bi`ib
rBi?X  HBM2 Q7 i2ti +M #2 ivT2/ BMiQ i?2 /BHQ; rBM/Qr- M/ i?2 7mM+iBQM
rBHH `2im`M i?Bb i2ti b  bi`BM;X
prompt (" Tell me everything you know ." , "...") ;

h?2b2 irQ 7mM+iBQMb `2MǶi mb2/ Km+? BM KQ/2`M r2# T`Q;`KKBM;-


KQbiHv #2+mb2 vQm ?p2 MQ +QMi`QH Qp2` i?2 rv i?2 `2bmHiBM; rBM/Qrb
HQQF- #mi i?2v `2 mb27mH 7Q` iQv T`Q;`Kb M/ 2tT2`BK2MibX

kN
*QMi`QH ~Qr
q?2M vQm` T`Q;`K +QMiBMb KQ`2 i?M QM2 bii2K2Mi- i?2 bii2K2Mib
`2 2t2+mi2/- T`2/B+i#Hv- 7`QK iQT iQ #QiiQKX b  #bB+ 2tKTH2- i?Bb
T`Q;`K ?b irQ bii2K2MibX h?2 }`bi QM2 bFb i?2 mb2` 7Q`  MmK#2`-
M/ i?2 b2+QM/- r?B+? Bb 2t2+mi2/ 7i2`r`/- b?Qrb i?2 b[m`2 Q7 i?i
MmK#2`X
var theNumber = Number ( prompt (" Pick a number ", "") );
alert (" Your number is the square root of " +
theNumber * theNumber ) ;

h?2 7mM+iBQM Number +QMp2`ib  pHm2 iQ  MmK#2`X q2 M22/ i?i +QMp2`@


bBQM #2+mb2 i?2 `2bmHi Q7 prompt Bb  bi`BM; pHm2- M/ r2 rMi  MmK#2`X
h?2`2 `2 bBKBH` 7mM+iBQMb +HH2/ String M/ Boolean i?i +QMp2`i pHm2b
iQ i?Qb2 ivT2bX
>2`2 Bb i?2 `i?2` i`BpBH b+?2KiB+ `2T`2b2MiiBQM Q7 bi`B;?i +QMi`QH
~Qr,

*QM/BiBQMH 2t2+miBQM
1t2+miBM; bii2K2Mib BM bi`B;?i@HBM2 Q`/2` BbMǶi i?2 QMHv QTiBQM r2 ?p2X
M Hi2`MiBp2 Bb +QM/BiBQMH 2t2+miBQM- r?2`2 r2 +?QQb2 #2ir22M irQ
/Bz2`2Mi `Qmi2b #b2/ QM  "QQH2M pHm2- HBF2 i?Bb,

*QM/BiBQMH 2t2+miBQM Bb r`Bii2M rBi? i?2 if F2vrQ`/ BM Cpa+`BTiX AM


i?2 bBKTH2 +b2- r2 Dmbi rMi bQK2 +Q/2 iQ #2 2t2+mi2/ B7- M/ QMHv B7-
 +2`iBM +QM/BiBQM ?QH/bX 6Q` 2tKTH2- BM i?2 T`2pBQmb T`Q;`K- r2
KB;?i rMi iQ b?Qr i?2 b[m`2 Q7 i?2 BMTmi QMHv B7 i?2 BMTmi Bb +imHHv
 MmK#2`X
var theNumber = Number ( prompt (" Pick a number ", "") );

jy
if (! isNaN ( theNumber ) )
alert (" Your number is the square root of " +
theNumber * theNumber ) ;

qBi? i?Bb KQ/B}+iBQM- B7 vQm 2Mi2` dz+?22b2Ǵ- MQ QmiTmi rBHH #2 b?QrMX


h?2 F2vrQ`/ if 2t2+mi2b Q` bFBTb  bii2K2Mi /2T2M/BM; QM i?2 pHm2
Q7  "QQH2M 2tT`2bbBQMX h?2 /2+B/BM; 2tT`2bbBQM Bb r`Bii2M 7i2` i?2
F2vrQ`/- #2ir22M T`2Mi?2b2b- 7QHHQr2/ #v i?2 bii2K2Mi iQ 2t2+mi2X
h?2 isNaN 7mM+iBQM Bb  biM/`/ Cpa+`BTi 7mM+iBQM i?i `2im`Mb true
QMHv B7 i?2 `;mK2Mi Bi Bb ;Bp2M Bb NaNX h?2 Number 7mM+iBQM ?TT2Mb iQ
`2im`M NaN r?2M vQm ;Bp2 Bi  bi`BM; i?i /Q2bMǶi `2T`2b2Mi  pHB/ MmK#2`X
h?mb- i?2 +QM/BiBQM i`MbHi2b iQ dzmMH2bb theNumber Bb MQi@@MmK#2`- /Q
i?BbǴX
uQm Q7i2M rQMǶi Dmbi ?p2 +Q/2 i?i 2t2+mi2b r?2M  +QM/BiBQM ?QH/b
i`m2- #mi HbQ +Q/2 i?i ?M/H2b i?2 Qi?2` +b2X h?Bb Hi2`Mi2 Ti? Bb
`2T`2b2Mi2/ #v i?2 b2+QM/ ``Qr BM i?2 /B;`KX h?2 else F2vrQ`/ +M
#2 mb2/- iQ;2i?2` rBi? if- iQ +`2i2 irQ b2T`i2- Hi2`MiBp2 2t2+miBQM
Ti?bX
var theNumber = Number ( prompt (" Pick a number ", "") );
if (! isNaN ( theNumber ) )
alert (" Your number is the square root of " +
theNumber * theNumber ) ;
else
alert (" Hey . Why didn t you give me a number ?") ;

A7 r2 ?p2 KQ`2 i?M irQ Ti?b iQ +?QQb2 7`QK- KmHiBTH2 iffelse TB`b
+M #2 dz+?BM2/Ǵ iQ;2i?2`X >2`2Ƕb M 2tKTH2,
var num = Number ( prompt (" Pick a number ", "0") );

if ( num < 10)


alert (" Small ") ;
else if ( num < 100)
alert (" Medium ") ;
else
alert (" Large ") ;

h?2 T`Q;`K rBHH }`bi +?2+F r?2i?2` num Bb H2bb i?M RyX A7 Bi Bb- Bi
+?QQb2b i?i #`M+?- b?Qrb "Small"- M/ Bb /QM2X A7 Bi BbMǶi- Bi iF2b i?2
else #`M+?- r?B+? Bib2H7 +QMiBMb  b2+QM/ ifX A7 i?2 b2+QM/ +QM/BiBQM

jR
U< 100V ?QH/b- i?i K2Mb i?2 MmK#2` Bb #2ir22M Ry M/ Ryy- M/ "Medium"
Bb b?QrMX A7 Bi /Q2bMǶi- i?2 b2+QM/- M/ Hbi- else #`M+? Bb +?Qb2MX
h?2 ~Qr +?`i 7Q` i?Bb T`Q;`K HQQFb bQK2i?BM; HBF2 i?Bb,

r?BH2 M/ /Q HQQTb


*QMbB/2`  T`Q;`K i?i T`BMib HH 2p2M MmK#2`b 7`QK y iQ RkX PM2 rv
iQ r`Bi2 i?Bb Bb b 7QHHQrb,
console . log (0) ;
console . log (2) ;
console . log (4) ;
console . log (6) ;
console . log (8) ;
console . log (10) ;
console . log (12) ;

h?i rQ`Fb- #mi i?2 B/2 Q7 r`BiBM;  T`Q;`K Bb iQ KF2 bQK2i?BM;


H2bb rQ`F- MQi KQ`2X A7 r2 M22/2/ HH 2p2M MmK#2`b H2bb i?M R-yyy- i?2
T`2pBQmb rQmH/ #2 mMrQ`F#H2X q?i r2 M22/ Bb  rv iQ `2T2i bQK2
+Q/2X h?Bb 7Q`K Q7 +QMi`QH ~Qr Bb +HH2/  HQQT,

GQQTBM; +QMi`QH ~Qr HHQrb mb iQ ;Q #+F iQ bQK2 TQBMi BM i?2 T`Q;`K


r?2`2 r2 r2`2 #27Q`2 M/ `2T2i Bi rBi? Qm` +m``2Mi T`Q;`K bii2X A7
r2 +QK#BM2 i?Bb rBi?  p`B#H2 i?i +QmMib- r2 +M /Q bQK2i?BM; HBF2
i?Bb,
var number = 0;
while ( number <= 12) {
console . log ( number ) ;

jk
number = number + 2;
}
// → 0
// → 2
// ... etcetera

 bii2K2Mi bi`iBM; rBi? i?2 F2vrQ`/ while +`2i2b  HQQTX h?2 rQ`/
while Bb 7QHHQr2/ #v M 2tT`2bbBQM BM T`2Mi?2b2b M/ i?2M  bii2K2Mi-
Km+? HBF2 ifX h?2 HQQT 2t2+mi2b i?i bii2K2Mi b HQM; b i?2 2tT`2bbBQM
T`Q/m+2b  pHm2 i?i Bb true r?2M +QMp2`i2/ iQ "QQH2M ivT2X
AM i?Bb HQQT- r2 rMi iQ #Qi? T`BMi i?2 +m``2Mi MmK#2` M/ // irQ iQ
Qm` p`B#H2X q?2M2p2` r2 M22/ iQ 2t2+mi2 KmHiBTH2 bii2K2Mib BMbB/2 
HQQT- r2 r`T i?2K BM +m`Hv #`+2b U{ M/ }VX "`+2b /Q 7Q` bii2K2Mib
r?i T`2Mi?2b2b /Q 7Q` 2tT`2bbBQMb, i?2v ;`QmT i?2K iQ;2i?2`- KFBM;
i?2K +QmMi b  bBM;H2 bii2K2MiX  b2[m2M+2 Q7 bii2K2Mib r`TT2/ BM
#`+2b Bb +HH2/  #HQ+FX
JMv Cpa+`BTi T`Q;`KK2`b r`T 2p2`v bBM;H2 HQQT Q` if #Q/v BM
#`+2bX h?2v /Q i?Bb #Qi? 7Q` i?2 bF2 Q7 +QMbBbi2M+v M/ iQ pQB/
?pBM; iQ // Q` `2KQp2 #`+2b r?2M +?M;BM; i?2 MmK#2` Q7 bii2K2Mib
BM i?2 #Q/v Hi2`X AM i?Bb #QQF- A rBHH r`Bi2 KQbi bBM;H2@bii2K2Mi #Q/B2b
rBi?Qmi #`+2b- bBM+2 A pHm2 #`2pBivX uQm `2 7`22 iQ ;Q rBi? r?B+?2p2`
bivH2 vQm T`272`X
h?2 p`B#H2 number /2KQMbi`i2b i?2 rv  p`B#H2 +M i`+F i?2
T`Q;`2bb Q7  T`Q;`KX 1p2`v iBK2 i?2 HQQT `2T2ib- number Bb BM+`2@
K2Mi2/ #v 2X h?2M- i i?2 #2;BMMBM; Q7 2p2`v `2T2iBiBQM- Bi Bb +QKT`2/
rBi? i?2 MmK#2` 12 iQ /2+B/2 r?2i?2` i?2 T`Q;`K ?b /QM2 HH i?2 rQ`F
Bi BMi2M/2/ iQ /QX
b M 2tKTH2 i?i +imHHv /Q2b bQK2i?BM; mb27mH- r2 +M MQr r`Bi2 
T`Q;`K i?i +H+mHi2b M/ b?Qrb i?2 pHm2 Q7 kRy Uk iQ i?2 Ryi? TQr2`VX
q2 mb2 irQ p`B#H2b, QM2 iQ F22T i`+F Q7 Qm` `2bmHi M/ QM2 iQ +QmMi
?Qr Q7i2M r2 ?p2 KmHiBTHB2/ i?Bb `2bmHi #v kX h?2 HQQT i2bib r?2i?2`
i?2 b2+QM/ p`B#H2 ?b `2+?2/ Ry v2i M/ i?2M mT/i2b #Qi? p`B#H2bX
var result = 1;
var counter = 0;
while ( counter < 10) {
result = result * 2;
counter = counter + 1;
}

jj
console . log ( result ) ;
// → 1024

h?2 +QmMi2` +QmH/ HbQ bi`i i 1 M/ +?2+F 7Q` <= 10- #mi- 7Q` `2bQMb
i?i rBHH #2+QK2 TT`2Mi BM *?Ti2` 9- Bi Bb  ;QQ/ B/2 iQ ;2i mb2/ iQ
+QmMiBM; 7`QK yX
h?2 do HQQT Bb  +QMi`QH bi`m+im`2 bBKBH` iQ i?2 while HQQTX Ai /Bz2`b
QMHv QM QM2 TQBMi,  do HQQT Hrvb 2t2+mi2b Bib #Q/v i H2bi QM+2- M/
Bi bi`ib i2biBM; r?2i?2` Bi b?QmH/ biQT QMHv 7i2` i?i }`bi 2t2+miBQMX
hQ `2~2+i i?Bb- i?2 i2bi TT2`b 7i2` i?2 #Q/v Q7 i?2 HQQT,
do {
var yourName = prompt (" Who are you ?") ;
} while (! yourName ) ;
console . log ( yourName ) ;

h?Bb T`Q;`K rBHH 7Q`+2 vQm iQ 2Mi2`  MK2X Ai rBHH bF ;BM M/ ;BM
mMiBH Bi ;2ib bQK2i?BM; i?i Bb MQi M 2KTiv bi`BM;X TTHvBM; i?2 !
QT2`iQ` rBHH +QMp2`i  pHm2 iQ "QQH2M ivT2 #27Q`2 M2;iBM; Bi- M/ HH
bi`BM;b 2t+2Ti "" +QMp2`i iQ trueX h?Bb K2Mb i?2 HQQT +QMiBMm2b ;QBM;
`QmM/ mMiBH vQm T`QpB/2  MK2 i?i Bb MQi i?2 2KTiv bi`BM;X

AM/2MiBM; *Q/2
uQmǶp2 T`Q##Hv MQiB+2/ i?2 bT+2b A Tmi BM 7`QMi Q7 bQK2 bii2K2MibX
AM Cpa+`BTi- i?2b2 `2 MQi `2[mB`2/ěi?2 +QKTmi2` rBHH ++2Ti i?2 T`Q@
;`K Dmbi }M2 rBi?Qmi i?2KX AM 7+i- 2p2M i?2 HBM2 #`2Fb BM T`Q;`Kb
`2 QTiBQMHX uQm +QmH/ r`Bi2  T`Q;`K b  bBM;H2 HQM; HBM2 B7 vQm 72Hi
HBF2 BiX h?2 `QH2 Q7 i?2 BM/2MiiBQM BMbB/2 #HQ+Fb Bb iQ KF2 i?2 bi`m+im`2
Q7 i?2 +Q/2 biM/ QmiX AM +QKTH2t +Q/2- r?2`2 M2r #HQ+Fb `2 QT2M2/
BMbB/2 Qi?2` #HQ+Fb- Bi +M #2+QK2 ?`/ iQ b22 r?2`2 QM2 #HQ+F 2M/b M/
MQi?2` #2;BMbX qBi? T`QT2` BM/2MiiBQM- i?2 pBbmH b?T2 Q7  T`Q;`K
+Q``2bTQM/b iQ i?2 b?T2 Q7 i?2 #HQ+Fb BMbB/2 BiX A HBF2 iQ mb2 irQ bT+2b
7Q` 2p2`v QT2M #HQ+F- #mi ibi2b /Bz2`ěbQK2 T2QTH2 mb2 7Qm` bT+2b- M/
bQK2 T2QTH2 mb2 i# +?`+i2`bX

j9
7Q` HQQTb
JMv HQQTb 7QHHQr i?2 Tii2`M b22M BM i?2 T`2pBQmb while 2tKTH2bX 6B`bi-
 dz+QmMi2`Ǵ p`B#H2 Bb +`2i2/ iQ i`+F i?2 T`Q;`2bb Q7 i?2 HQQTX h?2M
+QK2b  while HQQT- r?Qb2 i2bi 2tT`2bbBQM mbmHHv +?2+Fb r?2i?2` i?2
+QmMi2` ?b `2+?2/ bQK2 #QmM/`v v2iX i i?2 2M/ Q7 i?2 HQQT #Q/v-
i?2 +QmMi2` Bb mT/i2/ iQ i`+F T`Q;`2bbX
"2+mb2 i?Bb Tii2`M Bb bQ +QKKQM- Cpa+`BTi M/ bBKBH` HM;m;2b
T`QpB/2  bHB;?iHv b?Q`i2` M/ KQ`2 +QKT`2?2MbBp2 7Q`K- i?2 for HQQTX
for ( var number = 0; number <= 12; number = number + 2)
console . log ( number ) ;
// → 0
// → 2
// ... etcetera

h?Bb T`Q;`K Bb 2t+iHv 2[mBpH2Mi iQ i?2 2`HB2` 2p2M@MmK#2`@T`BMiBM;


2tKTH2X h?2 QMHv +?M;2 Bb i?i HH i?2 bii2K2Mib i?i `2 `2Hi2/ iQ
i?2 dzbii2Ǵ Q7 i?2 HQQT `2 MQr ;`QmT2/ iQ;2i?2`X
h?2 T`2Mi?2b2b 7i2`  for F2vrQ`/ Kmbi +QMiBM irQ b2KB+QHQMbX h?2
T`i #27Q`2 i?2 }`bi b2KB+QHQM BMBiBHBx2b i?2 HQQT- mbmHHv #v /2}MBM;
 p`B#H2X h?2 b2+QM/ T`i Bb i?2 2tT`2bbBQM i?i +?2+Fb r?2i?2` i?2
HQQT Kmbi +QMiBMm2X h?2 }MH T`i mT/i2b i?2 bii2 Q7 i?2 HQQT 7i2`
2p2`v Bi2`iBQMX AM KQbi +b2b- i?Bb Bb b?Q`i2` M/ +H2`2` i?M  while
+QMbi`m+iX
>2`2 Bb i?2 +Q/2 i?i +QKTmi2b kRy - mbBM; for BMbi2/ Q7 while,
var result = 1;
for ( var counter = 0; counter < 10; counter = counter + 1)
result = result * 2;
console . log ( result ) ;
// → 1024

LQi2 i?i 2p2M i?Qm;? MQ #HQ+F Bb QT2M2/ rBi?  {- i?2 bii2K2Mi BM i?2
HQQT Bb biBHH BM/2Mi2/ irQ bT+2b iQ KF2 Bi +H2` i?i Bi dz#2HQM;bǴ iQ i?2
HBM2 #27Q`2 BiX

j8
"`2FBM; Pmi Q7  GQQT
>pBM; i?2 HQQTǶb +QM/BiBQM T`Q/m+2 false Bb MQi i?2 QMHv rv  HQQT +M
}MBb?X h?2`2 Bb  bT2+BH bii2K2Mi +HH2/ break i?i ?b i?2 2z2+i Q7
BKK2/Bi2Hv DmKTBM; Qmi Q7 i?2 2M+HQbBM; HQQTX
h?Bb T`Q;`K BHHmbi`i2b i?2 break bii2K2MiX Ai }M/b i?2 }`bi MmK#2`
i?i Bb #Qi? ;`2i2` i?M Q` 2[mH iQ ky M/ /BpBbB#H2 #v dX
for ( var current = 20; ; current ++) {
if ( current % 7 == 0)
break ;
}
console . log ( current ) ;
// → 21

lbBM; i?2 `2KBM/2` U%V QT2`iQ` Bb M 2bv rv iQ i2bi r?2i?2`  MmK#2`
Bb /BpBbB#H2 #v MQi?2` MmK#2`X A7 Bi Bb- i?2 `2KBM/2` Q7 i?2B` /BpBbBQM Bb
x2`QX
h?2 for +QMbi`m+i BM i?2 2tKTH2 /Q2b MQi ?p2  T`i i?i +?2+Fb 7Q`
i?2 2M/ Q7 i?2 HQQTX h?Bb K2Mb i?i i?2 HQQT rBHH M2p2` biQT mMH2bb i?2
break bii2K2Mi BMbB/2 Bb 2t2+mi2/X
A7 vQm r2`2 iQ H2p2 Qmi i?i break bii2K2Mi Q` ++B/2MiHHv r`Bi2 
+QM/BiBQM i?i Hrvb T`Q/m+2b true- vQm` T`Q;`K rQmH/ ;2i bim+F BM
M BM}MBi2 HQQTX  T`Q;`K bim+F BM M BM}MBi2 HQQT rBHH M2p2` }MBb?
`mMMBM;- r?B+? Bb mbmHHv  #/ i?BM;X
h?2 continue F2vrQ`/ Bb bBKBH` iQ break- BM i?i Bi BM~m2M+2b i?2 T`Q;`2bb
Q7  HQQTX q?2M continue Bb 2M+QmMi2`2/ BM  HQQT #Q/v- +QMi`QH DmKTb
Qmi Q7 i?2 #Q/v M/ +QMiBMm2b rBi? i?2 HQQTǶb M2ti Bi2`iBQMX

lT/iBM; p`B#H2b bm++BM+iHv


1bT2+BHHv r?2M HQQTBM;-  T`Q;`K Q7i2M M22/b iQ dzmT/i2Ǵ  p`B#H2
iQ ?QH/  pHm2 #b2/ QM i?i p`B#H2Ƕb T`2pBQmb pHm2X
counter = counter + 1;

Cpa+`BTi T`QpB/2b  b?Q`i+mi 7Q` i?Bb,


counter += 1;

je
aBKBH` b?Q`i+mib rQ`F 7Q` KMv Qi?2` QT2`iQ`b- bm+? b result *= 2 iQ
/Qm#H2 result Q` counter -= 1 iQ +QmMi /QrMr`/X
h?Bb HHQrb mb iQ b?Q`i2M Qm` +QmMiBM; 2tKTH2  HBiiH2 KQ`2X
for ( var number = 0; number <= 12; number += 2)
console . log ( number ) ;

6Q` counter += 1 M/ counter -= 1- i?2`2 `2 2p2M b?Q`i2` 2[mBpH2Mib, counter
++ M/ counter--X

.BbTi+?BM; QM  pHm2 rBi? brBi+?


Ai Bb +QKKQM 7Q` +Q/2 iQ HQQF HBF2 i?Bb,
if ( variable == " value1 ") action1 () ;
else if ( variable == " value2 ") action2 () ;
else if ( variable == " value3 ") action3 () ;
else defaultAction () ;

h?2`2 Bb  +QMbi`m+i +HH2/ switch i?i Bb BMi2M/2/ iQ bQHp2 bm+?  dz/Bb@


Ti+?Ǵ BM  KQ`2 /B`2+i rvX lM7Q`imMi2Hv- i?2 bvMit Cpa+`BTi mb2b
7Q` i?Bb Ur?B+? Bi BM?2`Bi2/ 7`QK i?2 *fCp HBM2 Q7 T`Q;`KKBM; HM@
;m;2bV Bb bQK2r?i rFr`/ě +?BM Q7 if bii2K2Mib Q7i2M HQQFb #2i@
i2`X >2`2 Bb M 2tKTH2,
switch ( prompt (" What is the weather like ?") ) {
case " rainy ":
console . log (" Remember to bring an umbrella .") ;
break ;
case " sunny ":
console . log (" Dress lightly .") ;
case " cloudy ":
console . log (" Go outside .") ;
break ;
default :
console . log (" Unknown weather type !") ;
break ;
}

uQm Kv Tmi Mv MmK#2` Q7 case H#2Hb BMbB/2 i?2 #HQ+F QT2M2/ #v switchX
h?2 T`Q;`K rBHH DmKT iQ i?2 H#2H i?i +Q``2bTQM/b iQ i?2 pHm2 i?i

jd
switch rb ;Bp2M Q` iQ default B7 MQ Ki+?BM; pHm2 Bb 7QmM/X Ai bi`ib
2t2+miBM; bii2K2Mib i?2`2- 2p2M B7 i?2vǶ`2 mM/2` MQi?2` H#2H- mMiBH
Bi `2+?2b  break bii2K2MiX AM bQK2 +b2b- bm+? b i?2 "sunny" +b2
BM i?2 2tKTH2- i?Bb +M #2 mb2/ iQ b?`2 bQK2 +Q/2 #2ir22M +b2b UBi
`2+QKK2M/b ;QBM; QmibB/2 7Q` #Qi? bmMMv M/ +HQm/v r2i?2`VX "mi
#2r`2, Bi Bb 2bv iQ 7Q`;2i bm+?  break- r?B+? rBHH +mb2 i?2 T`Q;`K
iQ 2t2+mi2 +Q/2 vQm /Q MQi rMi 2t2+mi2/X

*TBiHBxiBQM
o`B#H2 MK2b Kv MQi +QMiBM bT+2b- v2i Bi Bb Q7i2M ?2HT7mH iQ mb2
KmHiBTH2 rQ`/b iQ +H2`Hv /2b+`B#2 r?i i?2 p`B#H2 `2T`2b2MibX h?2b2
`2 T`2iiv Km+? vQm` +?QB+2b 7Q` r`BiBM;  p`B#H2 MK2 rBi? b2p2`H
rQ`/b BM Bi,
fuzzylittleturtle
fuzzy_little_turtle
FuzzyLittleTurtle
fuzzyLittleTurtle

h?2 }`bi bivH2 +M #2 ?`/ iQ `2/X S2`bQMHHv- A HBF2 i?2 HQQF Q7 i?2
mM/2`b+Q`2b- i?Qm;? i?i bivH2 Bb  HBiiH2 TBM7mH iQ ivT2X h?2 biM/`/
Cpa+`BTi 7mM+iBQMb- M/ KQbi Cpa+`BTi T`Q;`KK2`b- 7QHHQr i?2 #Qi@
iQK bivH2ěi?2v +TBiHBx2 2p2`v rQ`/ 2t+2Ti i?2 }`biX Ai Bb MQi ?`/ iQ
;2i mb2/ iQ HBiiH2 i?BM;b HBF2 i?i- M/ +Q/2 rBi? KBt2/ MKBM; bivH2b
+M #2 D``BM; iQ `2/- bQ r2 rBHH Dmbi 7QHHQr i?Bb +QMp2MiBQMX
AM  72r +b2b- bm+? b i?2 Number 7mM+iBQM- i?2 }`bi H2ii2` Q7  p`B#H2
Bb HbQ +TBiHBx2/X h?Bb rb /QM2 iQ K`F i?Bb 7mM+iBQM b  +QMbi`m+iQ`X
q?i  +QMbi`m+iQ` Bb rBHH #2+QK2 +H2` BM *?Ti2` eX 6Q` MQr- i?2 BK@
TQ`iMi i?BM; Bb MQi iQ #2 #Qi?2`2/ #v i?Bb TT`2Mi H+F Q7 +QMbBbi2M+vX

*QKK2Mib
P7i2M- `r +Q/2 /Q2b MQi +QMp2v HH i?2 BM7Q`KiBQM vQm rMi  T`Q;`K
iQ +QMp2v iQ ?mKM `2/2`b- Q` Bi +QMp2vb Bi BM bm+?  +`vTiB+ rv i?i
T2QTH2 KB;?i MQi mM/2`biM/ BiX i Qi?2` iBK2b- vQm KB;?i Dmbi 722H
TQ2iB+ Q` rMi iQ BM+Hm/2 bQK2 i?Qm;?ib b T`i Q7 vQm` T`Q;`KX h?Bb

j3
Bb r?i +QKK2Mib `2 7Q`X
 +QKK2Mi Bb  TB2+2 Q7 i2ti i?i Bb T`i Q7  T`Q;`K #mi Bb +QKTH2i2Hv
B;MQ`2/ #v i?2 +QKTmi2`X Cpa+`BTi ?b irQ rvb Q7 r`BiBM; +QKK2MibX
hQ r`Bi2  bBM;H2@HBM2 +QKK2Mi- vQm +M mb2 irQ bHb? +?`+i2`b U//V
M/ i?2M i?2 +QKK2Mi i2ti 7i2` BiX
var accountBalance = calculateBalance ( account );
// It s a green hollow where a river sings
accountBalance . adjust () ;
// Madly catching white tatters in the grass .
var report = new Report () ;
// Where the sun on the proud mountain rings :
addToReport ( accountBalance , report ) ;
// It s a little valley , foaming like light in a glass .

 // +QKK2Mi ;Q2b QMHv iQ i?2 2M/ Q7 i?2 HBM2X  b2+iBQM Q7 i2ti #2ir22M
/* M/ */ rBHH #2 B;MQ`2/- `2;`/H2bb Q7 r?2i?2` Bi +QMiBMb HBM2 #`2FbX
h?Bb Bb Q7i2M mb27mH 7Q` //BM; #HQ+Fb Q7 BM7Q`KiBQM #Qmi  }H2 Q` 
+?mMF Q7 T`Q;`KX
/*
I first found this number scrawled on the back of one of
my notebooks a few years ago . Since then , it has often
dropped by , showing up in phone numbers and the serial
numbers of products that I ve bought . It obviously likes
me , so I ve decided to keep it .
*/
var myNumber = 11213;

amKK`v
uQm MQr FMQr i?i  T`Q;`K Bb #mBHi Qmi Q7 bii2K2Mib- r?B+? i?2K@
b2Hp2b bQK2iBK2b +QMiBM KQ`2 bii2K2MibX aii2K2Mib i2M/ iQ +QMiBM
2tT`2bbBQMb- r?B+? i?2Kb2Hp2b +M #2 #mBHi Qmi Q7 bKHH2` 2tT`2bbBQMbX
SmiiBM; bii2K2Mib 7i2` QM2 MQi?2` ;Bp2b vQm  T`Q;`K i?i Bb 2t@
2+mi2/ 7`QK iQT iQ #QiiQKX uQm +M BMi`Q/m+2 /Bbim`#M+2b BM i?2 ~Qr
Q7 +QMi`QH #v mbBM; +QM/BiBQMH Uif- else- M/ switchV M/ HQQTBM; Uwhile-
do- M/ forV bii2K2MibX
o`B#H2b +M #2 mb2/ iQ }H2 TB2+2b Q7 /i mM/2`  MK2- M/ i?2v `2

jN
mb27mH 7Q` i`+FBM; bii2 BM vQm` T`Q;`KX h?2 2MpB`QMK2Mi Bb i?2 b2i Q7
p`B#H2b i?i `2 /2}M2/X Cpa+`BTi bvbi2Kb Hrvb Tmi  MmK#2` Q7
mb27mH biM/`/ p`B#H2b BMiQ vQm` 2MpB`QMK2MiX
6mM+iBQMb `2 bT2+BH pHm2b i?i 2M+TbmHi2  TB2+2 Q7 T`Q;`KX uQm
+M BMpQF2 i?2K #v r`BiBM; functionName(argument1, argument2)X am+? 
7mM+iBQM +HH Bb M 2tT`2bbBQM- M/ Kv T`Q/m+2  pHm2X

1t2`+Bb2b
A7 vQm `2 mMbm`2 ?Qr iQ i`v vQm` bQHmiBQMb iQ 2t2`+Bb2b- `272` iQ i?2
BMi`Q/m+iBQMX
1+? 2t2`+Bb2 bi`ib rBi?  T`Q#H2K /2b+`BTiBQMX _2/ i?i M/ i`v iQ
bQHp2 i?2 2t2`+Bb2X A7 vQm `mM BMiQ T`Q#H2Kb- +QMbB/2` `2/BM; i?2 ?BMib
U5BMi2`+iBp2 7i2` i?2 2t2`+Bb25Vi i?2 2M/ Q7 i?2 #QQFX 6mHH bQHmiBQMb iQ
i?2 2t2`+Bb2b `2 MQi BM+Hm/2/ BM i?Bb #QQF- #mi vQm +M }M/ i?2K QMHBM2
i 2HQ[m2MiDpb+`BTiXM2if+Q/2X A7 vQm rMi iQ H2`M bQK2i?BM; 7`QK i?2
2t2`+Bb2b- A `2+QKK2M/ HQQFBM; i i?2 bQHmiBQMb QMHv 7i2` vQmǶp2 bQHp2/
i?2 2t2`+Bb2- Q` i H2bi 7i2` vQmǶp2 ii+F2/ Bi HQM; M/ ?`/ 2MQm;? iQ
?p2  bHB;?i ?2/+?2X

GQQTBM;  i`BM;H2
q`Bi2  HQQT i?i KF2b b2p2M +HHb iQ console.log iQ QmiTmi i?2 7QHHQrBM;
i`BM;H2,
#
##
###
####
#####
######
#######

Ai Kv #2 mb27mH iQ FMQr i?i vQm +M }M/ i?2 H2M;i? Q7  bi`BM; #v
r`BiBM; .length 7i2` BiX
var abc = " abc ";
console . log ( abc . length ) ;
// → 3

9y
6Bxx"mxx
q`Bi2  T`Q;`K i?i mb2b console.log iQ T`BMi HH i?2 MmK#2`b 7`QK R
iQ Ryy- rBi? irQ 2t+2TiBQMbX 6Q` MmK#2`b /BpBbB#H2 #v j- T`BMi "Fizz"
BMbi2/ Q7 i?2 MmK#2`- M/ 7Q` MmK#2`b /BpBbB#H2 #v 8 UM/ MQi jV- T`BMi
"Buzz" BMbi2/X
q?2M vQm ?p2 i?i rQ`FBM;- KQ/B7v vQm` T`Q;`K iQ T`BMi "FizzBuzz"-
7Q` MmK#2`b i?i `2 /BpBbB#H2 #v #Qi? j M/ 8 UM/ biBHH T`BMi "Fizz" Q`
"Buzz" 7Q` MmK#2`b /BpBbB#H2 #v QMHv QM2 Q7 i?Qb2VX
Uh?Bb Bb +imHHv M BMi2`pB2r [m2biBQM i?i ?b #22M +HBK2/ iQ r22/
Qmi  bB;MB}+Mi T2`+2Mi;2 Q7 T`Q;`KK2` +M/B/i2bX aQ B7 vQm bQHp2/
Bi- vQmǶ`2 MQr HHQr2/ iQ 722H ;QQ/ #Qmi vQm`b2H7XV

*?2bb #Q`/
q`Bi2  T`Q;`K i?i +`2i2b  bi`BM; i?i `2T`2b2Mib M 3×3 ;`B/- mbBM;
M2rHBM2 +?`+i2`b iQ b2T`i2 HBM2bX i 2+? TQbBiBQM Q7 i?2 ;`B/ i?2`2
Bb 2Bi?2`  bT+2 Q`  dzOǴ +?`+i2`X h?2 +?`+i2`b b?QmH/ 7Q`K  +?2bb
#Q`/X
SbbBM; i?Bb bi`BM; iQ console.log b?QmH/ b?Qr bQK2i?BM; HBF2 i?Bb,
# # # #
# # # #
# # # #
# # # #
# # # #
# # # #
# # # #
# # # #

q?2M vQm ?p2  T`Q;`K i?i ;2M2`i2b i?Bb Tii2`M- /2}M2  p`B#H2
size = 8 M/ +?M;2 i?2 T`Q;`K bQ i?i Bi rQ`Fb 7Q` Mv size- QmiTmiiBM;
 ;`B/ Q7 i?2 ;Bp2M rB/i? M/ ?2B;?iX

9R
dzS2QTH2 i?BMF i?i +QKTmi2` b+B2M+2 Bb i?2 `i Q7 ;2MBmb2b #mi
i?2 +imH `2HBiv Bb i?2 QTTQbBi2- Dmbi KMv T2QTH2 /QBM; i?BM;b
i?i #mBH/ QM 2+? Qi?2`- HBF2  rHH Q7 KBMB biQM2bXǴ
ě.QMH/ EMmi?

j 6mM+iBQMb
uQmǶp2 b22M 7mM+iBQM pHm2b- bm+? b alert- M/ ?Qr iQ +HH i?2KX 6mM+@
iBQMb `2 i?2 #`2/ M/ #mii2` Q7 Cpa+`BTi T`Q;`KKBM;X h?2 +QM+2Ti
Q7 r`TTBM;  TB2+2 Q7 T`Q;`K BM  pHm2 ?b KMv mb2bX Ai Bb  iQQH iQ
bi`m+im`2 H`;2` T`Q;`Kb- iQ `2/m+2 `2T2iBiBQM- iQ bbQ+Bi2 MK2b rBi?
bm#T`Q;`Kb- M/ iQ BbQHi2 i?2b2 bm#T`Q;`Kb 7`QK 2+? Qi?2`X
h?2 KQbi Q#pBQmb TTHB+iBQM Q7 7mM+iBQMb Bb /2}MBM; M2r pQ+#mH`vX
*`2iBM; M2r rQ`/b BM `2;mH`- ?mKM@HM;m;2 T`Qb2 Bb mbmHHv #/
bivH2X "mi BM T`Q;`KKBM;- Bi Bb BM/BbT2Mb#H2X
hvTB+H /mHi 1M;HBb? bT2F2`b ?p2 bQK2 ky-yyy rQ`/b BM i?2B` pQ+#m@
H`vX 62r T`Q;`KKBM; HM;m;2b +QK2 rBi? ky-yyy +QKKM/b #mBHi BMX
M/ i?2 pQ+#mH`v i?i Bb pBH#H2 i2M/b iQ #2 KQ`2 T`2+Bb2Hv /2}M2/-
M/ i?mb H2bb ~2tB#H2- i?M BM ?mKM HM;m;2X h?2`27Q`2- r2 mbmHHv
?p2 iQ // bQK2 Q7 Qm` QrM pQ+#mH`v iQ pQB/ `2T2iBM; Qm`b2Hp2b iQQ
Km+?X

.2}MBM;  7mM+iBQM
 7mM+iBQM /2}MBiBQM Bb Dmbi  `2;mH` p`B#H2 /2}MBiBQM r?2`2 i?2 pHm2
;Bp2M iQ i?2 p`B#H2 ?TT2Mb iQ #2  7mM+iBQMX 6Q` 2tKTH2- i?2 7QHHQr@
BM; +Q/2 /2}M2b i?2 p`B#H2 square iQ `272` iQ  7mM+iBQM i?i T`Q/m+2b
i?2 b[m`2 Q7  ;Bp2M MmK#2`,
var square = function ( x ) {
return x * x ;
};

console . log ( square (12) ) ;


// → 144

 7mM+iBQM Bb +`2i2/ #v M 2tT`2bbBQM i?i bi`ib rBi? i?2 F2vrQ`/


functionX 6mM+iBQMb ?p2  b2i Q7 T`K2i2`b UBM i?Bb +b2- QMHv xV M/

9k
 #Q/v- r?B+? +QMiBMb i?2 bii2K2Mib i?i `2 iQ #2 2t2+mi2/ r?2M
i?2 7mM+iBQM Bb +HH2/X h?2 7mM+iBQM #Q/v Kmbi Hrvb #2 r`TT2/ BM
#`+2b- 2p2M r?2M Bi +QMbBbib Q7 QMHv  bBM;H2 bii2K2Mi Ub BM i?2 T`2pBQmb
2tKTH2VX
 7mM+iBQM +M ?p2 KmHiBTH2 T`K2i2`b Q` MQ T`K2i2`b i HHX AM i?2
7QHHQrBM; 2tKTH2- makeNoise /Q2b MQi HBbi Mv T`K2i2` MK2b- r?2`2b
power HBbib irQ,

var makeNoise = function () {


console . log (" Pling !") ;
};

makeNoise () ;
// → Pling !

var power = function ( base , exponent ) {


var result = 1;
for ( var count = 0; count < exponent ; count ++)
result *= base ;
return result ;
};

console . log ( power (2 , 10) ) ;


// → 1024

aQK2 7mM+iBQMb T`Q/m+2  pHm2- bm+? b power M/ square- M/ bQK2 /QMǶi-
bm+? b makeNoise- r?B+? T`Q/m+2b QMHv  bB/2 2z2+iX  return bii2K2Mi
/2i2`KBM2b i?2 pHm2 i?2 7mM+iBQM `2im`MbX q?2M +QMi`QH +QK2b +`Qbb
bm+?  bii2K2Mi- Bi BKK2/Bi2Hv DmKTb Qmi Q7 i?2 +m``2Mi 7mM+iBQM M/
;Bp2b i?2 `2im`M2/ pHm2 iQ i?2 +Q/2 i?i +HH2/ i?2 7mM+iBQMX h?2 return
F2vrQ`/ rBi?Qmi M 2tT`2bbBQM 7i2` Bi rBHH +mb2 i?2 7mM+iBQM iQ `2im`M
undefinedX

S`K2i2`b M/ b+QT2b


h?2 T`K2i2`b iQ  7mM+iBQM #2?p2 HBF2 `2;mH` p`B#H2b- #mi i?2B`
BMBiBH pHm2b `2 ;Bp2M #v i?2 +HH2` Q7 i?2 7mM+iBQM- MQi i?2 +Q/2 BM i?2
7mM+iBQM Bib2H7X
M BKTQ`iMi T`QT2`iv Q7 7mM+iBQMb Bb i?i i?2 p`B#H2b +`2i2/ BMbB/2

9j
Q7 i?2K- BM+Hm/BM; i?2B` T`K2i2`b- `2 HQ+H iQ i?2 7mM+iBQMX h?Bb
K2Mb- 7Q` 2tKTH2- i?i i?2 result p`B#H2 BM i?2 power 2tKTH2 rBHH
#2 M2rHv +`2i2/ 2p2`v iBK2 i?2 7mM+iBQM Bb +HH2/- M/ i?2b2 b2T`i2
BM+`MiBQMb /Q MQi BMi2`72`2 rBi? 2+? Qi?2`X
h?Bb dzHQ+HM2bbǴ Q7 p`B#H2b TTHB2b QMHv iQ i?2 T`K2i2`b M/ iQ
p`B#H2b /2+H`2/ rBi? i?2 var F2vrQ`/ BMbB/2 i?2 7mM+iBQM #Q/vX o`B@
#H2b /2+H`2/ QmibB/2 Q7 Mv 7mM+iBQM `2 +HH2/ ;HQ#H- #2+mb2 i?2v `2
pBbB#H2 i?`Qm;?Qmi i?2 T`Q;`KX Ai Bb TQbbB#H2 iQ ++2bb bm+? p`B#H2b
7`QK BMbB/2  7mM+iBQM- b HQM; b vQm ?p2MǶi /2+H`2/  HQ+H p`B#H2
rBi? i?2 bK2 MK2X
h?2 7QHHQrBM; +Q/2 /2KQMbi`i2b i?BbX Ai /2}M2b M/ +HHb irQ 7mM+iBQMb
i?i #Qi? bbB;M  pHm2 iQ i?2 p`B#H2 xX h?2 }`bi QM2 /2+H`2b i?2
p`B#H2 b HQ+H M/ i?mb +?M;2b QMHv i?2 HQ+H p`B#H2X h?2 b2+QM/
/Q2b MQi /2+H`2 x HQ+HHv- bQ `272`2M+2b iQ x BMbB/2 Q7 Bi `272` iQ i?2 ;HQ#H
p`B#H2 x /2}M2/ i i?2 iQT Q7 i?2 2tKTH2X
var x = " outside ";

var f1 = function () {
var x = " inside f1 ";
};
f1 () ;
console . log ( x ) ;
// → outside

var f2 = function () {
x = " inside f2 ";
};
f2 () ;
console . log ( x ) ;
// → inside f2

h?Bb #2?pBQ` ?2HTb T`2p2Mi ++B/2MiH BMi2`72`2M+2 #2ir22M 7mM+iBQMbX


A7 HH p`B#H2b r2`2 b?`2/ #v i?2 r?QH2 T`Q;`K- BiǶ/ iF2  HQi Q7 2zQ`i
iQ KF2 bm`2 MQ MK2 Bb 2p2` mb2/ 7Q` irQ /Bz2`2Mi Tm`TQb2bX M/ B7 vQm
/B/ `2mb2  p`B#H2 MK2- vQm KB;?i b22 bi`M;2 2z2+ib 7`QK mM`2Hi2/
+Q/2 K2bbBM; rBi? i?2 pHm2 Q7 vQm` p`B#H2X "v i`2iBM; 7mM+iBQM@HQ+H
p`B#H2b b 2tBbiBM; QMHv rBi?BM i?2 7mM+iBQM- i?2 HM;m;2 KF2b Bi
TQbbB#H2 iQ `2/ M/ mM/2`biM/ 7mM+iBQMb b bKHH mMBp2`b2b- rBi?Qmi

99
?pBM; iQ rQ``v #Qmi HH i?2 +Q/2 i QM+2X

L2bi2/ b+QT2
Cpa+`BTi /BbiBM;mBb?2b MQi Dmbi #2ir22M ;HQ#H M/ HQ+H p`B#H2bX 6mM+@
iBQMb +M #2 +`2i2/ BMbB/2 Qi?2` 7mM+iBQMb- T`Q/m+BM; b2p2`H /2;`22b Q7
HQ+HBivX
6Q` 2tKTH2- i?Bb `i?2` MQMb2MbB+H 7mM+iBQM ?b irQ 7mM+iBQMb BMbB/2
Q7 Bi,
var landscape = function () {
var result = "";
var flat = function ( size ) {
for ( var count = 0; count < size ; count ++)
result += " _ ";
};
var mountain = function ( size ) {
result += "/";
for ( var count = 0; count < size ; count ++)
result += " ";
result += "\\";
};

flat (3) ;
mountain (4) ;
flat (6) ;
mountain (1) ;
flat (1) ;
return result ;
};

console . log ( landscape () ) ;


// → ___ / \ ______ / \ _

h?2 flat M/ mountain 7mM+iBQMb +M dzb22Ǵ i?2 p`B#H2 +HH2/ result- bBM+2
i?2v `2 BMbB/2 i?2 7mM+iBQM i?i /2}M2b BiX "mi i?2v +MMQi b22 2+?
Qi?2`Ƕb count p`B#H2b bBM+2 i?2v `2 QmibB/2 2+? Qi?2`Ƕb b+QT2X h?2
2MpB`QMK2Mi QmibB/2 Q7 i?2 landscape 7mM+iBQM /Q2bMǶi b22 Mv Q7 i?2 p`B@
#H2b /2}M2/ BMbB/2 landscapeX
AM b?Q`i- 2+? HQ+H b+QT2 +M HbQ b22 HH i?2 HQ+H b+QT2b i?i +QMiBM

98
BiX h?2 b2i Q7 p`B#H2b pBbB#H2 BMbB/2  7mM+iBQM Bb /2i2`KBM2/ #v i?2 TH+2
Q7 i?i 7mM+iBQM BM i?2 T`Q;`K i2tiX HH p`B#H2b 7`QK #HQ+Fb `QmM/ 
7mM+iBQMǶb /2}MBiBQM `2 pBbB#H2ěK2MBM; #Qi? i?Qb2 BM 7mM+iBQM #Q/B2b
i?i 2M+HQb2 Bi M/ i?Qb2 i i?2 iQT H2p2H Q7 i?2 T`Q;`KX h?Bb TT`Q+?
iQ p`B#H2 pBbB#BHBiv Bb +HH2/ H2tB+H b+QTBM;X
S2QTH2 r?Q ?p2 2tT2`B2M+2 rBi? Qi?2` T`Q;`KKBM; HM;m;2b KB;?i
2tT2+i i?i Mv #HQ+F Q7 +Q/2 #2ir22M #`+2b T`Q/m+2b  M2r HQ+H 2M@
pB`QMK2MiX "mi BM Cpa+`BTi- 7mM+iBQMb `2 i?2 QMHv i?BM;b i?i +`2i2
 M2r b+QT2X uQm `2 HHQr2/ iQ mb2 7`22@biM/BM; #HQ+FbX
var something = 1;
{
var something = 2;
// Do stuff with variable something ...
}
// Outside of the block again ...

"mi i?2 something BMbB/2 i?2 #HQ+F `272`b iQ i?2 bK2 p`B#H2 b i?2 QM2
QmibB/2 i?2 #HQ+FX AM 7+i- Hi?Qm;? #HQ+Fb HBF2 i?Bb `2 HHQr2/- i?2v `2
mb27mH QMHv iQ ;`QmT i?2 #Q/v Q7 M if bii2K2Mi Q`  HQQTX
A7 vQm }M/ i?Bb Q//- vQmǶ`2 MQi HQM2X h?2 M2ti p2`bBQM Q7 Cpa+`BTi
rBHH BMi`Q/m+2  let F2vrQ`/- r?B+? rQ`Fb HBF2 var #mi +`2i2b  p`B#H2
i?i Bb HQ+H iQ i?2 2M+HQbBM; #HQ+F- MQi i?2 2M+HQbBM; 7mM+iBQMX

6mM+iBQMb b pHm2b
6mM+iBQM p`B#H2b mbmHHv bBKTHv +i b MK2b 7Q`  bT2+B}+ TB2+2 Q7 i?2
T`Q;`KX am+?  p`B#H2 Bb /2}M2/ QM+2 M/ M2p2` +?M;2/X h?Bb KF2b
Bi 2bv iQ bi`i +QM7mbBM; i?2 7mM+iBQM M/ Bib MK2X
"mi i?2 irQ `2 /Bz2`2MiX  7mM+iBQM pHm2 +M /Q HH i?2 i?BM;b i?i
Qi?2` pHm2b +M /QěvQm +M mb2 Bi BM `#Bi``v 2tT`2bbBQMb- MQi Dmbi
+HH BiX Ai Bb TQbbB#H2 iQ biQ`2  7mM+iBQM pHm2 BM  M2r TH+2- Tbb Bi b
M `;mK2Mi iQ  7mM+iBQM- M/ bQ QMX aBKBH`Hv-  p`B#H2 i?i ?QH/b 
7mM+iBQM Bb biBHH Dmbi  `2;mH` p`B#H2 M/ +M #2 bbB;M2/  M2r pHm2-
HBF2 bQ,
var launchMissiles = function ( value ) {
missileSystem . launch (" now ") ;

9e
};
if ( safeMode )
launchMissiles = function ( value ) {/* do nothing */};

AM *?Ti2` 8- r2 rBHH /Bb+mbb i?2 rQM/2`7mH i?BM;b i?i +M #2 /QM2 #v


TbbBM; `QmM/ 7mM+iBQM pHm2b iQ Qi?2` 7mM+iBQMbX

.2+H`iBQM MQiiBQM
h?2`2 Bb  bHB;?iHv b?Q`i2` rv iQ bv dzvar square = ...functionǴX h?2
function F2vrQ`/ +M HbQ #2 mb2/ i i?2 bi`i Q7  bii2K2Mi- b BM i?2
7QHHQrBM;,
function square ( x ) {
return x * x ;
}

h?Bb Bb  7mM+iBQM /2+H`iBQMX h?2 bii2K2Mi /2}M2b i?2 p`B#H2 square


M/ TQBMib Bi i i?2 ;Bp2M 7mM+iBQMX aQ 7` bQ ;QQ/X h?2`2 Bb QM2 bm#iH2iv
rBi? i?Bb 7Q`K Q7 7mM+iBQM /2}MBiBQM- ?Qr2p2`X
console . log (" The future says :" , future () ) ;

function future () {
return " We STILL have no flying cars .";
}

h?Bb +Q/2 rQ`Fb- 2p2M i?Qm;? i?2 7mM+iBQM Bb /2}M2/ #2HQr i?2 +Q/2
i?i mb2b BiX h?Bb Bb #2+mb2 7mM+iBQM /2+H`iBQMb `2 MQi T`i Q7 i?2
`2;mH` iQT@iQ@#QiiQK ~Qr Q7 +QMi`QHX h?2v `2 +QM+2TimHHv KQp2/ iQ
i?2 iQT Q7 i?2B` b+QT2 M/ +M #2 mb2/ #v HH i?2 +Q/2 BM i?i b+QT2X
h?Bb Bb bQK2iBK2b mb27mH #2+mb2 Bi ;Bp2b mb i?2 7`22/QK iQ Q`/2` +Q/2 BM
 rv i?i b22Kb K2MBM;7mH- rBi?Qmi rQ``vBM; #Qmi ?pBM; iQ /2}M2
HH 7mM+iBQMb #Qp2 i?2B` }`bi mb2X
q?i ?TT2Mb r?2M vQm Tmi bm+?  7mM+iBQM /2}MBiBQM BMbB/2  +QM@
/BiBQMH UifV #HQ+F Q`  HQQT\ q2HH- /QMǶi /Q i?iX .Bz2`2Mi Cpa+`BTi
THi7Q`Kb BM /Bz2`2Mi #`Qrb2`b ?p2 i`/BiBQMHHv /QM2 /Bz2`2Mi i?BM;b
BM i?i bBimiBQM- M/ i?2 Hi2bi biM/`/ +imHHv 7Q`#B/b BiX A7 vQm rMi
vQm` T`Q;`Kb iQ #2?p2 +QMbBbi2MiHv- QMHv mb2 i?Bb 7Q`K Q7 7mM+iBQM@

9d
/2}MBM; bii2K2Mib BM i?2 Qmi2`KQbi #HQ+F Q7  7mM+iBQM Q` T`Q;`KX
function example () {
function a () {} // Okay
if ( something ) {
function b () {} // Danger !
}
}

h?2 +HH bi+F


Ai rBHH #2 ?2HT7mH iQ iF2  +HQb2` HQQF i i?2 rv +QMi`QH ~Qrb i?`Qm;?
7mM+iBQMbX >2`2 Bb  bBKTH2 T`Q;`K i?i KF2b  72r 7mM+iBQM +HHb,
function greet ( who ) {
console . log (" Hello " + who ) ;
}
greet (" Harry ") ;
console . log (" Bye ") ;

 `mM i?`Qm;? i?Bb T`Q;`K ;Q2b `Qm;?Hv HBF2 i?Bb, i?2 +HH iQ greet +mb2b
+QMi`QH iQ DmKT iQ i?2 bi`i Q7 i?i 7mM+iBQM UHBM2 kVX Ai +HHb console.log
U #mBHi@BM #`Qrb2` 7mM+iBQMV- r?B+? iF2b +QMi`QH- /Q2b Bib DQ#- M/ i?2M
`2im`Mb +QMi`QH iQ HBM2 kX h?2M Bi `2+?2b i?2 2M/ Q7 i?2 greet 7mM+iBQM-
bQ Bi `2im`Mb iQ i?2 TH+2 i?i +HH2/ Bi- i HBM2 9X h?2 HBM2 7i2` i?i
+HHb console.log ;BMX
q2 +QmH/ b?Qr i?2 ~Qr Q7 +QMi`QH b+?2KiB+HHv HBF2 i?Bb,
top
greet
console . log
greet
top
console . log
top

"2+mb2  7mM+iBQM ?b iQ DmKT #+F iQ i?2 TH+2 Q7 i?2 +HH r?2M Bi
`2im`Mb- i?2 +QKTmi2` Kmbi `2K2K#2` i?2 +QMi2ti 7`QK r?B+? i?2 7mM+@
iBQM rb +HH2/X AM QM2 +b2- console.log ?b iQ DmKT #+F iQ i?2 greet
7mM+iBQMX AM i?2 Qi?2` +b2- Bi DmKTb #+F iQ i?2 2M/ Q7 i?2 T`Q;`KX

93
h?2 TH+2 r?2`2 i?2 +QKTmi2` biQ`2b i?Bb +QMi2ti Bb i?2 +HH bi+FX
1p2`v iBK2  7mM+iBQM Bb +HH2/- i?2 +m``2Mi +QMi2ti Bb Tmi QM iQT Q7 i?Bb
dzbi+FǴX q?2M i?2 7mM+iBQM `2im`Mb- Bi `2KQp2b i?2 iQT +QMi2ti 7`QK i?2
bi+F M/ mb2b Bi iQ +QMiBMm2 2t2+miBQMX
aiQ`BM; i?Bb bi+F `2[mB`2b bT+2 BM i?2 +QKTmi2`Ƕb K2KQ`vX q?2M i?2
bi+F ;`Qrb iQQ #B;- i?2 +QKTmi2` rBHH 7BH rBi?  K2bb;2 HBF2 dzQmi Q7
bi+F bT+2Ǵ Q` dziQQ Km+? `2+m`bBQMǴX h?2 7QHHQrBM; +Q/2 BHHmbi`i2b i?Bb
#v bFBM; i?2 +QKTmi2`  `2HHv ?`/ [m2biBQM- r?B+? +mb2b M BM}MBi2
#+F@M/@7Q`i? #2ir22M irQ 7mM+iBQMbX _i?2`- Bi rQmH/ #2 BM}MBi2- B7
i?2 +QKTmi2` ?/ M BM}MBi2 bi+FX b Bi Bb- r2 rBHH `mM Qmi Q7 bT+2- Q`
dz#HQr i?2 bi+FǴX
function chicken () {
return egg () ;
}
function egg () {
return chicken () ;
}
console . log ( chicken () + " came first .") ;
// → ??

PTiBQMH `;mK2Mib
h?2 7QHHQrBM; +Q/2 Bb HHQr2/ M/ 2t2+mi2b rBi?Qmi Mv T`Q#H2K,
alert (" Hello " , " Good Evening " , " How do you do ?") ;

h?2 7mM+iBQM alert Q{+BHHv ++2Tib QMHv QM2 `;mK2MiX u2i r?2M vQm
+HH Bi HBF2 i?Bb- Bi /Q2bMǶi +QKTHBMX Ai bBKTHv B;MQ`2b i?2 Qi?2` `;m@
K2Mib M/ b?Qrb vQm dz>2HHQǴX
Cpa+`BTi Bb 2ti`2K2Hv #`Q/@KBM/2/ #Qmi i?2 MmK#2` Q7 `;mK2Mib
vQm Tbb iQ  7mM+iBQMX A7 vQm Tbb iQQ KMv- i?2 2ti` QM2b `2 B;MQ`2/X
A7 vQm Tbb iQQ 72r- i?2 KBbbBM; T`K2i2`b bBKTHv ;2i bbB;M2/ i?2 pHm2
undefinedX
h?2 /QrMbB/2 Q7 i?Bb Bb i?i Bi Bb TQbbB#H2ěHBF2Hv- 2p2Měi?i vQmǶHH
++B/2MiHHv Tbb i?2 r`QM; MmK#2` Q7 `;mK2Mib iQ 7mM+iBQMb M/ MQ
QM2 rBHH i2HH vQm #Qmi BiX

9N
h?2 mTbB/2 Bb i?i i?Bb #2?pBQ` +M #2 mb2/ iQ ?p2  7mM+iBQM iF2
dzQTiBQMHǴ `;mK2MibX 6Q` 2tKTH2- i?2 7QHHQrBM; p2`bBQM Q7 power +M
#2 +HH2/ 2Bi?2` rBi? irQ `;mK2Mib Q` rBi?  bBM;H2 `;mK2Mi- BM r?B+?
+b2 i?2 2tTQM2Mi Bb bbmK2/ iQ #2 irQ- M/ i?2 7mM+iBQM #2?p2b HBF2
squareX

function power ( base , exponent ) {


if ( exponent == undefined )
exponent = 2;
var result = 1;
for ( var count = 0; count < exponent ; count ++)
result *= base ;
return result ;
}

console . log ( power (4) ) ;


// → 16
console . log ( power (4 , 3) );
// → 64

AM i?2 M2ti +?Ti2`- r2 rBHH b22  rv BM r?B+?  7mM+iBQM #Q/v +M ;2i
i i?2 2t+i HBbi Q7 `;mK2Mib i?i r2`2 Tbb2/X h?Bb Bb ?2HT7mH #2+mb2
Bi KF2b Bi TQbbB#H2 7Q`  7mM+iBQM iQ ++2Ti Mv MmK#2` Q7 `;mK2MibX
6Q` 2tKTH2- console.log KF2b mb2 Q7 i?BběBi QmiTmib HH Q7 i?2 pHm2b
Bi Bb ;Bp2MX
console . log (" R " , 2 , " D " , 2) ;
// → R 2 D 2

*HQbm`2
h?2 #BHBiv iQ i`2i 7mM+iBQMb b pHm2b- +QK#BM2/ rBi? i?2 7+i i?i HQ+H
p`B#H2b `2 dz`2@+`2i2/Ǵ 2p2`v iBK2  7mM+iBQM Bb +HH2/- #`BM;b mT M
BMi2`2biBM; [m2biBQMX q?i ?TT2Mb iQ HQ+H p`B#H2b r?2M i?2 7mM+iBQM
+HH i?i +`2i2/ i?2K Bb MQ HQM;2` +iBp2\
h?2 7QHHQrBM; +Q/2 b?Qrb M 2tKTH2 Q7 i?BbX Ai /2}M2b  7mM+iBQM-
wrapValue- r?B+? +`2i2b  HQ+H p`B#H2X Ai i?2M `2im`Mb  7mM+iBQM i?i
++2bb2b M/ `2im`Mb i?Bb HQ+H p`B#H2X

8y
function wrapValue ( n ) {
var localVariable = n ;
return function () { return localVariable ; };
}

var wrap1 = wrapValue (1) ;


var wrap2 = wrapValue (2) ;
console . log ( wrap1 () ) ;
// → 1
console . log ( wrap2 () ) ;
// → 2

h?Bb Bb HHQr2/ M/ rQ`Fb b vQmǶ/ ?QT2ěi?2 p`B#H2 +M biBHH #2 +@
+2bb2/X AM 7+i- KmHiBTH2 BMbiM+2b Q7 i?2 p`B#H2 +M #2 HBp2 i i?2
bK2 iBK2- r?B+? Bb MQi?2` ;QQ/ BHHmbi`iBQM Q7 i?2 +QM+2Ti i?i HQ+H
p`B#H2b `2HHv `2 `2@+`2i2/ 7Q` 2p2`v +HHě/Bz2`2Mi +HHb +MǶi i`KTH2
QM QM2 MQi?2`Ƕb HQ+H p`B#H2bX
h?Bb 72im`2ě#2BM; #H2 iQ `272`2M+2  bT2+B}+ BMbiM+2 Q7 HQ+H p`B@
#H2b BM M 2M+HQbBM; 7mM+iBQMěBb +HH2/ +HQbm`2X  7mM+iBQM i?i dz+HQb2b
Qp2`Ǵ bQK2 HQ+H p`B#H2b Bb +HH2/  +HQbm`2X h?Bb #2?pBQ` MQi QMHv 7`22b
vQm 7`QK ?pBM; iQ rQ``v #Qmi HB72iBK2b Q7 p`B#H2b #mi HbQ HHQrb 7Q`
bQK2 +`2iBp2 mb2 Q7 7mM+iBQM pHm2bX
qBi?  bHB;?i +?M;2- r2 +M im`M i?2 T`2pBQmb 2tKTH2 BMiQ  rv iQ
+`2i2 7mM+iBQMb i?i KmHiBTHv #v M `#Bi``v KQmMiX
function multiplier ( factor ) {
return function ( number ) {
return number * factor ;
};
}

var twice = multiplier (2) ;


console . log ( twice (5) ) ;
// → 10

h?2 2tTHB+Bi localVariable 7`QK i?2 wrapValue 2tKTH2 BbMǶi M22/2/ bBM+2
 T`K2i2` Bb Bib2H7  HQ+H p`B#H2X
h?BMFBM; #Qmi T`Q;`Kb HBF2 i?Bb iF2b bQK2 T`+iB+2X  ;QQ/ K2MiH
KQ/2H Bb iQ i?BMF Q7 i?2 function F2vrQ`/ b dz7`22xBM;Ǵ i?2 +Q/2 BM Bib
#Q/v M/ r`TTBM; Bi BMiQ  T+F;2 Ui?2 7mM+iBQM pHm2VX aQ r?2M vQm

8R
`2/ return function(...){...}- i?BMF Q7 Bi b `2im`MBM;  ?M/H2 iQ  TB2+2
Q7 +QKTmiiBQM- 7`Qx2M 7Q` Hi2` mb2X
AM i?2 2tKTH2- multiplier `2im`Mb  7`Qx2M +?mMF Q7 +Q/2 i?i ;2ib
biQ`2/ BM i?2 twice p`B#H2X h?2 Hbi HBM2 i?2M +HHb i?2 pHm2 BM i?Bb
p`B#H2- +mbBM; i?2 7`Qx2M +Q/2 Ureturn number * factor;V iQ #2 +iBpi2/X
Ai biBHH ?b ++2bb iQ i?2 factor p`B#H2 7`QK i?2 multiplier +HH i?i
+`2i2/ Bi- M/ BM //BiBQM Bi ;2ib ++2bb iQ i?2 `;mK2Mi Tbb2/ r?2M
mM7`22xBM; Bi- 8- i?`Qm;? Bib number T`K2i2`X

_2+m`bBQM
Ai Bb T2`72+iHv QFv 7Q`  7mM+iBQM iQ +HH Bib2H7- b HQM; b Bi iF2b +`2
MQi iQ Qp2`~Qr i?2 bi+FX  7mM+iBQM i?i +HHb Bib2H7 Bb +HH2/ `2+m`bBp2X
_2+m`bBQM HHQrb bQK2 7mM+iBQMb iQ #2 r`Bii2M BM  /Bz2`2Mi bivH2X hF2-
7Q` 2tKTH2- i?Bb Hi2`MiBp2 BKTH2K2MiiBQM Q7 power,
function power ( base , exponent ) {
if ( exponent == 0)
return 1;
else
return base * power ( base , exponent - 1) ;
}

console . log ( power (2 , 3) );


// → 8

h?Bb Bb `i?2` +HQb2 iQ i?2 rv Ki?2KiB+BMb /2}M2 2tTQM2MiBiBQM


M/ `;m#Hv /2b+`B#2b i?2 +QM+2Ti BM  KQ`2 2H2;Mi rv i?M i?2 HQQT@
BM; p`BMi /Q2bX h?2 7mM+iBQM +HHb Bib2H7 KmHiBTH2 iBK2b rBi? /Bz2`2Mi
`;mK2Mib iQ +?B2p2 i?2 `2T2i2/ KmHiBTHB+iBQMX
"mi i?Bb BKTH2K2MiiBQM ?b QM2 BKTQ`iMi T`Q#H2K, BM ivTB+H Cpa+`BTi
BKTH2K2MiiBQMb- BiǶb #Qmi Ry iBK2b bHQr2` i?M i?2 HQQTBM; p2`bBQMX
_mMMBM; i?`Qm;?  bBKTH2 HQQT Bb  HQi +?2T2` i?M +HHBM;  7mM+iBQM
KmHiBTH2 iBK2bX
h?2 /BH2KK Q7 bT22/ p2`bmb 2H2;M+2 Bb M BMi2`2biBM; QM2X uQm +M
b22 Bi b  FBM/ Q7 +QMiBMmmK #2ir22M ?mKM@7`B2M/HBM2bb M/ K+?BM2@
7`B2M/HBM2bbX HKQbi Mv T`Q;`K +M #2 K/2 7bi2` #v KFBM; Bi #B;;2`
M/ KQ`2 +QMpQHmi2/X h?2 T`Q;`KK2` Kmbi /2+B/2 QM M TT`QT`Bi2

8k
#HM+2X
AM i?2 +b2 Q7 i?2 2`HB2` power 7mM+iBQM- i?2 BM2H2;Mi UHQQTBM;V p2`bBQM
Bb biBHH 7B`Hv bBKTH2 M/ 2bv iQ `2/X Ai /Q2bMǶi KF2 Km+? b2Mb2 iQ
`2TH+2 Bi rBi? i?2 `2+m`bBp2 p2`bBQMX P7i2M- i?Qm;?-  T`Q;`K /2Hb
rBi? bm+? +QKTH2t +QM+2Tib i?i ;BpBM; mT bQK2 2{+B2M+v BM Q`/2` iQ
KF2 i?2 T`Q;`K KQ`2 bi`B;?i7Q`r`/ #2+QK2b M ii`+iBp2 +?QB+2X
h?2 #bB+ `mH2- r?B+? ?b #22M `2T2i2/ #v KMv T`Q;`KK2`b M/
rBi? r?B+? A r?QH2?2`i2/Hv ;`22- Bb iQ MQi rQ``v #Qmi 2{+B2M+v mMiBH
vQm FMQr 7Q` bm`2 i?i i?2 T`Q;`K Bb iQQ bHQrX A7 Bi Bb- }M/ Qmi r?B+?
T`ib `2 iFBM; mT i?2 KQbi iBK2- M/ bi`i 2t+?M;BM; 2H2;M+2 7Q`
2{+B2M+v BM i?Qb2 T`ibX
P7 +Qm`b2- i?Bb `mH2 /Q2bMǶi K2M QM2 b?QmH/ bi`i B;MQ`BM; T2`7Q`KM+2
HiQ;2i?2`X AM KMv +b2b- HBF2 i?2 power 7mM+iBQM- MQi Km+? bBKTHB+Biv
Bb ;BM2/ 7`QK i?2 dz2H2;MiǴ TT`Q+?X M/ bQK2iBK2b M 2tT2`B2M+2/
T`Q;`KK2` +M b22 `B;?i rv i?i  bBKTH2 TT`Q+? Bb M2p2` ;QBM; iQ
#2 7bi 2MQm;?X
h?2 `2bQM AǶK bi`2bbBM; i?Bb Bb i?i bm`T`BbBM;Hv KMv #2;BMMBM; T`Q@
;`KK2`b 7Q+mb 7MiB+HHv QM 2{+B2M+v- 2p2M BM i?2 bKHH2bi /2iBHbX
h?2 `2bmHi Bb #B;;2`- KQ`2 +QKTHB+i2/- M/ Q7i2M H2bb +Q``2+i T`Q;`Kb-
i?i iF2 HQM;2` iQ r`Bi2 i?M i?2B` KQ`2 bi`B;?i7Q`r`/ 2[mBpH2Mib
M/ i?i mbmHHv `mM QMHv K`;BMHHv 7bi2`X
"mi `2+m`bBQM Bb MQi Hrvb Dmbi  H2bb@2{+B2Mi Hi2`MiBp2 iQ HQQT@
BM;X aQK2 T`Q#H2Kb `2 Km+? 2bB2` iQ bQHp2 rBi? `2+m`bBQM i?M rBi?
HQQTbX JQbi Q7i2M i?2b2 `2 T`Q#H2Kb i?i `2[mB`2 2tTHQ`BM; Q` T`Q+2bb@
BM; b2p2`H dz#`M+?2bǴ- 2+? Q7 r?B+? KB;?i #`M+? Qmi ;BM BMiQ KQ`2
#`M+?2bX
*QMbB/2` i?Bb TmxxH2, #v bi`iBM; 7`QK i?2 MmK#2` R M/ `2T2i2/Hv
2Bi?2` //BM; 8 Q` KmHiBTHvBM; #v j- M BM}MBi2 KQmMi Q7 M2r MmK#2`b
+M #2 T`Q/m+2/X >Qr rQmH/ vQm r`Bi2  7mM+iBQM i?i- ;Bp2M  MmK@
#2`- i`B2b iQ }M/  b2[m2M+2 Q7 bm+? //BiBQMb M/ KmHiBTHB+iBQMb i?i
T`Q/m+2 i?i MmK#2`\ 6Q` 2tKTH2- i?2 MmK#2` Rj +QmH/ #2 `2+?2/ #v
}`bi KmHiBTHvBM; #v j M/ i?2M //BM; 8 irB+2- r?2`2b i?2 MmK#2` R8
+MMQi #2 `2+?2/ i HHX
>2`2 Bb  `2+m`bBp2 bQHmiBQM,
function findSolution ( target ) {
function find ( start , history ) {

8j
if ( start == target )
return history ;
else if ( start > target )
return null ;
else
return find ( start + 5 , "(" + history + " + 5) ") ||
find ( start * 3, "(" + history + " * 3) ") ;
}
return find (1 , "1") ;
}

console . log ( findSolution (24) );


// → (((1 * 3) + 5) * 3)

LQi2 i?i i?Bb T`Q;`K /Q2bMǶi M2+2bb`BHv }M/ i?2 b?Q`i2bi b2[m2M+2 Q7
QT2`iBQMbX Ai Bb biBb}2/ r?2M Bi }M/b Mv b2[m2M+2 i HHX
A /QMǶi M2+2bb`BHv 2tT2+i vQm iQ b22 ?Qr Bi rQ`Fb `B;?i rvX "mi H2iǶb
rQ`F i?`Qm;? Bi- bBM+2 Bi KF2b 7Q`  ;`2i 2t2`+Bb2 BM `2+m`bBp2 i?BMFBM;X
h?2 BMM2` 7mM+iBQM find /Q2b i?2 +imH `2+m`bBM;X Ai iF2b irQ `;mK2Mibě
i?2 +m``2Mi MmK#2` M/  bi`BM; i?i `2+Q`/b ?Qr r2 `2+?2/ i?Bb MmK#2`ě
M/ `2im`Mb 2Bi?2`  bi`BM; i?i b?Qrb ?Qr iQ ;2i iQ i?2 i`;2i Q` nullX
hQ /Q i?Bb- i?2 7mM+iBQM T2`7Q`Kb QM2 Q7 i?`22 +iBQMbX A7 i?2 +m``2Mi
MmK#2` Bb i?2 i`;2i MmK#2`- i?2 +m``2Mi ?BbiQ`v Bb  rv iQ `2+? i?i
i`;2i- bQ Bi Bb bBKTHv `2im`M2/X A7 i?2 +m``2Mi MmK#2` Bb ;`2i2` i?M
i?2 i`;2i- i?2`2Ƕb MQ b2Mb2 BM 7m`i?2` 2tTHQ`BM; i?Bb ?BbiQ`v bBM+2 #Qi?
//BM; M/ KmHiBTHvBM; rBHH QMHv KF2 i?2 MmK#2` #B;;2`X M/ }MHHv-
B7 r2Ƕ`2 biBHH #2HQr i?2 i`;2i- i?2 7mM+iBQM i`B2b #Qi? TQbbB#H2 Ti?b i?i
bi`i 7`QK i?2 +m``2Mi MmK#2`- #v +HHBM; Bib2H7 irB+2- QM+2 7Q` 2+? Q7
i?2 HHQr2/ M2ti bi2TbX A7 i?2 }`bi +HH `2im`Mb bQK2i?BM; i?i Bb MQi
null- Bi Bb `2im`M2/X Pi?2`rBb2- i?2 b2+QM/ +HH Bb `2im`M2/ě`2;`/H2bb Q7
r?2i?2` Bi T`Q/m+2b  bi`BM; Q` nullX
hQ #2ii2` mM/2`biM/ ?Qr i?Bb 7mM+iBQM T`Q/m+2b i?2 2z2+i r2Ƕ`2 HQQF@
BM; 7Q`- H2iǶb HQQF i HH i?2 +HHb iQ find i?i `2 K/2 r?2M b2`+?BM;
7Q`  bQHmiBQM 7Q` i?2 MmK#2` RjX
find (1 , "1")
find (6 , "(1 + 5) ")
find (11 , "((1 + 5) + 5) ")
find (16 , "(((1 + 5) + 5) + 5) ")
too big

89
find (33 , "(((1 + 5) + 5) * 3) ")
too big
find (18 , "((1 + 5) * 3) ")
too big
find (3 , "(1 * 3) ")
find (8 , "((1 * 3) + 5) ")
find (13 , "(((1 * 3) + 5) + 5) ")
found !

h?2 BM/2MiiBQM bm;;2bib i?2 /2Ti? Q7 i?2 +HH bi+FX h?2 }`bi iBK2 find
Bb +HH2/ Bi +HHb Bib2H7 irB+2 iQ 2tTHQ`2 i?2 bQHmiBQMb i?i bi`i rBi? (1 + 5)
M/ (1 * 3)X h?2 }`bi +HH i`B2b iQ }M/  bQHmiBQM i?i bi`ib rBi? (1 + 5)
M/- mbBM; `2+m`bBQM- 2tTHQ`2b 2p2`v bQHmiBQM i?i vB2H/b  MmK#2` H2bb
i?M Q` 2[mH iQ i?2 i`;2i MmK#2`X aBM+2 Bi /Q2bMǶi }M/  bQHmiBQM i?i
?Bib i?2 i`;2i- Bi `2im`Mb null #+F iQ i?2 }`bi +HHX h?2`2 i?2 || QT2`iQ`
+mb2b i?2 +HH i?i 2tTHQ`2b (1 * 3) iQ ?TT2MX h?Bb b2`+? ?b KQ`2
Hm+F #2+mb2 Bib }`bi `2+m`bBp2 +HH- i?`Qm;? v2i MQi?2` `2+m`bBp2 +HH-
?Bib mTQM i?2 i`;2i MmK#2`- RjX h?Bb BMM2`KQbi `2+m`bBp2 +HH `2im`Mb
 bi`BM;- M/ 2+? Q7 i?2 || QT2`iQ`b BM i?2 BMi2`K2/Bi2 +HHb Tbb i?i
bi`BM; HQM;- mHiBKi2Hv `2im`MBM; Qm` bQHmiBQMX

:`QrBM; 7mM+iBQMb
h?2`2 `2 irQ KQ`2 Q` H2bb Mim`H rvb 7Q` 7mM+iBQMb iQ #2 BMi`Q/m+2/
BMiQ T`Q;`KbX
h?2 }`bi Bb i?i vQm }M/ vQm`b2H7 r`BiBM; p2`v bBKBH` +Q/2 KmHiBTH2
iBK2bX q2 rMi iQ pQB/ /QBM; i?i bBM+2 ?pBM; KQ`2 +Q/2 K2Mb KQ`2
bT+2 7Q` KBbiF2b iQ ?B/2 M/ KQ`2 Ki2`BH iQ `2/ 7Q` T2QTH2 i`vBM;
iQ mM/2`biM/ i?2 T`Q;`KX aQ r2 iF2 i?2 `2T2i2/ 7mM+iBQMHBiv- }M/
 ;QQ/ MK2 7Q` Bi- M/ Tmi Bi BMiQ  7mM+iBQMX
h?2 b2+QM/ rv Bb i?i vQm }M/ vQm M22/ bQK2 7mM+iBQMHBiv i?i vQm
?p2MǶi r`Bii2M v2i M/ i?i bQmM/b HBF2 Bi /2b2`p2b Bib QrM 7mM+iBQMX
uQmǶHH bi`i #v MKBM; i?2 7mM+iBQM- M/ vQmǶHH i?2M r`Bi2 Bib #Q/vX uQm
KB;?i 2p2M bi`i r`BiBM; +Q/2 i?i mb2b i?2 7mM+iBQM #27Q`2 vQm +imHHv
/2}M2 i?2 7mM+iBQM Bib2H7X
>Qr /B{+mHi Bi Bb iQ }M/  ;QQ/ MK2 7Q`  7mM+iBQM Bb  ;QQ/ BM/B+iBQM
Q7 ?Qr +H2`  +QM+2Ti Bi Bb i?i vQmǶ`2 i`vBM; iQ r`TX G2iǶb ;Q i?`Qm;?

88
M 2tKTH2X
q2 rMi iQ r`Bi2  T`Q;`K i?i T`BMib irQ MmK#2`b- i?2 MmK#2`b
Q7 +Qrb M/ +?B+F2Mb QM  7`K- rBi? i?2 rQ`/b Cows M/ Chickens 7i2`
i?2K- M/ x2`Qb T//2/ #27Q`2 #Qi? MmK#2`b bQ i?i i?2v `2 Hrvb
i?`22 /B;Bib HQM;X
007 Cows
011 Chickens

h?i +H2`Hv bFb 7Q`  7mM+iBQM Q7 irQ `;mK2MibX G2iǶb ;2i +Q/BM;X
function printFarmInventory ( cows , chickens ) {
var cowString = String ( cows );
while ( cowString . length < 3)
cowString = "0" + cowString ;
console . log ( cowString + " Cows ") ;
var chickenString = String ( chickens ) ;
while ( chickenString . length < 3)
chickenString = "0" + chickenString ;
console . log ( chickenString + " Chickens ") ;
}
printFarmInventory (7 , 11) ;

//BM; .length 7i2`  bi`BM; pHm2 rBHH ;Bp2 mb i?2 H2M;i? Q7 i?i bi`BM;X
h?mb- i?2 while HQQTb F22T //BM; x2`Qb BM 7`QMi Q7 i?2 MmK#2` bi`BM;b
mMiBH i?2v `2 i H2bi i?`22 +?`+i2`b HQM;X
JBbbBQM ++QKTHBb?2/5 "mi Dmbi b r2 `2 #Qmi iQ b2M/ i?2 7`K2`
i?2 +Q/2 UHQM; rBi?  ?27iv BMpQB+2- Q7 +Qm`b2V- ?2 +HHb M/ i2HHb mb ?2Ƕb
HbQ bi`i2/ F22TBM; TB;b- M/ +QmH/MǶi r2 TH2b2 2ti2M/ i?2 bQ7ir`2 iQ
HbQ T`BMi TB;b\
q2 bm`2 +MX "mi Dmbi b r2Ƕ`2 BM i?2 T`Q+2bb Q7 +QTvBM; M/ TbiBM;
i?Qb2 7Qm` HBM2b QM2 KQ`2 iBK2- r2 biQT M/ `2+QMbB/2`X h?2`2 ?b iQ #2
 #2ii2` rvX >2`2Ƕb  }`bi ii2KTi,
function printZeroPaddedWithLabel ( number , label ) {
var numberString = String ( number ) ;
while ( numberString . length < 3)
numberString = "0" + numberString ;
console . log ( numberString + " " + label ) ;
}

8e
function printFarmInventory ( cows , chickens , pigs ) {
printZeroPaddedWithLabel ( cows , " Cows ") ;
printZeroPaddedWithLabel ( chickens , " Chickens ") ;
printZeroPaddedWithLabel ( pigs , " Pigs ") ;
}

printFarmInventory (7 , 11 , 3) ;

Ai rQ`Fb5 "mi i?i MK2- printZeroPaddedWithLabel- Bb  HBiiH2 rFr`/X Ai


+QM~i2b i?`22 i?BM;běT`BMiBM;- x2`Q@T//BM;- M/ //BM;  H#2HěBMiQ
 bBM;H2 7mM+iBQMX
AMbi2/ Q7 HB7iBM; Qmi i?2 `2T2i2/ T`i Q7 Qm` T`Q;`K r?QH2bH2- H2iǶb
i`v iQ TB+F Qmi  bBM;H2 +QM+2TiX
function zeroPad ( number , width ) {
var string = String ( number ) ;
while ( string . length < width )
string = "0" + string ;
return string ;
}

function printFarmInventory ( cows , chickens , pigs ) {


console . log ( zeroPad ( cows , 3) + " Cows ") ;
console . log ( zeroPad ( chickens , 3) + " Chickens ") ;
console . log ( zeroPad ( pigs , 3) + " Pigs ") ;
}

printFarmInventory (7 , 16 , 3) ;

 7mM+iBQM rBi?  MB+2- Q#pBQmb MK2 HBF2 zeroPad KF2b Bi 2bB2` 7Q`
bQK2QM2 r?Q `2/b i?2 +Q/2 iQ };m`2 Qmi r?i Bi /Q2bX M/ Bi Bb mb27mH
BM KQ`2 bBimiBQMb i?M Dmbi i?Bb bT2+B}+ T`Q;`KX 6Q` 2tKTH2- vQm
+QmH/ mb2 Bi iQ ?2HT T`BMi MB+2Hv HB;M2/ i#H2b Q7 MmK#2`bX
>Qr bK`i M/ p2`biBH2 b?QmH/ Qm` 7mM+iBQM #2\ q2 +QmH/ r`Bi2 Mv@
i?BM; 7`QK  i2``B#Hv bBKTH2 7mM+iBQM i?i bBKTHv T/b  MmK#2` bQ
i?i BiǶb i?`22 +?`+i2`b rB/2 iQ  +QKTHB+i2/ ;2M2`HBx2/ MmK#2`@
7Q`KiiBM; bvbi2K i?i ?M/H2b 7`+iBQMH MmK#2`b- M2;iBp2 MmK#2`b-
HB;MK2Mi Q7 /Qib- T//BM; rBi? /Bz2`2Mi +?`+i2`b- M/ bQ QMX
 mb27mH T`BM+BTH2 Bb MQi iQ // +H2p2`M2bb mMH2bb vQm `2 #bQHmi2Hv bm`2
vQmǶ`2 ;QBM; iQ M22/ BiX Ai +M #2 i2KTiBM; iQ r`Bi2 ;2M2`H dz7`K2rQ`FbǴ
7Q` 2p2`v HBiiH2 #Bi Q7 7mM+iBQMHBiv vQm +QK2 +`QbbX _2bBbi i?i m`;2X uQm

8d
rQMǶi ;2i Mv `2H rQ`F /QM2- M/ vQmǶHH 2M/ mT r`BiBM;  HQi Q7 +Q/2
i?i MQ QM2 rBHH 2p2` mb2X

6mM+iBQMb M/ bB/2 2z2+ib


6mM+iBQMb +M #2 `Qm;?Hv /BpB/2/ BMiQ i?Qb2 i?i `2 +HH2/ 7Q` i?2B` bB/2
2z2+ib M/ i?Qb2 i?i `2 +HH2/ 7Q` i?2B` `2im`M pHm2X Uh?Qm;? Bi Bb
/2}MBi2Hv HbQ TQbbB#H2 iQ ?p2 #Qi? bB/2 2z2+ib M/ `2im`M  pHm2XV
h?2 }`bi ?2HT2` 7mM+iBQM BM i?2 7`K 2tKTH2- printZeroPaddedWithLabel-
Bb +HH2/ 7Q` Bib bB/2 2z2+i, Bi T`BMib  HBM2X h?2 b2+QM/ p2`bBQM- zeroPad- Bb
+HH2/ 7Q` Bib `2im`M pHm2X Ai Bb MQ +QBM+B/2M+2 i?i i?2 b2+QM/ Bb mb27mH
BM KQ`2 bBimiBQMb i?M i?2 }`biX 6mM+iBQMb i?i +`2i2 pHm2b `2 2bB2`
iQ +QK#BM2 BM M2r rvb i?M 7mM+iBQMb i?i /B`2+iHv T2`7Q`K bB/2 2z2+ibX
 Tm`2 7mM+iBQM Bb  bT2+B}+ FBM/ Q7 pHm2@T`Q/m+BM; 7mM+iBQM i?i MQi
QMHv ?b MQ bB/2 2z2+ib #mi HbQ /Q2bMǶi `2Hv QM bB/2 2z2+ib 7`QK Qi?2`
+Q/2ě7Q` 2tKTH2- Bi /Q2bMǶi `2/ ;HQ#H p`B#H2b i?i `2 Q++bBQMHHv
+?M;2/ #v Qi?2` +Q/2X  Tm`2 7mM+iBQM ?b i?2 TH2bMi T`QT2`iv i?i-
r?2M +HH2/ rBi? i?2 bK2 `;mK2Mib- Bi Hrvb T`Q/m+2b i?2 bK2 pHm2
UM/ /Q2bMǶi /Q Mvi?BM; 2Hb2VX h?Bb KF2b Bi 2bv iQ `2bQM #QmiX 
+HH iQ bm+?  7mM+iBQM +M #2 K2MiHHv bm#biBimi2/ #v Bib `2bmHi- rBi?Qmi
+?M;BM; i?2 K2MBM; Q7 i?2 +Q/2X q?2M vQm `2 MQi bm`2 i?i  Tm`2
7mM+iBQM Bb rQ`FBM; +Q``2+iHv- vQm +M i2bi Bi #v bBKTHv +HHBM; Bi- M/
FMQr i?i B7 Bi rQ`Fb BM i?i +QMi2ti- Bi rBHH rQ`F BM Mv +QMi2tiX LQM@
Tm`2 7mM+iBQMb KB;?i `2im`M /Bz2`2Mi pHm2b #b2/ QM HH FBM/b Q7 7+iQ`b
M/ ?p2 bB/2 2z2+ib i?i KB;?i #2 ?`/ iQ i2bi M/ i?BMF #QmiX
aiBHH- i?2`2Ƕb MQ M22/ iQ 722H #/ r?2M r`BiBM; 7mM+iBQMb i?i `2 MQi
Tm`2 Q` iQ r;2  ?QHv r` iQ Tm`;2 i?2K 7`QK vQm` +Q/2X aB/2 2z2+ib
`2 Q7i2M mb27mHX h?2`2Ƕ/ #2 MQ rv iQ r`Bi2  Tm`2 p2`bBQM Q7 console
.log- 7Q` 2tKTH2- M/ console.log Bb +2`iBMHv mb27mHX aQK2 QT2`iBQMb
`2 HbQ 2bB2` iQ 2tT`2bb BM M 2{+B2Mi rv r?2M r2 mb2 bB/2 2z2+ib- bQ
+QKTmiBM; bT22/ +M #2  `2bQM iQ pQB/ Tm`BivX

amKK`v
h?Bb +?Ti2` im;?i vQm ?Qr iQ r`Bi2 vQm` QrM 7mM+iBQMbX h?2 function
F2vrQ`/- r?2M mb2/ b M 2tT`2bbBQM- +M +`2i2  7mM+iBQM pHm2X q?2M

83
mb2/ b  bii2K2Mi- Bi +M #2 mb2/ iQ /2+H`2  p`B#H2 M/ ;Bp2 Bi 
7mM+iBQM b Bib pHm2X
// Create a function value f
var f = function ( a ) {
console . log ( a + 2) ;
};

// Declare g to be a function
function g (a , b) {
return a * b * 3.5;
}

 F2v bT2+i BM mM/2`biM/BM; 7mM+iBQMb Bb mM/2`biM/BM; HQ+H b+QT2bX


S`K2i2`b M/ p`B#H2b /2+H`2/ BMbB/2  7mM+iBQM `2 HQ+H iQ i?2 7mM+@
iBQM- `2@+`2i2/ 2p2`v iBK2 i?2 7mM+iBQM Bb +HH2/- M/ MQi pBbB#H2 7`QK
i?2 QmibB/2X 6mM+iBQMb /2+H`2/ BMbB/2 MQi?2` 7mM+iBQM ?p2 ++2bb iQ
i?2 Qmi2` 7mM+iBQMǶb HQ+H b+QT2X
a2T`iBM; i?2 ibFb vQm` T`Q;`K T2`7Q`Kb BMiQ /Bz2`2Mi 7mM+iBQMb Bb
?2HT7mHX uQm rQMǶi ?p2 iQ `2T2i vQm`b2H7 b Km+?- M/ 7mM+iBQMb +M
KF2  T`Q;`K KQ`2 `2/#H2 #v ;`QmTBM; +Q/2 BMiQ +QM+2TimH +?mMFb-
BM i?2 bK2 rv i?i +?Ti2`b M/ b2+iBQMb ?2HT Q`;MBx2 `2;mH` i2tiX

1t2`+Bb2b
JBMBKmK
h?2 T`2pBQmb +?Ti2` BMi`Q/m+2/ i?2 biM/`/ 7mM+iBQM Math.min i?i `2@
im`Mb Bib bKHH2bi `;mK2MiX q2 +M /Q i?i Qm`b2Hp2b MQrX q`Bi2 
7mM+iBQM min i?i iF2b irQ `;mK2Mib M/ `2im`Mb i?2B` KBMBKmKX

_2+m`bBQM
q2Ƕp2 b22M i?i % Ui?2 `2KBM/2` QT2`iQ`V +M #2 mb2/ iQ i2bi r?2i?2`
 MmK#2` Bb 2p2M Q` Q// #v mbBM; % 2 iQ +?2+F r?2i?2` BiǶb /BpBbB#H2 #v
irQX >2`2Ƕb MQi?2` rv iQ /2}M2 r?2i?2`  TQbBiBp2 r?QH2 MmK#2` Bb
2p2M Q` Q//,

Ç w2`Q Bb 2p2MX

8N
Ç PM2 Bb Q//X

Ç 6Q` Mv Qi?2` MmK#2` L- Bib 2p2MM2bb Bb i?2 bK2 b L @ kX

.2}M2  `2+m`bBp2 7mM+iBQM isEven +Q``2bTQM/BM; iQ i?Bb /2b+`BTiBQMX h?2


7mM+iBQM b?QmH/ ++2Ti  number T`K2i2` M/ `2im`M  "QQH2MX
h2bi Bi QM 8y M/ d8X a22 ?Qr Bi #2?p2b QM @RX q?v\ *M vQm i?BMF
Q7  rv iQ }t i?Bb\

"2M +QmMiBM;
uQm +M ;2i i?2 Li? +?`+i2`- Q` H2ii2`- 7`QK  bi`BM; #v r`BiBM; "string".
charAt(N)- bBKBH` iQ ?Qr vQm ;2i Bib H2M;i? rBi? "s".lengthX h?2 `2im`M2/
pHm2 rBHH #2  bi`BM; +QMiBMBM; QMHv QM2 +?`+i2` U7Q` 2tKTH2- "b"
VX h?2 }`bi +?`+i2` ?b TQbBiBQM x2`Q- r?B+? +mb2b i?2 Hbi QM2 iQ
#2 7QmM/ i TQbBiBQM string.length - 1X AM Qi?2` rQ`/b-  irQ@+?`+i2`
bi`BM; ?b H2M;i? k- M/ Bib +?`+i2`b ?p2 TQbBiBQMb y M/ RX
q`Bi2  7mM+iBQM countBs i?i iF2b  bi`BM; b Bib QMHv `;mK2Mi M/
`2im`Mb  MmK#2` i?i BM/B+i2b ?Qr KMv mTT2`+b2 dz"Ǵ +?`+i2`b `2
BM i?2 bi`BM;X
L2ti- r`Bi2  7mM+iBQM +HH2/ countChar i?i #2?p2b HBF2 countBs- 2t+2Ti
Bi iF2b  b2+QM/ `;mK2Mi i?i BM/B+i2b i?2 +?`+i2` i?i Bb iQ #2
+QmMi2/ U`i?2` i?M +QmMiBM; QMHv mTT2`+b2 dz"Ǵ +?`+i2`bVX _2r`Bi2
countBs iQ KF2 mb2 Q7 i?Bb M2r 7mM+iBQMX

ey
dzPM irQ Q++bBQMb A ?p2 #22M bF2/- ǵS`v- J`X "##;2- B7
vQm Tmi BMiQ i?2 K+?BM2 r`QM; };m`2b- rBHH i?2 `B;?i Mbr2`b
+QK2 Qmi\Ƕ (Ę) A K MQi #H2 `B;?iHv iQ TT`2?2M/ i?2 FBM/ Q7
+QM7mbBQM Q7 B/2b i?i +QmH/ T`QpQF2 bm+?  [m2biBQMXǴ
ě*?`H2b "##;2- Sbb;2b 7`QK i?2 GB72 Q7  S?BHQbQT?2`
UR3e9V

9 .i ai`m+im`2b, P#D2+ib M/


``vb
LmK#2`b- "QQH2Mb- M/ bi`BM;b `2 i?2 #`B+Fb i?i /i bi`m+im`2b `2
#mBHi 7`QKX "mi vQm +MǶi KF2 Km+? Q7  ?Qmb2 Qmi Q7  bBM;H2 #`B+FX
P#D2+ib HHQr mb iQ ;`QmT pHm2běBM+Hm/BM; Qi?2` Q#D2+iběiQ;2i?2` M/
i?mb #mBH/ KQ`2 +QKTH2t bi`m+im`2bX
h?2 T`Q;`Kb r2 ?p2 #mBHi bQ 7` ?p2 #22M b2`BQmbHv ?KT2`2/ #v i?2
7+i i?i i?2v r2`2 QT2`iBM; QMHv QM bBKTH2 /i ivT2bX h?Bb +?Ti2`
rBHH //  #bB+ mM/2`biM/BM; Q7 /i bi`m+im`2b iQ vQm` iQQHFBiX "v i?2
2M/ Q7 Bi- vQmǶHH FMQr 2MQm;? iQ bi`i r`BiBM; bQK2 mb27mH T`Q;`KbX
h?2 +?Ti2` rBHH rQ`F i?`Qm;?  KQ`2 Q` H2bb `2HBbiB+ T`Q;`KKBM;
2tKTH2- BMi`Q/m+BM; +QM+2Tib b i?2v TTHv iQ i?2 T`Q#H2K i ?M/X
h?2 2tKTH2 +Q/2 rBHH Q7i2M #mBH/ QM 7mM+iBQMb M/ p`B#H2b i?i r2`2
BMi`Q/m+2/ 2`HB2` BM i?2 i2tiX
h?2 QMHBM2 +Q/BM; bM/#Qt 7Q` i?2 #QQF U2HQ[m2MiDpb+`BTiXM2if+Q/2V
T`QpB/2b  rv iQ `mM +Q/2 BM i?2 +QMi2ti Q7  bT2+B}+ +?Ti2`X A7 vQm
/2+B/2 iQ rQ`F i?`Qm;? i?2 2tKTH2b BM MQi?2` 2MpB`QMK2Mi- #2 bm`2 iQ
}`bi /QrMHQ/ i?2 7mHH +Q/2 7Q` i?Bb +?Ti2` 7`QK i?2 bM/#Qt T;2X

h?2 r2`2b[mB``2H
1p2`v MQr M/ i?2M- mbmHHv #2ir22M 2B;?i M/ i2M BM i?2 2p2MBM;-
C+[m2b }M/b ?BKb2H7 i`Mb7Q`KBM; BMiQ  bKHH 7m``v `Q/2Mi rBi?  #mb?v
iBHX
PM QM2 ?M/- C+[m2b Bb [mBi2 ;H/ i?i ?2 /Q2bMǶi ?p2 +HbbB+ Hv@
+Mi?`QTvX hm`MBM; BMiQ  b[mB``2H i2M/b iQ +mb2 72r2` T`Q#H2Kb i?M
im`MBM; BMiQ  rQH7X AMbi2/ Q7 ?pBM; iQ rQ``v #Qmi ++B/2MiHHv 2iBM;
i?2 M2B;?#Q` Ui?i rQmH/ #2 rFr`/V- ?2 rQ``B2b #Qmi #2BM; 2i2M #v
i?2 M2B;?#Q`Ƕb +iX 7i2` irQ Q++bBQMb r?2`2 ?2 rQF2 mT QM  T`2+`B@

eR
QmbHv i?BM #`M+? BM i?2 +`QrM Q7 M QF- MF2/ M/ /BbQ`B2Mi2/- ?2 ?b
iF2M iQ HQ+FBM; i?2 /QQ`b M/ rBM/Qrb Q7 ?Bb `QQK i MB;?i M/ TmiiBM;
 72r rHMmib QM i?2 ~QQ` iQ F22T ?BKb2H7 #mbvX

h?i iF2b +`2 Q7 i?2 +i M/ QF T`Q#H2KbX "mi C+[m2b biBHH bmz2`b
7`QK ?Bb +QM/BiBQMX h?2 B``2;mH` Q++m``2M+2b Q7 i?2 i`Mb7Q`KiBQM KF2
?BK bmbT2+i i?i i?2v KB;?i #2 i`B;;2`2/ #v bQK2i?BM;X 6Q`  r?BH2- ?2
#2HB2p2/ i?i Bi ?TT2M2/ QMHv QM /vb r?2M ?2 ?/ iQm+?2/ i`22bX aQ
?2 biQTT2/ iQm+?BM; i`22b 2MiB`2Hv M/ 2p2M pQB/2/ ;QBM; M2` i?2KX
"mi i?2 T`Q#H2K T2`bBbi2/X
arBi+?BM; iQ  KQ`2 b+B2MiB}+ TT`Q+?- C+[m2b BMi2M/b iQ bi`i F22T@
BM;  /BHv HQ; Q7 2p2`vi?BM; ?2 /B/ i?i /v M/ r?2i?2` ?2 +?M;2/
7Q`KX qBi? i?Bb /i ?2 ?QT2b iQ M``Qr /QrM i?2 +QM/BiBQMb i?i i`B;@
;2` i?2 i`Mb7Q`KiBQMbX
h?2 }`bi i?BM; ?2 /Q2b Bb /2bB;M  /i bi`m+im`2 iQ biQ`2 i?Bb BM7Q`@
KiBQMX

.i b2ib
hQ rQ`F rBi?  +?mMF Q7 /B;BiH /i- r2ǶHH }`bi ?p2 iQ }M/  rv iQ
`2T`2b2Mi Bi BM Qm` K+?BM2Ƕb K2KQ`vX av- b  bBKTH2 2tKTH2- i?i r2
rMi iQ `2T`2b2Mi  +QHH2+iBQM Q7 MmK#2`b, k- j- 8- d- M/ RRX
q2 +QmH/ ;2i +`2iBp2 rBi? bi`BM;bě7i2` HH- bi`BM;b +M #2 Mv H2M;i?-
bQ r2 +M Tmi  HQi Q7 /i BMiQ i?2KěM/ mb2 "2 3 5 7 11" b Qm` `2T@
`2b2MiiBQMX "mi i?Bb Bb rFr`/X uQmǶ/ ?p2 iQ bQK2?Qr 2ti`+i i?2
/B;Bib M/ +QMp2`i i?2K #+F iQ MmK#2`b iQ ++2bb i?2KX

ek
6Q`imMi2Hv- Cpa+`BTi T`QpB/2b  /i ivT2 bT2+B}+HHv 7Q` biQ`BM;
b2[m2M+2b Q7 pHm2bX Ai Bb +HH2/ M ``v M/ Bb r`Bii2M b  HBbi Q7 pHm2b
#2ir22M b[m`2 #`+F2ib- b2T`i2/ #v +QKKbX
var listOfNumbers = [2 , 3 , 5 , 7, 11];
console . log ( listOfNumbers [1]) ;
// → 3
console . log ( listOfNumbers [1 - 1]) ;
// → 2

h?2 MQiiBQM 7Q` ;2iiBM; i i?2 2H2K2Mib BMbB/2 M ``v HbQ mb2b b[m`2
#`+F2ibX  TB` Q7 b[m`2 #`+F2ib BKK2/Bi2Hv 7i2` M 2tT`2bbBQM- rBi?
MQi?2` 2tT`2bbBQM BMbB/2 Q7 i?2K- rBHH HQQF mT i?2 2H2K2Mi BM i?2 H27i@
?M/ 2tT`2bbBQM i?i +Q``2bTQM/b iQ i?2 BM/2t ;Bp2M #v i?2 2tT`2bbBQM
BM i?2 #`+F2ibX
h?2 }`bi BM/2t Q7 M ``v Bb x2`Q- MQi QM2X aQ i?2 }`bi 2H2K2Mi +M #2
`2/ rBi? listOfNumbers[0]X A7 vQm /QMǶi ?p2  T`Q;`KKBM; #+F;`QmM/-
i?Bb +QMp2MiBQM KB;?i iF2 bQK2 ;2iiBM; mb2/ iQX "mi x2`Q@#b2/ +QmMi@
BM; ?b  HQM; i`/BiBQM BM i2+?MQHQ;v- M/ b HQM; b i?Bb +QMp2MiBQM Bb
7QHHQr2/ +QMbBbi2MiHv Ur?B+? Bi Bb- BM Cpa+`BTiV- Bi rQ`Fb r2HHX

S`QT2`iB2b
q2Ƕp2 b22M  72r bmbTB+BQmb@HQQFBM; 2tT`2bbBQMb HBF2 myString.length UiQ
;2i i?2 H2M;i? Q7  bi`BM;V M/ Math.max Ui?2 KtBKmK 7mM+iBQMV BM Tbi
2tKTH2bX h?2b2 `2 2tT`2bbBQMb i?i ++2bb  T`QT2`iv Q7 bQK2 pHm2X
AM i?2 }`bi +b2- r2 ++2bb i?2 length T`QT2`iv Q7 i?2 pHm2 BM myStringX AM
i?2 b2+QM/- r2 ++2bb i?2 T`QT2`iv MK2/ max BM i?2 Math Q#D2+i Ur?B+?
Bb  +QHH2+iBQM Q7 Ki?2KiB+b@`2Hi2/ pHm2b M/ 7mM+iBQMbVX
HKQbi HH Cpa+`BTi pHm2b ?p2 T`QT2`iB2bX h?2 2t+2TiBQMb `2 null
M/ undefinedX A7 vQm i`v iQ ++2bb  T`QT2`iv QM QM2 Q7 i?2b2 MQMpHm2b-
vQm ;2i M 2``Q`X
null . length ;
// → TypeError : Cannot read property length of null

h?2 irQ KQbi +QKKQM rvb iQ ++2bb T`QT2`iB2b BM Cpa+`BTi `2 rBi? 
/Qi M/ rBi? b[m`2 #`+F2ibX "Qi? value.x M/ value[x] ++2bb  T`QT2`iv
QM valueě#mi MQi M2+2bb`BHv i?2 bK2 T`QT2`ivX h?2 /Bz2`2M+2 Bb BM ?Qr

ej
x Bb BMi2`T`2i2/X q?2M mbBM;  /Qi- i?2 T`i 7i2` i?2 /Qi Kmbi #2  pHB/
p`B#H2 MK2- M/ Bi /B`2+iHv MK2b i?2 T`QT2`ivX q?2M mbBM; b[m`2
#`+F2ib- i?2 2tT`2bbBQM #2ir22M i?2 #`+F2ib Bb 2pHmi2/ iQ ;2i i?2
T`QT2`iv MK2X q?2`2b value.x 72i+?2b i?2 T`QT2`iv Q7 value MK2/
dztǴ- value[x] i`B2b iQ 2pHmi2 i?2 2tT`2bbBQM x M/ mb2b i?2 `2bmHi b i?2
T`QT2`iv MK2X
aQ B7 vQm FMQr i?i i?2 T`QT2`iv vQm `2 BMi2`2bi2/ BM Bb +HH2/ dzH2M;i?Ǵ-
vQm bv value.lengthX A7 vQm rMi iQ 2ti`+i i?2 T`QT2`iv MK2/ #v i?2
pHm2 ?2H/ BM i?2 p`B#H2 i- vQm bv value[i]X M/ #2+mb2 T`QT2`iv
MK2b +M #2 Mv bi`BM;- B7 vQm rMi iQ ++2bb  T`QT2`iv MK2/ dzkǴ Q`
dzCQ?M .Q2Ǵ- vQm Kmbi mb2 b[m`2 #`+F2ib, value[2] Q` value["John Doe"]X
h?Bb Bb i?2 +b2 2p2M i?Qm;? vQm FMQr i?2 T`2+Bb2 MK2 Q7 i?2 T`QT2`iv
BM /pM+2- #2+mb2 M2Bi?2` dzkǴ MQ` dzCQ?M .Q2Ǵ Bb  pHB/ p`B#H2 MK2
M/ bQ +MMQi #2 ++2bb2/ i?`Qm;? /Qi MQiiBQMX
h?2 2H2K2Mib BM M ``v `2 biQ`2/ BM T`QT2`iB2bX "2+mb2 i?2 MK2b
Q7 i?2b2 T`QT2`iB2b `2 MmK#2`b M/ r2 Q7i2M M22/ iQ ;2i i?2B` MK2
7`QK  p`B#H2- r2 ?p2 iQ mb2 i?2 #`+F2i bvMit iQ ++2bb i?2KX h?2
length T`QT2`iv Q7 M ``v i2HHb mb ?Qr KMv 2H2K2Mib Bi +QMiBMbX h?Bb
T`QT2`iv MK2 Bb  pHB/ p`B#H2 MK2- M/ r2 FMQr Bib MK2 BM /pM+2-
bQ iQ }M/ i?2 H2M;i? Q7 M ``v- vQm ivTB+HHv r`Bi2 array.length #2+mb2
i?i Bb 2bB2` iQ r`Bi2 i?M array["length"]X

J2i?Q/b
"Qi? bi`BM; M/ ``v Q#D2+ib +QMiBM- BM //BiBQM iQ i?2 length T`QT2`iv-
 MmK#2` Q7 T`QT2`iB2b i?i `272` iQ 7mM+iBQM pHm2bX
var doh = " Doh ";
console . log ( typeof doh . toUpperCase );
// → function
console . log ( doh . toUpperCase () ) ;
// → DOH

1p2`v bi`BM; ?b  toUpperCase T`QT2`ivX q?2M +HH2/- Bi rBHH `2im`M 


+QTv Q7 i?2 bi`BM;- BM r?B+? HH H2ii2`b ?p2 #22M +QMp2`i2/ iQ mTT2`+b2X
h?2`2 Bb HbQ toLowerCaseX uQm +M ;m2bb r?i i?i /Q2bX
AMi2`2biBM;Hv- 2p2M i?Qm;? i?2 +HH iQ toUpperCase /Q2b MQi Tbb Mv
`;mK2Mib- i?2 7mM+iBQM bQK2?Qr ?b ++2bb iQ i?2 bi`BM; "Doh"- i?2

e9
pHm2 r?Qb2 T`QT2`iv r2 +HH2/X >Qr i?Bb rQ`Fb Bb /2b+`B#2/ BM *?Ti2`
eX
S`QT2`iB2b i?i +QMiBM 7mM+iBQMb `2 ;2M2`HHv +HH2/ K2i?Q/b Q7 i?2
pHm2 i?2v #2HQM; iQX b BM- dztoUpperCase Bb  K2i?Q/ Q7  bi`BM;ǴX
h?Bb 2tKTH2 /2KQMbi`i2b bQK2 K2i?Q/b i?i ``v Q#D2+ib ?p2,
var mack = [];
mack . push (" Mack ") ;
mack . push (" the " , " Knife ") ;
console . log ( mack ) ;
// → [" Mack " , " the " , " Knife "]
console . log ( mack . join (" ") ) ;
// → Mack the Knife
console . log ( mack . pop () ) ;
// → Knife
console . log ( mack ) ;
// → [" Mack " , " the "]

h?2 push K2i?Q/ +M #2 mb2/ iQ // pHm2b iQ i?2 2M/ Q7 M ``vX h?2
pop K2i?Q/ /Q2b i?2 QTTQbBi2, Bi `2KQp2b i?2 pHm2 i i?2 2M/ Q7 i?2
``v M/ `2im`Mb BiX M ``v Q7 bi`BM;b +M #2 ~ii2M2/ iQ  bBM;H2
bi`BM; rBi? i?2 join K2i?Q/X h?2 `;mK2Mi ;Bp2M iQ join /2i2`KBM2b i?2
i2ti i?i Bb ;Hm2/ #2ir22M i?2 ``vǶb 2H2K2MibX

P#D2+ib
"+F iQ i?2 r2`2b[mB``2HX  b2i Q7 /BHv HQ; 2Mi`B2b +M #2 `2T`2b2Mi2/ b
M ``vX "mi i?2 2Mi`B2b /Q MQi +QMbBbi Q7 Dmbi  MmK#2` Q`  bi`BM;ě
2+? 2Mi`v M22/b iQ biQ`2  HBbi Q7 +iBpBiB2b M/  "QQH2M pHm2 i?i
BM/B+i2b r?2i?2` C+[m2b im`M2/ BMiQ  b[mB``2HX A/2HHv- r2 rQmH/ HBF2
iQ ;`QmT i?2b2 pHm2b iQ;2i?2` BMiQ  bBM;H2 pHm2 M/ i?2M Tmi i?2b2
;`QmT2/ pHm2b BMiQ M ``v Q7 HQ; 2Mi`B2bX
oHm2b Q7 i?2 ivT2 Q#D2+i `2 `#Bi``v +QHH2+iBQMb Q7 T`QT2`iB2b- M/ r2
+M // Q` `2KQp2 i?2b2 T`QT2`iB2b b r2 TH2b2X PM2 rv iQ +`2i2 M
Q#D2+i Bb #v mbBM;  +m`Hv #`+2 MQiiBQMX
var day1 = {
squirrel : false ,
events : [" work " , " touched tree ", " pizza " , " running " ,

e8
" television "]
};
console . log ( day1 . squirrel ) ;
// → false
console . log ( day1 . wolf ) ;
// → undefined
day1 . wolf = false ;
console . log ( day1 . wolf ) ;
// → false

AMbB/2 i?2 +m`Hv #`+2b- r2 +M ;Bp2  HBbi Q7 T`QT2`iB2b b2T`i2/ #v


+QKKbX 1+? T`QT2`iv Bb r`Bii2M b  MK2- 7QHHQr2/ #v  +QHQM- 7QH@
HQr2/ #v M 2tT`2bbBQM i?i T`QpB/2b  pHm2 7Q` i?2 T`QT2`ivX aT+2b
M/ HBM2 #`2Fb `2 MQi bB;MB}+MiX q?2M M Q#D2+i bTMb KmHiBTH2 HBM2b-
BM/2MiBM; Bi HBF2 BM i?2 T`2pBQmb 2tKTH2 BKT`Qp2b `2/#BHBivX S`QT2`@
iB2b r?Qb2 MK2b `2 MQi pHB/ p`B#H2 MK2b Q` pHB/ MmK#2`b ?p2 iQ
#2 [mQi2/X
var descriptions = {
work : " Went to work " ,
" touched tree ": " Touched a tree "
};

h?Bb K2Mb i?i +m`Hv #`+2b ?p2 irQ K2MBM;b BM Cpa+`BTiX i i?2
bi`i Q7  bii2K2Mi- i?2v bi`i  #HQ+F Q7 bii2K2MibX AM Mv Qi?2`
TQbBiBQM- i?2v /2b+`B#2 M Q#D2+iX 6Q`imMi2Hv- Bi Bb HKQbi M2p2` mb27mH
iQ bi`i  bii2K2Mi rBi?  +m`Hv@#`+2 Q#D2+i- M/ BM ivTB+H T`Q;`Kb-
i?2`2 Bb MQ K#B;mBiv #2ir22M i?2b2 irQ mb2bX
_2/BM;  T`QT2`iv i?i /Q2bMǶi 2tBbi rBHH T`Q/m+2 i?2 pHm2 undefined-
r?B+? ?TT2Mb i?2 }`bi iBK2 r2 i`v iQ `2/ i?2 wolf T`QT2`iv BM i?2
T`2pBQmb 2tKTH2X
Ai Bb TQbbB#H2 iQ bbB;M  pHm2 iQ  T`QT2`iv 2tT`2bbBQM rBi? i?2 =
QT2`iQ`X h?Bb rBHH `2TH+2 i?2 T`QT2`ivǶb pHm2 B7 Bi H`2/v 2tBbi2/ Q`
+`2i2  M2r T`QT2`iv QM i?2 Q#D2+i B7 Bi /B/MǶiX
hQ #`B2~v `2im`M iQ Qm` i2Mi+H2 KQ/2H Q7 p`B#H2 #BM/BM;běT`QT2`iv
#BM/BM;b `2 bBKBH`X h?2v ;`bT pHm2b- #mi Qi?2` p`B#H2b M/ T`QT2`@
iB2b KB;?i #2 ?QH/BM; QMiQ i?Qb2 bK2 pHm2bX uQm Kv i?BMF Q7 Q#D2+ib
b Q+iQTmb2b rBi? Mv MmK#2` Q7 i2Mi+H2b- 2+? Q7 r?B+? ?b  MK2
BMb+`B#2/ QM BiX

ee
h?2 delete QT2`iQ` +mib Qz  i2Mi+H2 7`QK bm+? M Q+iQTmbX Ai Bb 
mM`v QT2`iQ` i?i- r?2M TTHB2/ iQ  T`QT2`iv ++2bb 2tT`2bbBQM- rBHH
`2KQp2 i?2 MK2/ T`QT2`iv 7`QK i?2 Q#D2+iX h?Bb Bb MQi  +QKKQM i?BM;
iQ /Q- #mi Bi Bb TQbbB#H2X
var anObject = { left : 1 , right : 2};
console . log ( anObject . left ) ;
// → 1
delete anObject . left ;
console . log ( anObject . left ) ;
// → undefined
console . log (" left " in anObject );
// → false
console . log (" right " in anObject ) ;
// → true

h?2 #BM`v in QT2`iQ`- r?2M TTHB2/ iQ  bi`BM; M/ M Q#D2+i- `2im`Mb 


"QQH2M pHm2 i?i BM/B+i2b r?2i?2` i?i Q#D2+i ?b i?i T`QT2`ivX h?2
/Bz2`2M+2 #2ir22M b2iiBM;  T`QT2`iv iQ undefined M/ +imHHv /2H2iBM; Bi
Bb i?i- BM i?2 }`bi +b2- i?2 Q#D2+i biBHH ?b i?2 T`QT2`iv UBi Dmbi /Q2bMǶi
?p2  p2`v BMi2`2biBM; pHm2V- r?2`2b BM i?2 b2+QM/ +b2 i?2 T`QT2`iv
Bb MQ HQM;2` T`2b2Mi M/ in rBHH `2im`M falseX
``vb- i?2M- `2 Dmbi  FBM/ Q7 Q#D2+i bT2+BHBx2/ 7Q` biQ`BM; b2[m2M+2b
Q7 i?BM;bX A7 vQm 2pHmi2 typeof [1, 2]- i?Bb T`Q/m+2b "object"X uQm +M
b22 i?2K b HQM;- ~i Q+iQTmb2b rBi? HH i?2B` `Kb BM  M2i `Qr- H#2H2/
rBi? MmK#2`bX

ed
aQ r2 +M `2T`2b2Mi C+[m2bǶ DQm`MH b M ``v Q7 Q#D2+ibX
var journal = [
{ events : [" work " , " touched tree ", " pizza ",
" running " , " television "] ,
squirrel : false } ,
{ events : [" work " , " ice cream " , " cauliflower ",
" lasagna " , " touched tree " , " brushed teeth "] ,
squirrel : false } ,
{ events : [" weekend " , " cycling " , " break ",
" peanuts " , " beer "] ,
squirrel : true } ,
/* and so on ... */
];

Jmi#BHBiv
q2 rBHH ;2i iQ +imH T`Q;`KKBM; `2H bQQM MQrX "mi }`bi- i?2`2Ƕb QM2
Hbi TB2+2 Q7 i?2Q`v iQ mM/2`biM/X
q2Ƕp2 b22M i?i Q#D2+i pHm2b +M #2 KQ/B}2/X h?2 ivT2b Q7 pHm2b
/Bb+mbb2/ BM 2`HB2` +?Ti2`b- bm+? b MmK#2`b- bi`BM;b- M/ "QQH2Mb-
`2 HH BKKmi#H2ěBi Bb BKTQbbB#H2 iQ +?M;2 M 2tBbiBM; pHm2 Q7 i?Qb2
ivT2bX uQm +M +QK#BM2 i?2K M/ /2`Bp2 M2r pHm2b 7`QK i?2K- #mi
r?2M vQm iF2  bT2+B}+ bi`BM; pHm2- i?i pHm2 rBHH Hrvb `2KBM i?2
bK2X h?2 i2ti BMbB/2 Bi +MMQi #2 +?M;2/X A7 vQm ?p2 `272`2M+2 iQ 
bi`BM; i?i +QMiBMb "cat"- Bi Bb MQi TQbbB#H2 7Q` Qi?2` +Q/2 iQ +?M;2 

e3
+?`+i2` BM i?i bi`BM; iQ KF2 Bi bT2HH "rat"X
qBi? Q#D2+ib- QM i?2 Qi?2` ?M/- i?2 +QMi2Mi Q7  pHm2 +M #2 KQ/B}2/
#v +?M;BM; Bib T`QT2`iB2bX
q?2M r2 ?p2 irQ MmK#2`b- Rky M/ Rky- r2 +M +QMbB/2` i?2K T`2@
+Bb2Hv i?2 bK2 MmK#2`- r?2i?2` Q` MQi i?2v `272` iQ i?2 bK2 T?vbB+H
#BibX "mi rBi? Q#D2+ib- i?2`2 Bb  /Bz2`2M+2 #2ir22M ?pBM; irQ `272`@
2M+2b iQ i?2 bK2 Q#D2+i M/ ?pBM; irQ /Bz2`2Mi Q#D2+ib i?i +QMiBM
i?2 bK2 T`QT2`iB2bX *QMbB/2` i?2 7QHHQrBM; +Q/2,
var object1 = { value : 10};
var object2 = object1 ;
var object3 = { value : 10};

console . log ( object1 == object2 );


// → true
console . log ( object1 == object3 );
// → false

object1 . value = 15;


console . log ( object2 . value ) ;
// → 15
console . log ( object3 . value ) ;
// → 10

h?2 object1 M/ object2 p`B#H2b ;`bT i?2 bK2 Q#D2+i- r?B+? Bb r?v
+?M;BM; object1 HbQ +?M;2b i?2 pHm2 Q7 object2X h?2 p`B#H2 object3
TQBMib iQ  /Bz2`2Mi Q#D2+i- r?B+? BMBiBHHv +QMiBMb i?2 bK2 T`QT2`iB2b
b object1 #mi HBp2b  b2T`i2 HB72X
Cpa+`BTiǶb == QT2`iQ`- r?2M +QKT`BM; Q#D2+ib- rBHH `2im`M true QMHv
B7 #Qi? Q#D2+ib `2 T`2+Bb2Hv i?2 bK2 pHm2X *QKT`BM; /Bz2`2Mi Q#D2+ib
rBHH `2im`M false- 2p2M B7 i?2v ?p2 B/2MiB+H +QMi2MibX h?2`2 Bb MQ dz/22TǴ
+QKT`BbQM QT2`iBQM #mBHi BMiQ Cpa+`BTi- r?B+? HQQFb i Q#D2+iǶb +QM@
i2Mib- #mi Bi Bb TQbbB#H2 iQ r`Bi2 Bi vQm`b2H7 Ur?B+? rBHH #2 QM2 Q7 i?2
2t2`+Bb2b i i?2 2M/ Q7 i?Bb +?Ti2`VX

h?2 Hv+Mi?`QT2Ƕb HQ;


aQ C+[m2b bi`ib mT ?Bb Cpa+`BTi BMi2`T`2i2` M/ b2ib mT i?2 2MpB`QM@
K2Mi ?2 M22/b iQ F22T ?Bb DQm`MHX

eN
var journal = [];

function addEntry ( events , didITurnIntoASquirrel ) {


journal . push ({
events : events ,
squirrel : didITurnIntoASquirrel
}) ;
}

M/ i?2M- 2p2`v 2p2MBM; i i2MěQ` bQK2iBK2b i?2 M2ti KQ`MBM;- 7i2`
+HBK#BM; /QrM 7`QK i?2 iQT b?2H7 Q7 ?Bb #QQF+b2ě?2 `2+Q`/b i?2 /vX
addEntry ([" work " , " touched tree ", " pizza ", " running ",
" television "] , false ) ;
addEntry ([" work " , " ice cream " , " cauliflower ", " lasagna ",
" touched tree ", " brushed teeth "] , false ) ;
addEntry ([" weekend " , " cycling ", " break ", " peanuts ",
" beer "] , true );

PM+2 ?2 ?b 2MQm;? /i TQBMib- ?2 BMi2M/b iQ +QKTmi2 i?2 +Q``2HiBQM


#2ir22M ?Bb b[mB``2HB}+iBQM M/ 2+? Q7 i?2 /vǶb 2p2Mib M/ B/2HHv
H2`M bQK2i?BM; mb27mH 7`QK i?Qb2 +Q``2HiBQMbX
*Q``2HiBQM Bb  K2bm`2 Q7 /2T2M/2M+2 #2ir22M p`B#H2b Udzp`B#H2bǴ
BM i?2 biiBbiB+H b2Mb2- MQi i?2 Cpa+`BTi b2Mb2VX Ai Bb mbmHHv 2tT`2bb2/
b  +Q2{+B2Mi i?i `M;2b 7`QK @R iQ RX w2`Q +Q``2HiBQM K2Mb i?2
p`B#H2b `2 MQi `2Hi2/- r?2`2b  +Q``2HiBQM Q7 QM2 BM/B+i2b i?i i?2
irQ `2 T2`72+iHv `2Hi2/ěB7 vQm FMQr QM2- vQm HbQ FMQr i?2 Qi?2`X
L2;iBp2 QM2 HbQ K2Mb i?i i?2 p`B#H2b `2 T2`72+iHv `2Hi2/ #mi i?i
i?2v `2 QTTQbBi2běr?2M QM2 Bb i`m2- i?2 Qi?2` Bb 7Hb2X
6Q` #BM`v U"QQH2MV p`B#H2b- i?2 T?B +Q2{+B2Mi UϕV T`QpB/2b  ;QQ/
K2bm`2 Q7 +Q``2HiBQM M/ Bb `2HiBp2Hv 2bv iQ +QKTmi2X hQ +QKTmi2
ϕ- r2 M22/  i#H2 M i?i +QMiBMb i?2 MmK#2` Q7 iBK2b i?2 p`BQmb
+QK#BMiBQMb Q7 i?2 irQ p`B#H2b r2`2 Q#b2`p2/X 6Q` 2tKTH2- r2 +QmH/
iF2 i?2 2p2Mi Q7 2iBM; TBxx M/ Tmi i?i BM  i#H2 HBF2 i?Bb,

dy
No squirrel, no pizza76 No squirrel, pizza 9

Squirrel, no pizza 4 Squirrel, pizza 1

ϕ +M #2 +QKTmi2/ mbBM; i?2 7QHHQrBM; 7Q`KmH- r?2`2 M `272`b iQ i?2


i#H2,
n11 n00 − n10 n01
ϕ= √ U9XRV
n1• n0• n•1 n•0
h?2 MQiiBQM n01 BM/B+i2b i?2 MmK#2` Q7 K2bm`2K2Mib r?2`2 i?2 }`bi
p`B#H2 Ub[mB``2HM2bbV Bb 7Hb2 UyV M/ i?2 b2+QM/ p`B#H2 UTBxxV Bb i`m2
URVX AM i?Bb 2tKTH2- n01 Bb NX
h?2 pHm2 n1• `272`b iQ i?2 bmK Q7 HH K2bm`2K2Mib r?2`2 i?2 }`bi
p`B#H2 Bb i`m2- r?B+? Bb 8 BM i?2 2tKTH2 i#H2X GBF2rBb2- n•0 `272`b iQ
i?2 bmK Q7 i?2 K2bm`2K2Mib r?2`2 i?2 b2+QM/ p`B#H2 Bb 7Hb2X
aQ 7Q` i?2 TBxx i#H2- i?2 T`i #Qp2 i?2 /BpBbBQM HBM2 Ui?2 /BpB/2M/V
rQmH/ #2 R×de @ 9×N 4 9y- M/ i?2 T`i √ #2HQr Bi Ui?2 /BpBbQ`V rQmH/
#2 i?2 b[m`2 `QQi Q7 8×38×Ry×3y- Q` 340000X h?Bb +QK2b Qmi iQ ϕ ≈
yXyeN- r?B+? Bb iBMvX 1iBM; TBxx /Q2b MQi TT2` iQ ?p2 BM~m2M+2 QM
i?2 i`Mb7Q`KiBQMbX

*QKTmiBM; +Q``2HiBQM
q2 +M `2T`2b2Mi  irQ@#v@irQ i#H2 BM Cpa+`BTi rBi?  7Qm`@2H2K2Mi
``v U[76, 9, 4, 1]VX q2 +QmH/ HbQ mb2 Qi?2` `2T`2b2MiiBQMb- bm+? b
M ``v +QMiBMBM; irQ irQ@2H2K2Mi ``vb U[[76, 9], [4, 1]]V Q` M Q#@
D2+i rBi? T`QT2`iv MK2b HBF2 "11" M/ "01"- #mi i?2 ~i ``v Bb bBKTH2
M/ KF2b i?2 2tT`2bbBQMb i?i ++2bb i?2 i#H2 TH2bMiHv b?Q`iX q2ǶHH

dR
BMi2`T`2i i?2 BM/B+2b iQ i?2 ``v b irQ@#Bi #BM`v MmK#2`- r?2`2 i?2
H27iKQbi UKQbi bB;MB}+MiV /B;Bi `272`b iQ i?2 b[mB``2H p`B#H2 M/ i?2
`B;?iKQbi UH2bi bB;MB}+MiV /B;Bi `272`b iQ i?2 2p2Mi p`B#H2X 6Q` 2tK@
TH2- i?2 #BM`v MmK#2` 10 `272`b iQ i?2 +b2 r?2`2 C+[m2b /B/ im`M BMiQ
 b[mB``2H- #mi i?2 2p2Mi Ubv- ǴTBxxǴV /B/MǶi Q++m`X h?Bb ?TT2M2/ 7Qm`
iBK2bX M/ bBM+2 #BM`v 10 Bb k BM /2+BKH MQiiBQM- r2 rBHH biQ`2 i?Bb
MmK#2` i BM/2t k Q7 i?2 ``vX
h?Bb Bb i?2 7mM+iBQM i?i +QKTmi2b i?2 ϕ +Q2{+B2Mi 7`QK bm+? M ``v,
function phi ( table ) {
return ( table [3] * table [0] - table [2] * table [1]) /
Math . sqrt (( table [2] + table [3]) *
( table [0] + table [1]) *
( table [1] + table [3]) *
( table [0] + table [2]) ) ;
}

console . log ( phi ([76 , 9 , 4 , 1]) );


// → 0.068599434

h?Bb Bb bBKTHv  /B`2+i i`MbHiBQM Q7 i?2 ϕ 7Q`KmH BMiQ Cpa+`BTiX Math


.sqrt Bb i?2 b[m`2 `QQi 7mM+iBQM- b T`QpB/2/ #v i?2 Math Q#D2+i BM 
biM/`/ Cpa+`BTi 2MpB`QMK2MiX q2 ?p2 iQ bmK irQ }2H/b 7`QK i?2
i#H2 iQ ;2i }2H/b HBF2 n1• #2+mb2 i?2 bmKb Q7 `Qrb Q` +QHmKMb `2 MQi
biQ`2/ /B`2+iHv BM Qm` /i bi`m+im`2X
C+[m2b F2Ti ?Bb DQm`MH 7Q` i?`22 KQMi?bX h?2 `2bmHiBM; /i b2i Bb
pBH#H2 BM i?2 +Q/BM; bM/#Qt 7Q` i?Bb +?Ti2`U2HQ[m2MiDpb+`BTiXM2if+Q/2O9V-
r?2`2 Bi Bb biQ`2/ BM i?2 JOURNAL p`B#H2- M/ BM  /QrMHQ/#H2 }H2X
hQ 2ti`+i  irQ@#v@irQ i#H2 7Q`  bT2+B}+ 2p2Mi 7`QK i?Bb DQm`MH- r2
Kmbi HQQT Qp2` HH i?2 2Mi`B2b M/ iHHv mT ?Qr KMv iBK2b i?2 2p2Mi
Q++m`b BM `2HiBQM iQ b[mB``2H i`Mb7Q`KiBQMbX
function hasEvent ( event , entry ) {
return entry . events . indexOf ( event ) != -1;
}

function tableFor ( event , journal ) {


var table = [0 , 0 , 0 , 0];
for ( var i = 0; i < journal . length ; i ++) {
var entry = journal [i ], index = 0;

dk
if ( hasEvent ( event , entry ) ) index += 1;
if ( entry . squirrel ) index += 2;
table [ index ] += 1;
}
return table ;
}

console . log ( tableFor (" pizza ", JOURNAL ) ) ;


// → [76 , 9 , 4, 1]

h?2 hasEvent 7mM+iBQM i2bib r?2i?2` M 2Mi`v +QMiBMb  ;Bp2M 2p2MiX


``vb ?p2 M indexOf K2i?Q/ i?i i`B2b iQ }M/  ;Bp2M pHm2 UBM i?Bb
+b2- i?2 2p2Mi MK2V BM i?2 ``v M/ `2im`Mb i?2 BM/2t i r?B+? Bi rb
7QmM/ Q` @R B7 Bi rbMǶi 7QmM/X aQ B7 i?2 +HH iQ indexOf /Q2bMǶi `2im`M @R-
i?2M r2 FMQr i?2 2p2Mi rb 7QmM/ BM i?2 2Mi`vX
h?2 #Q/v Q7 i?2 HQQT BM tableFor };m`2b Qmi r?B+? #Qt BM i?2 i#H2
2+? DQm`MH 2Mi`v 7HHb BMiQ #v +?2+FBM; r?2i?2` i?2 2Mi`v +QMiBMb i?2
bT2+B}+ 2p2Mi BiǶb BMi2`2bi2/ BM M/ r?2i?2` i?2 2p2Mi ?TT2Mb HQM;bB/2
 b[mB``2H BM+B/2MiX h?2 HQQT i?2M //b QM2 iQ i?2 MmK#2` BM i?2 ``v
i?i +Q``2bTQM/b iQ i?Bb #Qt QM i?2 i#H2X
q2 MQr ?p2 i?2 iQQHb r2 M22/ iQ +QKTmi2 BM/BpB/mH +Q``2HiBQMbX
h?2 QMHv bi2T `2KBMBM; Bb iQ }M/  +Q``2HiBQM 7Q` 2p2`v ivT2 Q7 2p2Mi
i?i rb `2+Q`/2/ M/ b22 r?2i?2` Mvi?BM; biM/b QmiX "mi ?Qr b?QmH/
r2 biQ`2 i?2b2 +Q``2HiBQMb QM+2 r2 +QKTmi2 i?2K\

P#D2+ib b KTb
PM2 TQbbB#H2 rv Bb iQ biQ`2 HH i?2 +Q``2HiBQMb BM M ``v- mbBM; Q#D2+ib
rBi? name M/ value T`QT2`iB2bX "mi i?i KF2b HQQFBM; mT i?2 +Q``2HiBQM
7Q`  ;Bp2M 2p2Mi bQK2r?i +mK#2`bQK2, vQmǶ/ ?p2 iQ HQQT Qp2` i?2
r?QH2 ``v iQ }M/ i?2 Q#D2+i rBi? i?2 `B;?i nameX q2 +QmH/ r`T i?Bb
HQQFmT T`Q+2bb BM  7mM+iBQM- #mi r2 rQmH/ biBHH #2 r`BiBM; KQ`2 +Q/2-
M/ i?2 +QKTmi2` rQmH/ #2 /QBM; KQ`2 rQ`F i?M M2+2bb`vX
 #2ii2` rv Bb iQ mb2 Q#D2+i T`QT2`iB2b MK2/ 7i2` i?2 2p2Mi ivT2bX
q2 +M mb2 i?2 b[m`2 #`+F2i ++2bb MQiiBQM iQ +`2i2 M/ `2/ i?2
T`QT2`iB2b M/ +M mb2 i?2 in QT2`iQ` iQ i2bi r?2i?2`  ;Bp2M T`QT2`iv
2tBbibX

dj
var map = {};
function storePhi ( event , phi ) {
map [ event ] = phi ;
}

storePhi (" pizza " , 0.069) ;


storePhi (" touched tree " , -0.081) ;
console . log (" pizza " in map ) ;
// → true
console . log ( map [" touched tree "]) ;
// → -0.081

 KT Bb  rv iQ ;Q 7`QK pHm2b BM QM2 /QKBM UBM i?Bb +b2- 2p2Mi
MK2bV iQ +Q``2bTQM/BM; pHm2b BM MQi?2` /QKBM UBM i?Bb +b2- ϕ +Q27@
}+B2MibVX
h?2`2 `2  72r TQi2MiBH T`Q#H2Kb rBi? mbBM; Q#D2+ib HBF2 i?Bb- r?B+?
r2 rBHH /Bb+mbb BM *?Ti2` e- #mi 7Q` i?2 iBK2 #2BM;- r2 rQMǶi rQ``v
#Qmi i?Qb2X
q?i B7 r2 rMi iQ }M/ HH i?2 2p2Mib 7Q` r?B+? r2 ?p2 biQ`2/ 
+Q2{+B2Mi\ h?2 T`QT2`iB2b /QMǶi 7Q`K  T`2/B+i#H2 b2`B2b- HBF2 i?2v
rQmH/ BM M ``v- bQ r2 +MMQi mb2  MQ`KH for HQQTX Cpa+`BTi
T`QpB/2b  HQQT +QMbi`m+i bT2+B}+HHv 7Q` ;QBM; Qp2` i?2 T`QT2`iB2b Q7
M Q#D2+iX Ai HQQFb  HBiiH2 HBF2  MQ`KH for HQQT #mi /BbiBM;mBb?2b Bib2H7
#v i?2 mb2 Q7 i?2 rQ`/ inX
for ( var event in map )
console . log (" The correlation for " + event +
" is " + map [ event ]) ;
// → The correlation for pizza is 0.069
// → The correlation for touched tree is -0.081

h?2 }MH MHvbBb


hQ }M/ HH i?2 ivT2b Q7 2p2Mib i?i `2 T`2b2Mi BM i?2 /i b2i- r2 bBKTHv
T`Q+2bb 2+? 2Mi`v BM im`M M/ i?2M HQQT Qp2` i?2 2p2Mib BM i?i 2Mi`vX
q2 F22T M Q#D2+i phis i?i ?b +Q``2HiBQM +Q2{+B2Mib 7Q` HH i?2 2p2Mi
ivT2b r2 ?p2 b22M bQ 7`X q?2M2p2` r2 `mM +`Qbb  ivT2 i?i BbMǶi BM
i?2 phis Q#D2+i v2i- r2 +QKTmi2 Bib +Q``2HiBQM M/ // Bi iQ i?2 Q#D2+iX

d9
function gatherCorrelations ( journal ) {
var phis = {};
for ( var entry = 0; entry < journal . length ; entry ++) {
var events = journal [ entry ]. events ;
for ( var i = 0; i < events . length ; i ++) {
var event = events [ i ];
if (!( event in phis ) )
phis [ event ] = phi ( tableFor ( event , journal ) ) ;
}
}
return phis ;
}

var correlations = gatherCorrelations ( JOURNAL );


console . log ( correlations . pizza ) ;
// → 0.068599434

G2iǶb b22 r?i +K2 QmiX


for ( var event in correlations )
console . log ( event + ": " + correlations [ event ]) ;
// → carrot : 0.0140970969
// → exercise : 0.0685994341
// → weekend : 0.1371988681
// → bread : -0.0757554019
// → pudding : -0.0648203724
// and so on ...

JQbi +Q``2HiBQMb b22K iQ HB2 +HQb2 iQ x2`QX 1iBM; +``Qib- #`2/- Q`


Tm//BM; TT`2MiHv /Q2b MQi i`B;;2` b[mB``2H@Hv+Mi?`QTvX Ai /Q2b b22K
iQ Q++m` bQK2r?i KQ`2 Q7i2M QM r22F2M/b- ?Qr2p2`X G2iǶb }Hi2` i?2
`2bmHib iQ b?Qr QMHv +Q``2HiBQMb ;`2i2` i?M yXR Q` H2bb i?M @yXRX
for ( var event in correlations ) {
var correlation = correlations [ event ];
if ( correlation > 0.1 || correlation < -0.1)
console . log ( event + ": " + correlation ) ;
}
// → weekend : 0.1371988681
// → brushed teeth : -0.3805211953
// → candy : 0.1296407447
// → work : -0.1371988681
// → spaghetti : 0.2425356250

d8
// → reading : 0.1106828054
// → peanuts : 0.5902679812

@?5 h?2`2 `2 irQ 7+iQ`b r?Qb2 +Q``2HiBQM Bb +H2`Hv bi`QM;2` i?M
i?2 Qi?2`bX 1iBM; T2Mmib ?b  bi`QM; TQbBiBp2 2z2+i QM i?2 +?M+2
Q7 im`MBM; BMiQ  b[mB``2H- r?2`2b #`mb?BM; ?Bb i22i? ?b  bB;MB}+Mi
M2;iBp2 2z2+iX
AMi2`2biBM;X G2iǶb i`v bQK2i?BM;X
for ( var i = 0; i < JOURNAL . length ; i ++) {
var entry = JOURNAL [ i ];
if ( hasEvent (" peanuts ", entry ) &&
! hasEvent (" brushed teeth ", entry ))
entry . events . push (" peanut teeth ") ;
}
console . log ( phi ( tableFor (" peanut teeth " , JOURNAL ) ) ) ;
// → 1

q2HH- i?iǶb mMKBbiF#H25 h?2 T?2MQK2MQM Q++m`b T`2+Bb2Hv r?2M C+[m2b


2ib T2Mmib M/ 7BHb iQ #`mb? ?Bb i22i?X A7 QMHv ?2 r2`2MǶi bm+?  bHQ#
#Qmi /2MiH ?v;B2M2- ?2Ƕ/ ?p2 M2p2` 2p2M MQiB+2/ ?Bb |B+iBQMX
EMQrBM; i?Bb- C+[m2b bBKTHv biQTb 2iBM; T2Mmib HiQ;2i?2` M/ }M/b
i?i i?Bb +QKTH2i2Hv Tmib M 2M/ iQ ?Bb i`Mb7Q`KiBQMbX
HH Bb r2HH rBi? C+[m2b 7Q`  r?BH2X "mi  72r v2`b Hi2`- ?2 HQb2b
?Bb DQ# M/ Bb 2p2MimHHv 7Q`+2/ iQ iF2 2KTHQvK2Mi rBi?  +B`+mb- r?2`2
?2 T2`7Q`Kb b h?2 AM+`2/B#H2 a[mB``2HKM #v bim{M; ?Bb KQmi? rBi?
T2Mmi #mii2` #27Q`2 2p2`v b?QrX PM2 /v- 72/ mT rBi? i?Bb TBiB7mH 2tBb@
i2M+2- C+[m2b 7BHb iQ +?M;2 #+F BMiQ ?Bb ?mKM 7Q`K- ?QTb i?`Qm;?
 +`+F BM i?2 +B`+mb i2Mi- M/ pMBb?2b BMiQ i?2 7Q`2biX >2 Bb M2p2` b22M
;BMX

6m`i?2` ``vQHQ;v
"27Q`2 }MBb?BM; mT i?Bb +?Ti2`- A rMi iQ BMi`Q/m+2 vQm iQ  72r KQ`2
Q#D2+i@`2Hi2/ +QM+2TibX q2ǶHH bi`i #v BMi`Q/m+BM; bQK2 ;2M2`HHv mb27mH
``v K2i?Q/bX
q2 br push M/ pop- r?B+? // M/ `2KQp2 2H2K2Mib i i?2 2M/ Q7
M ``v- 2`HB2` BM i?Bb +?Ti2`X h?2 +Q``2bTQM/BM; K2i?Q/b 7Q` //BM;
M/ `2KQpBM; i?BM;b i i?2 bi`i Q7 M ``v `2 +HH2/ unshift M/ shiftX

de
var todoList = [];
function rememberTo ( task ) {
todoList . push ( task ) ;
}
function whatIsNext () {
return todoList . shift () ;
}
function urgentlyRememberTo ( task ) {
todoList . unshift ( task );
}

h?2 T`2pBQmb T`Q;`K KM;2b HBbib Q7 ibFbX uQm // ibFb iQ i?2
2M/ Q7 i?2 HBbi #v +HHBM; rememberTo("eat")- M/ r?2M vQmǶ`2 `2/v iQ /Q
bQK2i?BM;- vQm +HH whatIsNext() iQ ;2i UM/ `2KQp2V i?2 7`QMi Bi2K 7`QK
i?2 HBbiX h?2 urgentlyRememberTo 7mM+iBQM HbQ //b  ibF #mi //b Bi iQ
i?2 7`QMi BMbi2/ Q7 i?2 #+F Q7 i?2 HBbiX
h?2 indexOf K2i?Q/ ?b  bB#HBM; +HH2/ lastIndexOf- r?B+? bi`ib b2`+?@
BM; 7Q` i?2 ;Bp2M 2H2K2Mi i i?2 2M/ Q7 i?2 ``v BMbi2/ Q7 i?2 7`QMiX
console . log ([1 , 2 , 3 , 2 , 1]. indexOf (2) ) ;
// → 1
console . log ([1 , 2 , 3 , 2 , 1]. lastIndexOf (2) ) ;
// → 3

"Qi? indexOf M/ lastIndexOf iF2 M QTiBQMH b2+QM/ `;mK2Mi i?i BM@
/B+i2b r?2`2 iQ bi`i b2`+?BM; 7`QKX
MQi?2` 7mM/K2MiH K2i?Q/ Bb slice- r?B+? iF2b  bi`i BM/2t M/
M 2M/ BM/2t M/ `2im`Mb M ``v i?i ?b QMHv i?2 2H2K2Mib #2ir22M
i?Qb2 BM/B+2bX h?2 bi`i BM/2t Bb BM+HmbBp2- i?2 2M/ BM/2t 2t+HmbBp2X
console . log ([0 , 1 , 2 , 3 , 4]. slice (2 , 4) ) ;
// → [2 , 3]
console . log ([0 , 1 , 2 , 3 , 4]. slice (2) ) ;
// → [2 , 3 , 4]

q?2M i?2 2M/ BM/2t Bb MQi ;Bp2M- slice rBHH iF2 HH Q7 i?2 2H2K2Mib 7i2`
i?2 bi`i BM/2tX ai`BM;b HbQ ?p2  slice K2i?Q/- r?B+? ?b  bBKBH`
2z2+iX
h?2 concat K2i?Q/ +M #2 mb2/ iQ ;Hm2 ``vb iQ;2i?2`- bBKBH` iQ r?i
i?2 + QT2`iQ` /Q2b 7Q` bi`BM;bX h?2 7QHHQrBM; 2tKTH2 b?Qrb #Qi? concat
M/ slice BM +iBQMX Ai iF2b M ``v M/ M BM/2t- M/ Bi `2im`Mb  M2r

dd
``v i?i Bb  +QTv Q7 i?2 Q`B;BMH ``v rBi? i?2 2H2K2Mi i i?2 ;Bp2M
BM/2t `2KQp2/X
function remove ( array , index ) {
return array . slice (0 , index )
. concat ( array . slice ( index + 1) ) ;
}
console . log ( remove ([" a " , " b ", " c", "d " , " e "] , 2) ) ;
// → [" a " , " b " , " d " , " e "]

ai`BM;b M/ i?2B` T`QT2`iB2b


q2 +M `2/ T`QT2`iB2b HBF2 length M/ toUpperCase 7`QK bi`BM; pHm2bX "mi
B7 vQm i`v iQ //  M2r T`QT2`iv- Bi /Q2bMǶi biB+FX
var myString = " Fido ";
myString . myProperty = " value ";
console . log ( myString . myProperty );
// → undefined

oHm2b Q7 ivT2 bi`BM;- MmK#2`- M/ "QQH2M `2 MQi Q#D2+ib- M/ i?Qm;?
i?2 HM;m;2 /Q2bMǶi +QKTHBM B7 vQm i`v iQ b2i M2r T`QT2`iB2b QM i?2K-
Bi /Q2bMǶi +imHHv biQ`2 i?Qb2 T`QT2`iB2bX h?2 pHm2b `2 BKKmi#H2 M/
+MMQi #2 +?M;2/X
"mi i?2b2 ivT2b /Q ?p2 bQK2 #mBHi@BM T`QT2`iB2bX 1p2`v bi`BM; pHm2
?b  MmK#2` Q7 K2i?Q/bX h?2 KQbi mb27mH QM2b `2 T`Q##Hv slice M/
indexOf- r?B+? `2b2K#H2 i?2 ``v K2i?Q/b Q7 i?2 bK2 MK2X

console . log (" coconuts ". slice (4 , 7) ) ;


// → nut
console . log (" coconut ". indexOf (" u ") ) ;
// → 5

PM2 /Bz2`2M+2 Bb i?i  bi`BM;Ƕb indexOf +M iF2  bi`BM; +QMiBMBM; KQ`2
i?M QM2 +?`+i2`- r?2`2b i?2 +Q``2bTQM/BM; ``v K2i?Q/ HQQFb QMHv
7Q`  bBM;H2 2H2K2MiX
console . log (" one two three ". indexOf (" ee ") ) ;
// → 11

d3
h?2 trim K2i?Q/ `2KQp2b r?Bi2bT+2 UbT+2b- M2rHBM2b- i#b- M/ bBKBH`
+?`+i2`bV 7`QK i?2 bi`i M/ 2M/ Q7  bi`BM;X
console . log (" okay \ n ". trim () );
// → okay

q2 ?p2 H`2/v b22M i?2 bi`BM; ivT2Ƕb length T`QT2`ivX ++2bbBM; i?2
BM/BpB/mH +?`+i2`b BM  bi`BM; +M #2 /QM2 rBi? i?2 charAt K2i?Q/ #mi
HbQ #v bBKTHv `2/BM; MmK2`B+ T`QT2`iB2b- HBF2 vQmǶ/ /Q 7Q` M ``vX
var string = " abc ";
console . log ( string . length ) ;
// → 3
console . log ( string . charAt (0) ) ;
// → a
console . log ( string [1]) ;
// → b

h?2 `;mK2Mib Q#D2+i


q?2M2p2`  7mM+iBQM Bb +HH2/-  bT2+BH p`B#H2 MK2/ arguments Bb //2/
iQ i?2 2MpB`QMK2Mi BM r?B+? i?2 7mM+iBQM #Q/v `mMbX h?Bb p`B#H2 `272`b
iQ M Q#D2+i i?i ?QH/b HH Q7 i?2 `;mK2Mib Tbb2/ iQ i?2 7mM+iBQMX
_2K2K#2` i?i BM Cpa+`BTi vQm `2 HHQr2/ iQ Tbb KQ`2 UQ` 72r2`V
`;mK2Mib iQ  7mM+iBQM i?M i?2 MmK#2` Q7 T`K2i2`b i?2 7mM+iBQM
Bib2H7 /2+H`2bX
function noArguments () {}
noArguments (1 , 2 , 3) ; // This is okay
function threeArguments (a , b , c) {}
threeArguments () ; // And so is this

h?2 arguments Q#D2+i ?b  length T`QT2`iv i?i i2HHb mb i?2 MmK#2` Q7
`;mK2Mib i?i r2`2 `2HHv Tbb2/ iQ i?2 7mM+iBQMX Ai HbQ ?b  T`QT2`iv
7Q` 2+? `;mK2Mi- MK2/ y- R- k- M/ bQ QMX
A7 i?i bQmM/b  HQi HBF2 M ``v iQ vQm- vQmǶ`2 `B;?i- Bi Bb  HQi HBF2 M
``vX "mi i?Bb Q#D2+i- mM7Q`imMi2Hv- /Q2b MQi ?p2 Mv ``v K2i?Q/b
UHBF2 slice Q` indexOfV- bQ Bi Bb  HBiiH2 ?`/2` iQ mb2 i?M  `2H ``vX
function argumentCounter () {

dN
console . log (" You gave me ", arguments . length , " arguments .") ;
}
argumentCounter (" Straw man ", " Tautology ", " Ad hominem ") ;
// → You gave me 3 arguments .

aQK2 7mM+iBQMb +M iF2 Mv MmK#2` Q7 `;mK2Mib- HBF2 console.logX


h?2b2 ivTB+HHv HQQT Qp2` i?2 pHm2b BM i?2B` arguments Q#D2+iX h?2v +M
#2 mb2/ iQ +`2i2 p2`v TH2bMi BMi2`7+2bX 6Q` 2tKTH2- `2K2K#2` ?Qr
r2 +`2i2/ i?2 2Mi`B2b iQ C+[m2bǶ DQm`MHX
addEntry ([" work " , " touched tree ", " pizza ", " running ",
" television "] , false ) ;

aBM+2 ?2 Bb ;QBM; iQ #2 +HHBM; i?Bb 7mM+iBQM  HQi- r2 +QmH/ +`2i2 M


Hi2`MiBp2 i?i Bb 2bB2` iQ +HHX
function addEntry ( squirrel ) {
var entry = { events : [] , squirrel : squirrel };
for ( var i = 1; i < arguments . length ; i ++)
entry . events . push ( arguments [ i ]) ;
journal . push ( entry ) ;
}
addEntry ( true , " work " , " touched tree ", " pizza ",
" running " , " television ") ;

h?Bb p2`bBQM `2/b Bib }`bi `;mK2Mi UsquirrelV BM i?2 MQ`KH rv M/
i?2M ;Q2b Qp2` i?2 `2bi Q7 i?2 `;mK2Mib Ui?2 HQQT bi`ib i BM/2t R-
bFBTTBM; i?2 }`biV iQ ;i?2` i?2K BMiQ M ``vX

h?2 Ji? Q#D2+i


b r2Ƕp2 b22M- Math Bb  ;`#@#; Q7 MmK#2`@`2Hi2/ miBHBiv 7mM+iBQMb-
bm+? b Math.max UKtBKmKV- Math.min UKBMBKmKV- M/ Math.sqrt Ub[m`2
`QQiVX
h?2 Math Q#D2+i Bb mb2/ bBKTHv b  +QMiBM2` iQ ;`QmT  #mM+? Q7 `2Hi2/
7mM+iBQMHBivX h?2`2 Bb QMHv QM2 Math Q#D2+i- M/ Bi Bb HKQbi M2p2` mb27mH
b  pHm2X _i?2`- Bi T`QpB/2b  MK2bT+2 bQ i?i HH i?2b2 7mM+iBQMb
M/ pHm2b /Q MQi ?p2 iQ #2 ;HQ#H p`B#H2bX
>pBM; iQQ KMv ;HQ#H p`B#H2b dzTQHHmi2bǴ i?2 MK2bT+2X h?2 KQ`2
MK2b i?i ?p2 #22M iF2M- i?2 KQ`2 HBF2Hv vQm `2 iQ ++B/2MiHHv

3y
Qp2`r`Bi2 i?2 pHm2 Q7 bQK2 p`B#H2X 6Q` 2tKTH2- BiǶb MQi mMHBF2Hv
i?i vQmǶHH rMi iQ MK2 bQK2i?BM; max BM QM2 Q7 vQm` T`Q;`KbX aBM+2
Cpa+`BTiǶb #mBHi@BM max 7mM+iBQM Bb im+F2/ b72Hv BMbB/2 i?2 Math Q#D2+i-
r2 /QMǶi ?p2 iQ rQ``v #Qmi Qp2`r`BiBM; BiX
JMv HM;m;2b rBHH biQT vQm- Q` i H2bi r`M vQm- r?2M vQm `2
/2}MBM;  p`B#H2 rBi?  MK2 i?i Bb H`2/v iF2MX Cpa+`BTi /Q2b
M2Bi?2`- bQ #2 +`27mHX
"+F iQ i?2 Math Q#D2+iX A7 vQm M22/ iQ /Q i`B;QMQK2i`v- Math +M ?2HTX
Ai +QMiBMb cos U+QbBM2V- sin UbBM2V- M/ tan UiM;2MiV- b r2HH b i?2B`
BMp2`b2 7mM+iBQMb- acos- asin- M/ atan- `2bT2+iBp2HvX h?2 MmK#2` π UTBVě
Q` i H2bi i?2 +HQb2bi TT`QtBKiBQM i?i }ib BM  Cpa+`BTi MmK#2`ěBb
pBH#H2 b Math.PIX Uh?2`2 Bb M QH/ T`Q;`KKBM; i`/BiBQM Q7 r`BiBM;
i?2 MK2b Q7 +QMbiMi pHm2b BM HH +TbXV
function randomPointOnCircle ( radius ) {
var angle = Math . random () * 2 * Math . PI ;
return { x : radius * Math . cos ( angle ) ,
y: radius * Math . sin ( angle ) };
}
console . log ( randomPointOnCircle (2) );
// → { x : 0.3667 , y : 1.966}

A7 bBM2b M/ +QbBM2b `2 MQi bQK2i?BM; vQm `2 p2`v 7KBHB` rBi?- /QMǶi
rQ``vX q?2M i?2v `2 mb2/ BM i?Bb #QQF- BM *?Ti2` Rj- AǶHH 2tTHBM i?2KX
h?2 T`2pBQmb 2tKTH2 mb2b Math.randomX h?Bb Bb  7mM+iBQM i?i `2im`Mb 
M2r Tb2m/Q`M/QK MmK#2` #2ir22M x2`Q UBM+HmbBp2V M/ QM2 U2t+HmbBp2V
2p2`v iBK2 vQm +HH BiX
console . log ( Math . random () );
// → 0.36993729369714856
console . log ( Math . random () );
// → 0.727367032552138
console . log ( Math . random () );
// → 0.40180766698904335

h?Qm;? +QKTmi2`b `2 /2i2`KBMBbiB+ K+?BM2běi?2v Hrvb `2+i i?2


bK2 rv B7 ;Bp2M i?2 bK2 BMTmiěBi Bb TQbbB#H2 iQ ?p2 i?2K T`Q/m+2
MmK#2`b i?i TT2` `M/QKX hQ /Q i?Bb- i?2 K+?BM2 F22Tb  MmK@
#2` UQ`  #mM+? Q7 MmK#2`bV BM Bib BMi2`MH bii2X h?2M- 2p2`v iBK2 
`M/QK MmK#2` Bb `2[m2bi2/- Bi T2`7Q`Kb bQK2 +QKTHB+i2/ /2i2`KBMBb@

3R
iB+ +QKTmiiBQMb QM i?Bb BMi2`MH bii2 M/ `2im`Mb T`i Q7 i?2 `2bmHi Q7
i?Qb2 +QKTmiiBQMbX h?2 K+?BM2 HbQ mb2b i?2 Qmi+QK2 iQ +?M;2 Bib
QrM BMi2`MH bii2 bQ i?i i?2 M2ti dz`M/QKǴ MmK#2` T`Q/m+2/ rBHH #2
/Bz2`2MiX
A7 r2 rMi  r?QH2 `M/QK MmK#2` BMbi2/ Q7  7`+iBQMH QM2- r2 +M
mb2 Math.floor Ur?B+? `QmM/b /QrM iQ i?2 M2`2bi r?QH2 MmK#2`V QM i?2
`2bmHi Q7 Math.randomX
console . log ( Math . floor ( Math . random () * 10) ) ;
// → 2

JmHiBTHvBM; i?2 `M/QK MmK#2` #v Ry ;Bp2b mb  MmK#2` ;`2i2` i?M


Q` 2[mH iQ x2`Q- M/ #2HQr RyX aBM+2 Math.floor `QmM/b /QrM- i?Bb 2t@
T`2bbBQM rBHH T`Q/m+2- rBi? 2[mH +?M+2- Mv MmK#2` 7`QK y i?`Qm;?
NX
h?2`2 `2 HbQ i?2 7mM+iBQMb Math.ceil U7Q` dz+2BHBM;Ǵ- r?B+? `QmM/b mT
iQ  r?QH2 MmK#2`V M/ Math.round UiQ i?2 M2`2bi r?QH2 MmK#2`VX

h?2 ;HQ#H Q#D2+i


h?2 ;HQ#H b+QT2- i?2 bT+2 BM r?B+? ;HQ#H p`B#H2b HBp2- +M HbQ #2
TT`Q+?2/ b M Q#D2+i BM Cpa+`BTiX 1+? ;HQ#H p`B#H2 Bb T`2b2Mi b
 T`QT2`iv Q7 i?Bb Q#D2+iX AM #`Qrb2`b- i?2 ;HQ#H b+QT2 Q#D2+i Bb biQ`2/
BM i?2 window p`B#H2X
var myVar = 10;
console . log (" myVar " in window );
// → true
console . log ( window . myVar );
// → 10

amKK`v
P#D2+ib M/ ``vb Ur?B+? `2  bT2+B}+ FBM/ Q7 Q#D2+iV T`QpB/2 rvb
iQ ;`QmT b2p2`H pHm2b BMiQ  bBM;H2 pHm2X *QM+2TimHHv- i?Bb HHQrb mb
iQ Tmi  #mM+? Q7 `2Hi2/ i?BM;b BM  #; M/ `mM `QmM/ rBi? i?2 #;-
BMbi2/ Q7 i`vBM; iQ r`T Qm` `Kb `QmM/ HH Q7 i?2 BM/BpB/mH i?BM;b

3k
M/ i`vBM; iQ ?QH/ QM iQ i?2K b2T`i2HvX
JQbi pHm2b BM Cpa+`BTi ?p2 T`QT2`iB2b- i?2 2t+2TiBQMb #2BM; null
M/ undefinedX S`QT2`iB2b `2 ++2bb2/ mbBM; value.propName Q` value["
propName"]X P#D2+ib i2M/ iQ mb2 MK2b 7Q` i?2B` T`QT2`iB2b M/ biQ`2
KQ`2 Q` H2bb  }t2/ b2i Q7 i?2KX ``vb- QM i?2 Qi?2` ?M/- mbmHHv +QM@
iBM p`vBM; MmK#2`b Q7 +QM+2TimHHv B/2MiB+H pHm2b M/ mb2 MmK#2`b
Ubi`iBM; 7`QK yV b i?2 MK2b Q7 i?2B` T`QT2`iB2bX
h?2`2 `2 bQK2 MK2/ T`QT2`iB2b BM ``vb- bm+? b length M/  MmK#2`
Q7 K2i?Q/bX J2i?Q/b `2 7mM+iBQMb i?i HBp2 BM T`QT2`iB2b M/ UmbmHHvV
+i QM i?2 pHm2 i?2v `2  T`QT2`iv Q7X
P#D2+ib +M HbQ b2`p2 b KTb- bbQ+BiBM; pHm2b rBi? MK2bX h?2 in
QT2`iQ` +M #2 mb2/ iQ }M/ Qmi r?2i?2` M Q#D2+i +QMiBMb  T`QT2`iv
rBi?  ;Bp2M MK2X h?2 bK2 F2vrQ`/ +M HbQ #2 mb2/ BM  for HQQT
Ufor (var name in object)V iQ HQQT Qp2` M Q#D2+iǶb T`QT2`iB2bX

1t2`+Bb2b
h?2 bmK Q7  `M;2
h?2 BMi`Q/m+iBQM Q7 i?Bb #QQF HHm/2/ iQ i?2 7QHHQrBM; b  MB+2 rv iQ
+QKTmi2 i?2 bmK Q7  `M;2 Q7 MmK#2`b,
console . log ( sum ( range (1 , 10) ) );

q`Bi2  range 7mM+iBQM i?i iF2b irQ `;mK2Mib- start M/ end- M/
`2im`Mb M ``v +QMiBMBM; HH i?2 MmK#2`b 7`QK start mT iQ UM/ BM@
+Hm/BM;V endX
L2ti- r`Bi2  sum 7mM+iBQM i?i iF2b M ``v Q7 MmK#2`b M/ `2im`Mb
i?2 bmK Q7 i?2b2 MmK#2`bX _mM i?2 T`2pBQmb T`Q;`K M/ b22 r?2i?2`
Bi /Q2b BM/22/ `2im`M 88X
b  #QMmb bbB;MK2Mi- KQ/B7v vQm` range 7mM+iBQM iQ iF2 M QTiBQMH
i?B`/ `;mK2Mi i?i BM/B+i2b i?2 dzbi2TǴ pHm2 mb2/ iQ #mBH/ mT i?2
``vX A7 MQ bi2T Bb ;Bp2M- i?2 ``v 2H2K2Mib ;Q mT #v BM+`2K2Mib Q7
QM2- +Q``2bTQM/BM; iQ i?2 QH/ #2?pBQ`X h?2 7mM+iBQM +HH range(1, 10, 2)
b?QmH/ `2im`M [1, 3, 5, 7, 9]X JF2 bm`2 Bi HbQ rQ`Fb rBi? M2;iBp2 bi2T
pHm2b bQ i?i range(5, 2, -1) T`Q/m+2b [5, 4, 3, 2]X

3j
_2p2`bBM; M ``v
``vb ?p2  K2i?Q/ reverse- r?B+? +?M;2b i?2 ``v #v BMp2`iBM; i?2
Q`/2` BM r?B+? Bib 2H2K2Mib TT2`X 6Q` i?Bb 2t2`+Bb2- r`Bi2 irQ 7mM+iBQMb-
reverseArray M/ reverseArrayInPlaceX h?2 }`bi- reverseArray- iF2b M ``v
b `;mK2Mi M/ T`Q/m+2b  M2r ``v i?i ?b i?2 bK2 2H2K2Mib BM
i?2 BMp2`b2 Q`/2`X h?2 b2+QM/- reverseArrayInPlace- /Q2b r?i i?2 reverse
K2i?Q/ /Q2b, Bi KQ/B}2b i?2 ``v ;Bp2M b `;mK2Mi BM Q`/2` iQ `2p2`b2
Bib 2H2K2MibX L2Bi?2` Kv mb2 i?2 biM/`/ reverse K2i?Q/X
h?BMFBM; #+F iQ i?2 MQi2b #Qmi bB/2 2z2+ib M/ Tm`2 7mM+iBQMb BM
i?2 T`2pBQmb +?Ti2`- r?B+? p`BMi /Q vQm 2tT2+i iQ #2 mb27mH BM KQ`2
bBimiBQMb\ q?B+? QM2 Bb KQ`2 2{+B2Mi\

 HBbi
P#D2+ib- b ;2M2`B+ #HQ#b Q7 pHm2b- +M #2 mb2/ iQ #mBH/ HH bQ`ib Q7 /i
bi`m+im`2bX  +QKKQM /i bi`m+im`2 Bb i?2 HBbi UMQi iQ #2 +QM7mb2/ rBi?
i?2 ``vVX  HBbi Bb  M2bi2/ b2i Q7 Q#D2+ib- rBi? i?2 }`bi Q#D2+i ?QH/BM;
 `272`2M+2 iQ i?2 b2+QM/- i?2 b2+QM/ iQ i?2 i?B`/- M/ bQ QMX
var list = {
value : 1 ,
rest : {
value : 2 ,
rest : {
value : 3 ,
rest : null
}
}
};

h?2 `2bmHiBM; Q#D2+ib 7Q`K  +?BM- HBF2 i?Bb,


value: 1
value: 2
rest: value: 3
rest:
rest: null

 MB+2 i?BM; #Qmi HBbib Bb i?i i?2v +M b?`2 T`ib Q7 i?2B` bi`m+im`2X
6Q` 2tKTH2- B7 A +`2i2 irQ M2r pHm2b {value: 0, rest: list} M/ {value:
-1, rest: list} UrBi? list `272``BM; iQ i?2 p`B#H2 /2}M2/ 2`HB2`V- i?2v

39
`2 #Qi? BM/2T2M/2Mi HBbib- #mi i?2v b?`2 i?2 bi`m+im`2 i?i KF2b mT
i?2B` Hbi i?`22 2H2K2MibX AM //BiBQM- i?2 Q`B;BMH HBbi Bb HbQ biBHH  pHB/
i?`22@2H2K2Mi HBbiX
q`Bi2  7mM+iBQM arrayToList i?i #mBH/b mT  /i bi`m+im`2 HBF2 i?2
T`2pBQmb QM2 r?2M ;Bp2M [1, 2, 3] b `;mK2Mi- M/ r`Bi2  listToArray
7mM+iBQM i?i T`Q/m+2b M ``v 7`QK  HBbiX HbQ r`Bi2 i?2 ?2HT2`
7mM+iBQMb prepend- r?B+? iF2b M 2H2K2Mi M/  HBbi M/ +`2i2b  M2r
HBbi i?i //b i?2 2H2K2Mi iQ i?2 7`QMi Q7 i?2 BMTmi HBbi- M/ nth- r?B+?
iF2b  HBbi M/  MmK#2` M/ `2im`Mb i?2 2H2K2Mi i i?2 ;Bp2M TQbBiBQM
BM i?2 HBbi- Q` undefined r?2M i?2`2 Bb MQ bm+? 2H2K2MiX
A7 vQm ?p2MǶi H`2/v- HbQ r`Bi2  `2+m`bBp2 p2`bBQM Q7 nthX

.22T +QKT`BbQM
h?2 == QT2`iQ` +QKT`2b Q#D2+ib #v B/2MiBivX "mi bQK2iBK2b- vQm rQmH/
T`272` iQ +QKT`2 i?2 pHm2b Q7 i?2B` +imH T`QT2`iB2bX
q`Bi2  7mM+iBQM- deepEqual- i?i iF2b irQ pHm2b M/ `2im`Mb i`m2 QMHv
B7 i?2v `2 i?2 bK2 pHm2 Q` `2 Q#D2+ib rBi? i?2 bK2 T`QT2`iB2b r?Qb2
pHm2b `2 HbQ 2[mH r?2M +QKT`2/ rBi?  `2+m`bBp2 +HH iQ deepEqualX
hQ }M/ Qmi r?2i?2` iQ +QKT`2 irQ i?BM;b #v B/2MiBiv Umb2 i?2 ===
QT2`iQ` 7Q` i?iV Q` #v HQQFBM; i i?2B` T`QT2`iB2b- vQm +M mb2 i?2
typeof QT2`iQ`X A7 Bi T`Q/m+2b "object" 7Q` #Qi? pHm2b- vQm b?QmH/ /Q 
/22T +QKT`BbQMX "mi vQm ?p2 iQ iF2 QM2 bBHHv 2t+2TiBQM BMiQ ++QmMi,
#v  ?BbiQ`B+H ++B/2Mi- typeof null HbQ T`Q/m+2b "object"X

38
dzh?2`2 `2 irQ rvb Q7 +QMbi`m+iBM;  bQ7ir`2 /2bB;M, PM2
rv Bb iQ KF2 Bi bQ bBKTH2 i?i i?2`2 `2 Q#pBQmbHv MQ
/2}+B2M+B2b- M/ i?2 Qi?2` rv Bb iQ KF2 Bi bQ +QKTHB+i2/
i?i i?2`2 `2 MQ Q#pBQmb /2}+B2M+B2bXǴ
ě*XX_X >Q`2- RN3y *J hm`BM; r`/ G2+im`2

8 >B;?2`@P`/2` 6mM+iBQMb
 H`;2 T`Q;`K Bb  +QbiHv T`Q;`K- M/ MQi Dmbi #2+mb2 Q7 i?2 iBK2 Bi
iF2b iQ #mBH/X aBx2 HKQbi Hrvb BMpQHp2b +QKTH2tBiv- M/ +QKTH2tBiv
+QM7mb2b T`Q;`KK2`bX *QM7mb2/ T`Q;`KK2`b- BM im`M- i2M/ iQ BMi`Q@
/m+2 KBbiF2b U#m;bV BMiQ T`Q;`KbX  H`;2 T`Q;`K HbQ T`QpB/2b  HQi
Q7 bT+2 7Q` i?2b2 #m;b iQ ?B/2- KFBM; i?2K ?`/ iQ }M/X
G2iǶb #`B2~v ;Q #+F iQ i?2 }MH irQ 2tKTH2 T`Q;`Kb BM i?2 BMi`Q@
/m+iBQMX h?2 }`bi Bb b2H7@+QMiBM2/ M/ bBt HBM2b HQM;X
var total = 0 , count = 1;
while ( count <= 10) {
total += count ;
count += 1;
}
console . log ( total ) ;

h?2 b2+QM/ `2HB2b QM irQ 2ti2`MH 7mM+iBQMb M/ Bb QM2 HBM2 HQM;X
console . log ( sum ( range (1 , 10) ) );

q?B+? QM2 Bb KQ`2 HBF2Hv iQ +QMiBM  #m;\


A7 r2 +QmMi i?2 bBx2 Q7 i?2 /2}MBiBQMb Q7 sum M/ range- i?2 b2+QM/
T`Q;`K Bb HbQ #B;ě2p2M #B;;2` i?M i?2 }`biX "mi biBHH- AǶ/ `;m2 i?i
Bi Bb KQ`2 HBF2Hv iQ #2 +Q``2+iX
Ai Bb KQ`2 HBF2Hv iQ #2 +Q``2+i #2+mb2 i?2 bQHmiBQM Bb 2tT`2bb2/ BM 
pQ+#mH`v i?i +Q``2bTQM/b iQ i?2 T`Q#H2K #2BM; bQHp2/X amKKBM; 
`M;2 Q7 MmK#2`b BbMǶi #Qmi HQQTb M/ +QmMi2`bX Ai Bb #Qmi `M;2b M/
bmKbX
h?2 /2}MBiBQMb Q7 i?Bb pQ+#mH`v Ui?2 7mM+iBQMb sum M/ rangeV rBHH biBHH
BMpQHp2 HQQTb- +QmMi2`b- M/ Qi?2` BM+B/2MiH /2iBHbX "mi #2+mb2 i?2v
`2 2tT`2bbBM; bBKTH2` +QM+2Tib i?M i?2 T`Q;`K b  r?QH2- i?2v `2
2bB2` iQ ;2i `B;?iX

3e
#bi`+iBQM
AM i?2 +QMi2ti Q7 T`Q;`KKBM;- i?2b2 FBM/b Q7 pQ+#mH`B2b `2 mbmHHv
+HH2/ #bi`+iBQMbX #bi`+iBQMb ?B/2 /2iBHb M/ ;Bp2 mb i?2 #BHBiv iQ
iHF #Qmi T`Q#H2Kb i  ?B;?2` UQ` KQ`2 #bi`+iV H2p2HX
b M MHQ;v- +QKT`2 i?2b2 irQ `2+BT2b 7Q` T2 bQmT,

Smi R +mT Q7 /`B2/ T2b T2` T2`bQM BMiQ  +QMiBM2`X // ri2`
mMiBH i?2 T2b `2 r2HH +Qp2`2/X G2p2 i?2 T2b BM ri2` 7Q` i
H2bi Rk ?Qm`bX hF2 i?2 T2b Qmi Q7 i?2 ri2` M/ Tmi i?2K
BM  +QQFBM; TMX // 9 +mTb Q7 ri2` T2` T2`bQMX *Qp2` i?2
TM M/ F22T i?2 T2b bBKK2`BM; 7Q` irQ ?Qm`bX hF2 ?H7 M
QMBQM T2` T2`bQMX *mi Bi BMiQ TB2+2b rBi?  FMB72X // Bi iQ
i?2 T2bX hF2  biHF Q7 +2H2`v T2` T2`bQMX *mi Bi BMiQ TB2+2b
rBi?  FMB72X // Bi iQ i?2 T2bX hF2  +``Qi T2` T2`bQMX
*mi Bi BMiQ TB2+2bX qBi?  FMB725 // Bi iQ i?2 T2bX *QQF 7Q`
Ry KQ`2 KBMmi2bX

M/ i?2 b2+QM/ `2+BT2,

S2` T2`bQM, R +mT /`B2/ bTHBi T2b- ?H7  +?QTT2/ QMBQM- 


biHF Q7 +2H2`v- M/  +``QiX
aQF T2b 7Q` Rk ?Qm`bX aBKK2` 7Q` k ?Qm`b BM 9 +mTb Q7 ri2`
UT2` T2`bQMVX *?QT M/ // p2;2i#H2bX *QQF 7Q` Ry KQ`2
KBMmi2bX

h?2 b2+QM/ Bb b?Q`i2` M/ 2bB2` iQ BMi2`T`2iX "mi vQm /Q M22/ iQ


mM/2`biM/  72r KQ`2 +QQFBM;@`2Hi2/ rQ`/běbQF- bBKK2`- +?QT- M/-
A ;m2bb- p2;2i#H2X
q?2M T`Q;`KKBM;- r2 +MǶi `2Hv QM HH i?2 rQ`/b r2 M22/ iQ #2
rBiBM; 7Q` mb BM i?2 /B+iBQM`vX h?mb- vQm KB;?i 7HH BMiQ i?2 Tii2`M Q7
i?2 }`bi `2+BT2ěrQ`F Qmi i?2 T`2+Bb2 bi2Tb i?2 +QKTmi2` ?b iQ T2`7Q`K-
QM2 #v QM2- #HBM/ iQ i?2 ?B;?2`@H2p2H +QM+2Tib i?i i?2v 2tT`2bbX
Ai ?b iQ #2+QK2 b2+QM/ Mim`2- 7Q`  T`Q;`KK2`- iQ MQiB+2 r?2M 
+QM+2Ti Bb #2;;BM; iQ #2 #bi`+i2/ BMiQ  M2r rQ`/X

3d
#bi`+iBM; ``v i`p2`bH
SHBM 7mM+iBQMb- b r2Ƕp2 b22M i?2K bQ 7`- `2  ;QQ/ rv iQ #mBH/
#bi`+iBQMbX "mi bQK2iBK2b i?2v 7HH b?Q`iX
AM i?2 T`2pBQmb +?Ti2`- i?Bb ivT2 Q7 for HQQT K/2 b2p2`H TT2`M+2b,
var array = [1 , 2 , 3];
for ( var i = 0; i < array . length ; i ++) {
var current = array [ i ];
console . log ( current ) ;
}

AiǶb i`vBM; iQ bv- dz6Q` 2+? 2H2K2Mi BM i?2 ``v- HQ; Bi iQ i?2 +QMbQH2ǴX
"mi Bi mb2b  `QmM/#Qmi rv i?i BMpQHp2b  +QmMi2` p`B#H2 i-  +?2+F
;BMbi i?2 ``vǶb H2M;i?- M/ M 2ti` p`B#H2 /2+H`iBQM iQ TB+F Qmi
i?2 +m``2Mi 2H2K2MiX T`i 7`QK #2BM;  #Bi Q7 M 2v2bQ`2- i?Bb T`QpB/2b
 HQi Q7 bT+2 7Q` TQi2MiBH KBbiF2bX q2 KB;?i ++B/2MiHHv `2mb2 i?2
i p`B#H2- KBbbT2HH length b lenght- +QM7mb2 i?2 i M/ current p`B#H2b-
M/ bQ QMX
aQ H2iǶb i`v iQ #bi`+i i?Bb BMiQ  7mM+iBQMX *M vQm i?BMF Q7  rv\
q2HH- BiǶb 2bv iQ r`Bi2  7mM+iBQM i?i ;Q2b Qp2` M ``v M/ +HHb
console.log QM 2p2`v 2H2K2MiX

function logEach ( array ) {


for ( var i = 0; i < array . length ; i ++)
console . log ( array [ i ]) ;
}

"mi r?i B7 r2 rMi iQ /Q bQK2i?BM; Qi?2` i?M HQ;;BM; i?2 2H2K2Mib\


aBM+2 dz/QBM; bQK2i?BM;Ǵ +M #2 `2T`2b2Mi2/ b  7mM+iBQM M/ 7mM+iBQMb
`2 Dmbi pHm2b- r2 +M Tbb Qm` +iBQM b  7mM+iBQM pHm2X
function forEach ( array , action ) {
for ( var i = 0; i < array . length ; i ++)
action ( array [ i ]) ;
}

forEach ([" Wampeter " , " Foma ", " Granfalloon "] , console . log ) ;
// → Wampeter
// → Foma
// → Granfalloon

33
UAM bQK2 #`Qrb2`b- +HHBM; console.log BM i?Bb rv /Q2b MQi rQ`FX uQm
+M mb2 alert BMbi2/ Q7 console.log B7 i?Bb 2tKTH2 7BHb iQ rQ`FXV
P7i2M- vQm /QMǶi Tbb  T`2/2}M2/ 7mM+iBQM iQ forEach #mi +`2i2 
7mM+iBQM pHm2 QM i?2 bTQi BMbi2/X
var numbers = [1 , 2 , 3 , 4 , 5] , sum = 0;
forEach ( numbers , function ( number ) {
sum += number ;
}) ;
console . log ( sum ) ;
// → 15

h?Bb HQQFb [mBi2  HQi HBF2 i?2 +HbbB+H for HQQT- rBi? Bib #Q/v r`Bii2M b
 #HQ+F #2HQr BiX >Qr2p2`- MQr i?2 #Q/v Bb BMbB/2 i?2 7mM+iBQM pHm2- b
r2HH b BMbB/2 i?2 T`2Mi?2b2b Q7 i?2 +HH iQ forEachX h?Bb Bb r?v Bi ?b iQ
#2 +HQb2/ rBi? i?2 +HQbBM; #`+2 M/ +HQbBM; T`2Mi?2bBbX
lbBM; i?Bb Tii2`M- r2 +M bT2+B7v  p`B#H2 MK2 7Q` i?2 +m``2Mi
2H2K2Mi UnumberV- `i?2` i?M ?pBM; iQ TB+F Bi Qmi Q7 i?2 ``v KMmHHvX
AM 7+i- r2 /QMǶi M22/ iQ r`Bi2 forEach Qm`b2Hp2bX Ai Bb pBH#H2 b 
biM/`/ K2i?Q/ QM ``vbX aBM+2 i?2 ``v Bb H`2/v T`QpB/2/ b i?2
i?BM; i?2 K2i?Q/ +ib QM- forEach iF2b QMHv QM2 `2[mB`2/ `;mK2Mi, i?2
7mM+iBQM iQ #2 2t2+mi2/ 7Q` 2+? 2H2K2MiX
hQ BHHmbi`i2 ?Qr ?2HT7mH i?Bb Bb- H2iǶb HQQF #+F i  7mM+iBQM 7`QK i?2
T`2pBQmb +?Ti2`X Ai +QMiBMb irQ ``v@i`p2`bBM; HQQTbX
function gatherCorrelations ( journal ) {
var phis = {};
for ( var entry = 0; entry < journal . length ; entry ++) {
var events = journal [ entry ]. events ;
for ( var i = 0; i < events . length ; i ++) {
var event = events [ i ];
if (!( event in phis ) )
phis [ event ] = phi ( tableFor ( event , journal ) ) ;
}
}
return phis ;
}

qQ`FBM; rBi? forEach KF2b Bi bHB;?iHv b?Q`i2` M/ [mBi2  #Bi +H2M2`X
function gatherCorrelations ( journal ) {

3N
var phis = {};
journal . forEach ( function ( entry ) {
entry . events . forEach ( function ( event ) {
if (!( event in phis ) )
phis [ event ] = phi ( tableFor ( event , journal ) ) ;
}) ;
}) ;
return phis ;
}

>B;?2`@Q`/2` 7mM+iBQMb
6mM+iBQMb i?i QT2`i2 QM Qi?2` 7mM+iBQMb- 2Bi?2` #v iFBM; i?2K b
`;mK2Mib Q` #v `2im`MBM; i?2K- `2 +HH2/ ?B;?2`@Q`/2` 7mM+iBQMbX A7 vQm
?p2 H`2/v ++2Ti2/ i?2 7+i i?i 7mM+iBQMb `2 `2;mH` pHm2b- i?2`2
Bb MQi?BM; T`iB+mH`Hv `2K`F#H2 #Qmi i?2 7+i i?i bm+? 7mM+iBQMb
2tBbiX h?2 i2`K +QK2b 7`QK Ki?2KiB+b- r?2`2 i?2 /BbiBM+iBQM #2ir22M
7mM+iBQMb M/ Qi?2` pHm2b Bb iF2M KQ`2 b2`BQmbHvX
>B;?2`@Q`/2` 7mM+iBQMb HHQr mb iQ #bi`+i Qp2` +iBQMb- MQi Dmbi pH@
m2bX h?2v +QK2 BM b2p2`H 7Q`KbX 6Q` 2tKTH2- vQm +M ?p2 7mM+iBQMb
i?i +`2i2 M2r 7mM+iBQMbX
function greaterThan ( n ) {
return function ( m ) { return m > n; };
}
var greaterThan10 = greaterThan (10) ;
console . log ( greaterThan10 (11) ) ;
// → true

M/ vQm +M ?p2 7mM+iBQMb i?i +?M;2 Qi?2` 7mM+iBQMbX


function noisy ( f ) {
return function ( arg ) {
console . log (" calling with ", arg ) ;
var val = f( arg ) ;
console . log (" called with " , arg , " - got " , val ) ;
return val ;
};
}
noisy ( Boolean ) (0) ;

Ny
// → calling with 0
// → called with 0 - got false

uQm +M 2p2M r`Bi2 7mM+iBQMb i?i T`QpB/2 M2r ivT2b Q7 +QMi`QH ~QrX
function unless ( test , then ) {
if (! test ) then () ;
}
function repeat ( times , body ) {
for ( var i = 0; i < times ; i ++) body ( i ) ;
}

repeat (3 , function ( n ) {
unless ( n % 2 , function () {
console . log (n , " is even ") ;
}) ;
}) ;
// → 0 is even
// → 2 is even

h?2 H2tB+H b+QTBM; `mH2b i?i r2 /Bb+mbb2/ BM *?Ti2` j rQ`F iQ Qm` /@
pMi;2 r?2M mbBM; 7mM+iBQMb BM i?Bb rvX AM i?2 T`2pBQmb 2tKTH2- i?2 n
p`B#H2 Bb  T`K2i2` iQ i?2 Qmi2` 7mM+iBQMX "2+mb2 i?2 BMM2` 7mM+iBQM
HBp2b BMbB/2 i?2 2MpB`QMK2Mi Q7 i?2 Qmi2` QM2- Bi +M mb2 nX h?2 #Q/B2b
Q7 bm+? BMM2` 7mM+iBQMb +M ++2bb i?2 p`B#H2b `QmM/ i?2KX h?2v +M
THv  `QH2 bBKBH` iQ i?2 {} #HQ+Fb mb2/ BM `2;mH` HQQTb M/ +QM/BiBQMH
bii2K2MibX M BKTQ`iMi /Bz2`2M+2 Bb i?i p`B#H2b /2+H`2/ BMbB/2
BMM2` 7mM+iBQMb /Q MQi 2M/ mT BM i?2 2MpB`QMK2Mi Q7 i?2 Qmi2` 7mM+iBQMX
M/ i?i Bb mbmHHv  ;QQ/ i?BM;X

SbbBM; HQM; `;mK2Mib


h?2 noisy 7mM+iBQM /2}M2/ 2`HB2`- r?B+? r`Tb Bib `;mK2Mi BM MQi?2`
7mM+iBQM- ?b  `i?2` b2`BQmb /2}+BiX
function noisy ( f ) {
return function ( arg ) {
console . log (" calling with ", arg ) ;
var val = f( arg ) ;
console . log (" called with " , arg , " - got " , val ) ;
return val ;

NR
};
}

A7 f iF2b KQ`2 i?M QM2 T`K2i2`- Bi ;2ib QMHv i?2 }`bi QM2X q2 +QmH/
//  #mM+? Q7 `;mK2Mib iQ i?2 BMM2` 7mM+iBQM Uarg1- arg2- M/ bQ QMV
M/ Tbb i?2K HH iQ f- #mi Bi Bb MQi +H2` ?Qr KMv rQmH/ #2 2MQm;?X
h?Bb bQHmiBQM rQmH/ HbQ /2T`Bp2 f Q7 i?2 BM7Q`KiBQM BM arguments.lengthX
aBM+2 r2Ƕ/ Hrvb Tbb i?2 bK2 MmK#2` Q7 `;mK2Mib- Bi rQmH/MǶi FMQr
?Qr KMv `;mK2Mib r2`2 Q`B;BMHHv ;Bp2MX
6Q` i?2b2 FBM/b Q7 bBimiBQMb- Cpa+`BTi 7mM+iBQMb ?p2 M apply K2i?Q/X
uQm Tbb Bi M ``v UQ` ``v@HBF2 Q#D2+iV Q7 `;mK2Mib- M/ Bi rBHH +HH
i?2 7mM+iBQM rBi? i?Qb2 `;mK2MibX
function transparentWrapping (f) {
return function () {
return f . apply ( null , arguments );
};
}

h?iǶb  mb2H2bb 7mM+iBQM- #mi Bi b?Qrb i?2 Tii2`M r2 `2 BMi2`2bi2/ BMě
i?2 7mM+iBQM Bi `2im`Mb Tbb2b HH Q7 i?2 ;Bp2M `;mK2Mib- M/ QMHv i?Qb2
`;mK2Mib- iQ fX Ai /Q2b i?Bb #v TbbBM; Bib QrM arguments Q#D2+i iQ applyX
h?2 }`bi `;mK2Mi iQ apply- 7Q` r?B+? r2 `2 TbbBM; null ?2`2- +M #2
mb2/ iQ bBKmHi2  K2i?Q/ +HHX q2 rBHH +QK2 #+F iQ i?i BM i?2 M2ti
+?Ti2`X

CaPL
>B;?2`@Q`/2` 7mM+iBQMb i?i bQK2?Qr TTHv  7mM+iBQM iQ i?2 2H2K2Mib Q7
M ``v `2 rB/2Hv mb2/ BM Cpa+`BTiX h?2 forEach K2i?Q/ Bb i?2 KQbi
T`BKBiBp2 bm+? 7mM+iBQMX h?2`2 `2  MmK#2` Q7 Qi?2` p`BMib pBH#H2
b K2i?Q/b QM ``vbX hQ 7KBHB`Bx2 Qm`b2Hp2b rBi? i?2K- H2iǶb THv
`QmM/ rBi? MQi?2` /i b2iX
 72r v2`b ;Q- bQK2QM2 +`rH2/ i?`Qm;?  HQi Q7 `+?Bp2b M/ Tmi
iQ;2i?2`  #QQF QM i?2 ?BbiQ`v Q7 Kv 7KBHv MK2 U>p2`#2F2ěK2MBM;
Pi#`QQFVX A QT2M2/ Bi ?QTBM; iQ }M/ FMB;?ib- TB`i2b- M/ H+?2KBbib
Ę #mi i?2 #QQF im`Mb Qmi iQ #2 KQbiHv 7mHH Q7 6H2KBb? 7`K2`bX 6Q` Kv
Kmb2K2Mi- A 2ti`+i2/ i?2 BM7Q`KiBQM QM Kv /B`2+i M+2biQ`b M/ Tmi

Nk
Bi BMiQ  +QKTmi2`@`2/#H2 7Q`KiX
h?2 }H2 A +`2i2/ HQQFb bQK2i?BM; HBF2 i?Bb,
[
{" name ": " Emma de Milliano ", " sex ": " f " ,
" born ": 1876 , " died ": 1956 ,
" father ": " Petrus de Milliano " ,
" mother ": " Sophia van Damme "} ,
{" name ": " Carolus Haverbeke ", " sex ": " m " ,
" born ": 1832 , " died ": 1905 ,
" father ": " Carel Haverbeke ",
" mother ": " Maria van Brussel "} ,...
and so on
]

h?Bb 7Q`Ki Bb +HH2/ CaPL UT`QMQmM+2/ dzCbQMǴV- r?B+? biM/b 7Q`


Cpa+`BTi P#D2+i LQiiBQMX Ai Bb rB/2Hv mb2/ b  /i biQ`;2 M/
+QKKmMB+iBQM 7Q`Ki QM i?2 q2#X
CaPL Bb bBKBH` iQ Cpa+`BTiǶb rv Q7 r`BiBM; ``vb M/ Q#D2+ib- rBi?
 72r `2bi`B+iBQMbX HH T`QT2`iv MK2b ?p2 iQ #2 bm``QmM/2/ #v /Qm#H2
[mQi2b- M/ QMHv bBKTH2 /i 2tT`2bbBQMb `2 HHQr2/ěMQ 7mM+iBQM +HHb-
p`B#H2b- Q` Mvi?BM; i?i BMpQHp2b +imH +QKTmiiBQMX *QKK2Mib `2
MQi HHQr2/ BM CaPLX
Cpa+`BTi ;Bp2b mb 7mM+iBQMb- JSON.stringify M/ JSON.parse- i?i +QMp2`i
/i iQ M/ 7`QK i?Bb 7Q`KiX h?2 }`bi iF2b  Cpa+`BTi pHm2 M/
`2im`Mb  CaPL@2M+Q/2/ bi`BM;X h?2 b2+QM/ iF2b bm+?  bi`BM; M/
+QMp2`ib Bi iQ i?2 pHm2 Bi 2M+Q/2bX
var string = JSON . stringify ({ name : "X", born : 1980}) ;
console . log ( string ) ;
// → {" name ":" X " ," born ":1980}
console . log ( JSON . parse ( string ) . born ) ;
// → 1980

h?2 p`B#H2 ANCESTRY_FILE- pBH#H2 BM i?2 bM/#Qt 7Q` i?Bb +?Ti2` M/
BM  /QrMHQ/#H2 }H2 QM i?2 r2#bBi2U2HQ[m2MiDpb+`BTiXM2if+Q/2O8V-
+QMiBMb i?2 +QMi2Mi Q7 Kv CaPL }H2 b  bi`BM;X G2iǶb /2+Q/2 Bi M/ b22
?Qr KMv T2QTH2 Bi +QMiBMbX
var ancestry = JSON . parse ( ANCESTRY_FILE );
console . log ( ancestry . length ) ;

Nj
// → 39

6BHi2`BM; M ``v
hQ }M/ i?2 T2QTH2 BM i?2 M+2bi`v /i b2i r?Q r2`2 vQmM; BM RNk9-
i?2 7QHHQrBM; 7mM+iBQM KB;?i #2 ?2HT7mHX Ai }Hi2`b Qmi i?2 2H2K2Mib BM M
``v i?i /QMǶi Tbb  i2biX
function filter ( array , test ) {
var passed = [];
for ( var i = 0; i < array . length ; i ++) {
if ( test ( array [ i ]) )
passed . push ( array [i ]) ;
}
return passed ;
}

console . log ( filter ( ancestry , function ( person ) {


return person . born > 1900 && person . born < 1925;
}) ) ;
// → [{ name : " Philibert Haverbeke " , ...}, ...]

h?Bb mb2b i?2 `;mK2Mi MK2/ test-  7mM+iBQM pHm2- iQ }HH BM  dz;TǴ
BM i?2 +QKTmiiBQMX h?2 test 7mM+iBQM Bb +HH2/ 7Q` 2+? 2H2K2Mi- M/ Bib
`2im`M pHm2 /2i2`KBM2b r?2i?2` M 2H2K2Mi Bb BM+Hm/2/ BM i?2 `2im`M2/
``vX
h?`22 T2QTH2 BM i?2 }H2 r2`2 HBp2 M/ vQmM; BM RNk9, Kv ;`M/7i?2`-
;`M/KQi?2`- M/ ;`2i@mMiX
LQi2 ?Qr i?2 filter 7mM+iBQM- `i?2` i?M /2H2iBM; 2H2K2Mib 7`QK i?2
2tBbiBM; ``v- #mBH/b mT  M2r ``v rBi? QMHv i?2 2H2K2Mib i?i Tbb
i?2 i2biX h?Bb 7mM+iBQM Bb Tm`2X Ai /Q2b MQi KQ/B7v i?2 ``v Bi Bb ;Bp2MX
GBF2 forEach- filter Bb HbQ  biM/`/ K2i?Q/ QM ``vbX h?2 2tKTH2
/2}M2/ i?2 7mM+iBQM QMHv BM Q`/2` iQ b?Qr r?i Bi /Q2b BMi2`MHHvX 6`QK
MQr QM- r2ǶHH mb2 Bi HBF2 i?Bb BMbi2/,
console . log ( ancestry . filter ( function ( person ) {
return person . father == " Carel Haverbeke ";
}) ) ;
// → [{ name : " Carolus Haverbeke ", ...}]

N9
h`Mb7Q`KBM; rBi? KT
av r2 ?p2 M ``v Q7 Q#D2+ib `2T`2b2MiBM; T2QTH2- T`Q/m+2/ #v }Hi2`BM;
i?2 ancestry ``v bQK2?QrX "mi r2 rMi M ``v Q7 MK2b- r?B+? Bb
2bB2` iQ `2/X
h?2 map K2i?Q/ i`Mb7Q`Kb M ``v #v TTHvBM;  7mM+iBQM iQ HH Q7 Bib
2H2K2Mib M/ #mBH/BM;  M2r ``v 7`QK i?2 `2im`M2/ pHm2bX h?2 M2r
``v rBHH ?p2 i?2 bK2 H2M;i? b i?2 BMTmi ``v- #mi Bib +QMi2Mi rBHH
?p2 #22M dzKTT2/Ǵ iQ  M2r 7Q`K #v i?2 7mM+iBQMX
function map ( array , transform ) {
var mapped = [];
for ( var i = 0; i < array . length ; i ++)
mapped . push ( transform ( array [ i ]) ) ;
return mapped ;
}

var overNinety = ancestry . filter ( function ( person ) {


return person . died - person . born > 90;
}) ;
console . log ( map ( overNinety , function ( person ) {
return person . name ;
}) ) ;
// → [" Clara Aernoudts " , " Emile Haverbeke " ,
// " Maria Haverbeke "]

AMi2`2biBM;Hv- i?2 T2QTH2 r?Q HBp2/ iQ i H2bi Ny v2`b Q7 ;2 `2 i?2
bK2 i?`22 T2QTH2 r?Q r2 br #27Q`2ěi?2 T2QTH2 r?Q r2`2 vQmM; BM
i?2 RNkyb- r?B+? ?TT2Mb iQ #2 i?2 KQbi `2+2Mi ;2M2`iBQM BM Kv /i
b2iX A ;m2bb K2/B+BM2 ?b +QK2  HQM; rvX
GBF2 forEach M/ filter- map Bb HbQ  biM/`/ K2i?Q/ QM ``vbX

amKK`BxBM; rBi? `2/m+2


MQi?2` +QKKQM Tii2`M Q7 +QKTmiiBQM QM ``vb Bb +QKTmiBM;  bBM@
;H2 pHm2 7`QK i?2KX Pm` `2+m``BM; 2tKTH2- bmKKBM;  +QHH2+iBQM Q7
MmK#2`b- Bb M BMbiM+2 Q7 i?BbX MQi?2` 2tKTH2 rQmH/ #2 }M/BM; i?2
T2`bQM rBi? i?2 2`HB2bi v2` Q7 #B`i? BM i?2 /i b2iX
h?2 ?B;?2`@Q`/2` QT2`iBQM i?i `2T`2b2Mib i?Bb Tii2`M Bb +HH2/ `2/m+2

N8
UQ` bQK2iBK2b 7QH/VX uQm +M i?BMF Q7 Bi b 7QH/BM; mT i?2 ``v- QM2
2H2K2Mi i  iBK2X q?2M bmKKBM; MmK#2`b- vQmǶ/ bi`i rBi? i?2 MmK#2`
x2`Q M/- 7Q` 2+? 2H2K2Mi- +QK#BM2 Bi rBi? i?2 +m``2Mi bmK #v //BM;
i?2 irQX
h?2 T`K2i2`b iQ i?2 reduce 7mM+iBQM `2- T`i 7`QK i?2 ``v-  +QK@
#BMBM; 7mM+iBQM M/  bi`i pHm2X h?Bb 7mM+iBQM Bb  HBiiH2 H2bb bi`B;?i@
7Q`r`/ i?M filter M/ map- bQ Tv +HQb2 ii2MiBQMX
function reduce ( array , combine , start ) {
var current = start ;
for ( var i = 0; i < array . length ; i ++)
current = combine ( current , array [ i ]) ;
return current ;
}

console . log ( reduce ([1 , 2, 3, 4] , function (a , b ) {


return a + b ;
}, 0) );
// → 10

h?2 biM/`/ ``v K2i?Q/ reduce- r?B+? Q7 +Qm`b2 +Q``2bTQM/b iQ i?Bb


7mM+iBQM- ?b M //2/ +QMp2MB2M+2X A7 vQm` ``v +QMiBMb i H2bi QM2
2H2K2Mi- vQm `2 HHQr2/ iQ H2p2 Qz i?2 start `;mK2MiX h?2 K2i?Q/
rBHH iF2 i?2 }`bi 2H2K2Mi Q7 i?2 ``v b Bib bi`i pHm2 M/ bi`i `2/m+BM;
i i?2 b2+QM/ 2H2K2MiX
hQ mb2 reduce iQ }M/ Kv KQbi M+B2Mi FMQrM M+2biQ`- r2 +M r`Bi2
bQK2i?BM; HBF2 i?Bb,
console . log ( ancestry . reduce ( function ( min , cur ) {
if ( cur . born < min . born ) return cur ;
else return min ;
}) ) ;
// → { name : " Pauwels van Haverbeke " , born : 1535 , ...}

*QKTQb#BHBiv
*QMbB/2` ?Qr r2 rQmH/ ?p2 r`Bii2M i?2 T`2pBQmb 2tKTH2 U}M/BM; i?2
T2`bQM rBi? i?2 2`HB2bi v2` Q7 #B`i?V rBi?Qmi ?B;?2`@Q`/2` 7mM+iBQMbX
h?2 +Q/2 Bb MQi i?i Km+? rQ`b2X

Ne
var min = ancestry [0];
for ( var i = 1; i < ancestry . length ; i ++) {
var cur = ancestry [ i ];
if ( cur . born < min . born )
min = cur ;
}
console . log ( min ) ;
// → { name : " Pauwels van Haverbeke " , born : 1535 , ...}

h?2`2 `2  72r KQ`2 p`B#H2b- M/ i?2 T`Q;`K Bb irQ HBM2b HQM;2` #mi
biBHH [mBi2 2bv iQ mM/2`biM/X
>B;?2`@Q`/2` 7mM+iBQMb bi`i iQ b?BM2 r?2M vQm M22/ iQ +QKTQb2 7mM+@
iBQMbX b M 2tKTH2- H2iǶb r`Bi2 +Q/2 i?i }M/b i?2 p2`;2 ;2 7Q` K2M
M/ 7Q` rQK2M BM i?2 /i b2iX
function average ( array ) {
function plus (a , b ) { return a + b; }
return array . reduce ( plus ) / array . length ;
}
function age ( p ) { return p . died - p . born ; }
function male ( p) { return p . sex == "m "; }
function female ( p ) { return p . sex == "f "; }

console . log ( average ( ancestry . filter ( male ) . map ( age ) ) ) ;


// → 61.67
console . log ( average ( ancestry . filter ( female ) . map ( age ) ) ) ;
// → 54.56

UAiǶb  #Bi bBHHv i?i r2 ?p2 iQ /2}M2 plus b  7mM+iBQM- #mi QT2`iQ`b
BM Cpa+`BTi- mMHBF2 7mM+iBQMb- `2 MQi pHm2b- bQ vQm +MǶi Tbb i?2K
b `;mK2MibXV
AMbi2/ Q7 iM;HBM; i?2 HQ;B+ BMiQ  #B; HQQT- Bi Bb M2iHv +QKTQb2/ BMiQ
i?2 +QM+2Tib r2 `2 BMi2`2bi2/ BMě/2i2`KBMBM; b2t- +QKTmiBM; ;2- M/
p2`;BM; MmK#2`bX q2 +M TTHv i?2b2 QM2 #v QM2 iQ ;2i i?2 `2bmHi r2
`2 HQQFBM; 7Q`X
h?Bb Bb 7#mHQmb 7Q` r`BiBM; +H2` +Q/2X lM7Q`imMi2Hv- i?Bb +H`Biv
+QK2b i  +QbiX

Nd
h?2 +Qbi
AM i?2 ?TTv HM/ Q7 2H2;Mi +Q/2 M/ T`2iiv `BM#Qrb- i?2`2 HBp2b 
bTQBH@bTQ`i KQMbi2` +HH2/ BM2{+B2M+vX
 T`Q;`K i?i T`Q+2bb2b M ``v Bb KQbi 2H2;MiHv 2tT`2bb2/ b 
b2[m2M+2 Q7 +H2MHv b2T`i2/ bi2Tb i?i 2+? /Q bQK2i?BM; rBi? i?2
``v M/ T`Q/m+2  M2r ``vX "mi #mBH/BM; mT HH i?Qb2 BMi2`K2/Bi2
``vb Bb bQK2r?i 2tT2MbBp2X
GBF2rBb2- TbbBM;  7mM+iBQM iQ forEach M/ H2iiBM; i?i K2i?Q/ ?M/H2
i?2 ``v Bi2`iBQM 7Q` mb Bb +QMp2MB2Mi M/ 2bv iQ `2/X "mi 7mM+iBQM
+HHb BM Cpa+`BTi `2 +QbiHv +QKT`2/ iQ bBKTH2 HQQT #Q/B2bX
M/ bQ Bi ;Q2b rBi?  HQi Q7 i2+?MB[m2b i?i ?2HT BKT`Qp2 i?2 +H`Biv
Q7  T`Q;`KX #bi`+iBQMb // Hv2`b #2ir22M i?2 `r i?BM;b i?2 +QK@
Tmi2` Bb /QBM; M/ i?2 +QM+2Tib r2 `2 rQ`FBM; rBi? M/ i?mb +mb2 i?2
K+?BM2 iQ T2`7Q`K KQ`2 rQ`FX h?Bb Bb MQi M B`QM Hrěi?2`2 `2 T`Q@
;`KKBM; HM;m;2b i?i ?p2 #2ii2` bmTTQ`i 7Q` #mBH/BM; #bi`+iBQMb
rBi?Qmi //BM; BM2{+B2M+B2b- M/ 2p2M BM Cpa+`BTi- M 2tT2`B2M+2/
T`Q;`KK2` +M }M/ rvb iQ r`Bi2 #bi`+i +Q/2 i?i Bb biBHH 7biX "mi
Bi Bb  T`Q#H2K i?i +QK2b mT  HQiX
6Q`imMi2Hv- KQbi +QKTmi2`b `2 BMbM2Hv 7biX A7 vQm `2 T`Q+2bbBM; 
KQ/2bi b2i Q7 /i Q` /QBM; bQK2i?BM; i?i ?b iQ ?TT2M QMHv QM  ?m@
KM iBK2 b+H2 Ubv- 2p2`v iBK2 i?2 mb2` +HB+Fb  #miiQMV- i?2M Bi /Q2b MQi
Kii2` r?2i?2` vQm r`Qi2  T`2iiv bQHmiBQM i?i iF2b ?H7  KBHHBb2+QM/
Q`  bmT2`@QTiBKBx2/ bQHmiBQM i?i iF2b  i2Mi? Q7  KBHHBb2+QM/X
Ai Bb ?2HT7mH iQ `Qm;?Hv F22T i`+F Q7 ?Qr Q7i2M  TB2+2 Q7 vQm` T`Q;`K
Bb ;QBM; iQ `mMX A7 vQm ?p2  HQQT BMbB/2  HQQT U2Bi?2` /B`2+iHv Q`
i?`Qm;? i?2 Qmi2` HQQT +HHBM;  7mM+iBQM i?i 2M/b mT T2`7Q`KBM; i?2
BMM2` HQQTV- i?2 +Q/2 BMbB/2 i?2 BMM2` HQQT rBHH 2M/ mT `mMMBM; L ×J
iBK2b- r?2`2 L Bb i?2 MmK#2` Q7 iBK2b i?2 Qmi2` HQQT `2T2ib M/ J
Bb i?2 MmK#2` Q7 iBK2b i?2 BMM2` HQQT `2T2ib rBi?BM 2+? Bi2`iBQM Q7
i?2 Qmi2` HQQTX A7 i?i BMM2` HQQT +QMiBMb MQi?2` HQQT i?i KF2b S
`QmM/b- Bib #Q/v rBHH `mM J ×L ×S iBK2b- M/ bQ QMX h?Bb +M // mT
iQ H`;2 MmK#2`b- M/ r?2M  T`Q;`K Bb bHQr- i?2 T`Q#H2K +M Q7i2M #2
i`+2/ iQ QMHv  bKHH T`i Q7 i?2 +Q/2- r?B+? bBib BMbB/2 M BMM2` HQQTX

N3
:`2i@;`2i@;`2i@;`2i@Ę
Jv ;`M/7i?2`- S?BHB#2`i >p2`#2F2- Bb BM+Hm/2/ BM i?2 /i }H2X "v
bi`iBM; rBi? ?BK- A +M i`+2 Kv HBM2;2 iQ }M/ Qmi r?2i?2` i?2 KQbi
M+B2Mi T2`bQM BM i?2 /i- Smr2Hb pM >p2`#2F2- Bb Kv /B`2+i M+2biQ`X
M/ B7 ?2 Bb- A rQmH/ HBF2 iQ FMQr ?Qr Km+? .L A i?2Q`2iB+HHv b?`2
rBi? ?BKX
hQ #2 #H2 iQ ;Q 7`QK  T`2MiǶb MK2 iQ i?2 +imH Q#D2+i i?i `2T`2@
b2Mib i?Bb T2`bQM- r2 }`bi #mBH/ mT M Q#D2+i i?i bbQ+Bi2b MK2b rBi?
T2QTH2X
var byName = {};
ancestry . forEach ( function ( person ) {
byName [ person . name ] = person ;
}) ;

console . log ( byName [" Philibert Haverbeke "]) ;


// → { name : " Philibert Haverbeke " , ...}

LQr- i?2 T`Q#H2K Bb MQi 2MiB`2Hv b bBKTH2 b 7QHHQrBM; i?2 father T`QT2`@
iB2b M/ +QmMiBM; ?Qr KMv r2 M22/ iQ `2+? Smr2HbX h?2`2 `2 b2p2`H
+b2b BM i?2 7KBHv i`22 r?2`2 T2QTH2 K``B2/ i?2B` b2+QM/ +QmbBMb UiBMv
pBHH;2b M/ HH i?iVX h?Bb +mb2b i?2 #`M+?2b Q7 i?2 7KBHv i`22 iQ
`2DQBM BM  72r TH+2b- r?B+? K2Mb A b?`2 KQ`2 i?M Rfk: Q7 Kv ;2M2b
rBi? i?Bb T2`bQM- r?2`2 : 7Q` i?2 MmK#2` Q7 ;2M2`iBQMb #2ir22M Smr2Hb
M/ K2X h?Bb 7Q`KmH +QK2b 7`QK i?2 B/2 i?i 2+? ;2M2`iBQM bTHBib
i?2 ;2M2 TQQH BM irQX
 `2bQM#H2 rv iQ i?BMF #Qmi i?Bb T`Q#H2K Bb iQ HQQF i Bi b #2@
BM; MHQ;Qmb iQ reduce- r?B+? +QM/2Mb2b M ``v iQ  bBM;H2 pHm2 #v
`2T2i2/Hv +QK#BMBM; pHm2b- H27i iQ `B;?iX AM i?Bb +b2- r2 HbQ rMi iQ
+QM/2Mb2 Qm` /i bi`m+im`2 iQ  bBM;H2 pHm2 #mi BM  rv i?i 7QHHQrb
7KBHv HBM2bX h?2 b?T2 Q7 i?2 /i Bb i?i Q7  7KBHv i`22- `i?2` i?M
 ~i HBbiX
h?2 rv r2 rMi iQ `2/m+2 i?Bb b?T2 Bb #v +QKTmiBM;  pHm2 7Q`
 ;Bp2M T2`bQM #v +QK#BMBM; pHm2b 7`QK i?2B` M+2biQ`bX h?Bb +M #2
/QM2 `2+m`bBp2Hv, B7 r2 `2 BMi2`2bi2/ BM T2`bQM - r2 ?p2 iQ +QKTmi2
i?2 pHm2b 7Q` Ƕb T`2Mib- r?B+? BM im`M `2[mB`2b mb iQ +QKTmi2 i?2 pHm2
7Q` Ƕb ;`M/T`2Mib- M/ bQ QMX AM T`BM+BTH2- i?iǶ/ `2[mB`2 mb iQ HQQF i

NN
M BM}MBi2 MmK#2` Q7 T2QTH2- #mi bBM+2 Qm` /i b2i Bb }MBi2- r2 ?p2 iQ
biQT bQK2r?2`2X q2ǶHH HHQr  /27mHi pHm2 iQ #2 ;Bp2M iQ Qm` `2/m+iBQM
7mM+iBQM- r?B+? rBHH #2 mb2/ 7Q` T2QTH2 r?Q `2 MQi BM i?2 /iX AM Qm`
+b2- i?i pHm2 Bb bBKTHv x2`Q- QM i?2 bbmKTiBQM i?i T2QTH2 MQi BM i?2
HBbi /QMǶi b?`2 .L rBi? i?2 M+2biQ` r2 `2 HQQFBM; iX
:Bp2M  T2`bQM-  7mM+iBQM iQ +QK#BM2 pHm2b 7`QK i?2 irQ T`2Mib Q7 
;Bp2M T2`bQM- M/  /27mHi pHm2- reduceAncestors +QM/2Mb2b  pHm2 7`QK
 7KBHv i`22X
function reduceAncestors ( person , f , defaultValue ) {
function valueFor ( person ) {
if ( person == null )
return defaultValue ;
else
return f ( person , valueFor ( byName [ person . mother ]) ,
valueFor ( byName [ person . father ]) );
}
return valueFor ( person ) ;
}

h?2 BMM2` 7mM+iBQM UvalueForV ?M/H2b  bBM;H2 T2`bQMX h?`Qm;? i?2 K;B+
Q7 `2+m`bBQM- Bi +M bBKTHv +HH Bib2H7 iQ ?M/H2 i?2 7i?2` M/ i?2 KQi?2`
Q7 i?Bb T2`bQMX h?2 `2bmHib- HQM; rBi? i?2 T2`bQM Q#D2+i Bib2H7- `2 Tbb2/
iQ f- r?B+? `2im`Mb i?2 +imH pHm2 7Q` i?Bb T2`bQMX
q2 +M i?2M mb2 i?Bb iQ +QKTmi2 i?2 KQmMi Q7 .L Kv ;`M/7i?2`
b?`2/ rBi? Smr2Hb pM >p2`#2F2 M/ /BpB/2 i?i #v 7Qm`X
function sharedDNA ( person , fromMother , fromFather ) {
if ( person . name == " Pauwels van Haverbeke ")
return 1;
else
return ( fromMother + fromFather ) / 2;
}
var ph = byName [" Philibert Haverbeke "];
console . log ( reduceAncestors ( ph , sharedDNA , 0) / 4) ;
// → 0.00049

h?2 T2`bQM rBi? i?2 MK2 Smr2Hb pM >p2`#2F2 Q#pBQmbHv b?`2/ Ryy
T2`+2Mi Q7 ?Bb .L rBi? Smr2Hb pM >p2`#2F2 Ui?2`2 `2 MQ T2QTH2
r?Q b?`2 MK2b BM i?2 /i b2iV- bQ i?2 7mM+iBQM `2im`Mb R 7Q` ?BKX HH
Qi?2` T2QTH2 b?`2 i?2 p2`;2 Q7 i?2 KQmMib i?i i?2B` T`2Mib b?`2X

Ryy
aQ- biiBbiB+HHv bT2FBM;- A b?`2 #Qmi yXy8 T2`+2Mi Q7 Kv .L rBi?
i?Bb Rei?@+2Mim`v T2`bQMX Ai b?QmH/ #2 MQi2/ i?i i?Bb Bb QMHv  biiBbiB+H
TT`QtBKiBQM- MQi M 2t+i KQmMiX Ai Bb  `i?2` bKHH MmK#2`- #mi
;Bp2M ?Qr Km+? ;2M2iB+ Ki2`BH r2 +``v U#Qmi j #BHHBQM #b2 TB`bV-
i?2`2Ƕb biBHH T`Q##Hv bQK2 bT2+i BM i?2 #BQHQ;B+H K+?BM2 i?i Bb K2
i?i Q`B;BMi2b rBi? Smr2HbX
q2 +QmH/ HbQ ?p2 +QKTmi2/ i?Bb MmK#2` rBi?Qmi `2HvBM; QM reduceAncestors
X "mi b2T`iBM; i?2 ;2M2`H TT`Q+? U+QM/2MbBM;  7KBHv i`22V 7`QK
i?2 bT2+B}+ +b2 U+QKTmiBM; b?`2/ .LV +M BKT`Qp2 i?2 +H`Biv Q7 i?2
+Q/2 M/ HHQrb mb iQ `2mb2 i?2 #bi`+i T`i Q7 i?2 T`Q;`K 7Q` Qi?2`
+b2bX 6Q` 2tKTH2- i?2 7QHHQrBM; +Q/2 }M/b i?2 T2`+2Mi;2 Q7  T2`bQMǶb
FMQrM M+2biQ`b r?Q HBp2/ Tbi dy U#v HBM2;2- bQ T2QTH2 Kv #2 +QmMi2/
KmHiBTH2 iBK2bV,
function countAncestors ( person , test ) {
function combine ( current , fromMother , fromFather ) {
var thisOneCounts = current != person && test ( current );
return fromMother + fromFather + ( thisOneCounts ? 1 : 0) ;
}
return reduceAncestors ( person , combine , 0) ;
}
function longLivingPercentage ( person ) {
var all = countAncestors ( person , function ( person ) {
return true ;
}) ;
var longLiving = countAncestors ( person , function ( person ) {
return ( person . died - person . born ) >= 70;
}) ;
return longLiving / all ;
}
console . log ( longLivingPercentage ( byName [" Emile Haverbeke "]) ) ;
// → 0.129

am+? MmK#2`b `2 MQi iQ #2 iF2M iQQ b2`BQmbHv- ;Bp2M i?i Qm` /i b2i
+QMiBMb  `i?2` `#Bi``v +QHH2+iBQM Q7 T2QTH2X "mi i?2 +Q/2 BHHmbi`i2b
i?2 7+i i?i reduceAncestors ;Bp2b mb  mb27mH TB2+2 Q7 pQ+#mH`v 7Q`
rQ`FBM; rBi? i?2 7KBHv i`22 /i bi`m+im`2X

RyR
"BM/BM;
h?2 bind K2i?Q/- r?B+? HH 7mM+iBQMb ?p2- +`2i2b  M2r 7mM+iBQM i?i
rBHH +HH i?2 Q`B;BMH 7mM+iBQM #mi rBi? bQK2 Q7 i?2 `;mK2Mib H`2/v
}t2/X
h?2 7QHHQrBM; +Q/2 b?Qrb M 2tKTH2 Q7 bind BM mb2X Ai /2}M2b  7mM+@
iBQM isInSet i?i i2HHb mb r?2i?2`  T2`bQM Bb BM  ;Bp2M b2i Q7 bi`BM;bX hQ
+HH filter BM Q`/2` iQ +QHH2+i i?Qb2 T2`bQM Q#D2+ib r?Qb2 MK2b `2 BM 
bT2+B}+ b2i- r2 +M 2Bi?2` r`Bi2  7mM+iBQM 2tT`2bbBQM i?i KF2b  +HH
iQ isInSet rBi? Qm` b2i b Bib }`bi `;mK2Mi Q` T`iBHHv TTHv i?2 isInSet
7mM+iBQMX
var theSet = [" Carel Haverbeke " , " Maria van Brussel ",
" Donald Duck "];
function isInSet ( set , person ) {
return set . indexOf ( person . name ) > -1;
}

console . log ( ancestry . filter ( function ( person ) {


return isInSet ( theSet , person ) ;
}) ) ;
// → [{ name : " Maria van Brussel " , ...},
// { name : " Carel Haverbeke " , ...}]
console . log ( ancestry . filter ( isInSet . bind ( null , theSet ) ) ) ;
// →... same result

h?2 +HH iQ bind `2im`Mb  7mM+iBQM i?i rBHH +HH isInSet rBi? theSet b
}`bi `;mK2Mi- 7QHHQr2/ #v Mv `2KBMBM; `;mK2Mib ;Bp2M iQ i?2 #QmM/
7mM+iBQMX
h?2 }`bi `;mK2Mi- r?2`2 i?2 2tKTH2 Tbb2b null- Bb mb2/ 7Q` K2i?Q/
+HHb- bBKBH` iQ i?2 }`bi `;mK2Mi iQ applyX AǶHH /2b+`B#2 i?Bb BM KQ`2
/2iBH BM i?2 M2ti +?Ti2`X

amKK`v
"2BM; #H2 iQ Tbb 7mM+iBQM pHm2b iQ Qi?2` 7mM+iBQMb Bb MQi Dmbi  ;BK@
KB+F #mi  /22THv mb27mH bT2+i Q7 Cpa+`BTiX Ai HHQrb mb iQ r`Bi2
+QKTmiiBQMb rBi? dz;TbǴ BM i?2K b 7mM+iBQMb M/ ?p2 i?2 +Q/2 i?i
+HHb i?2b2 7mM+iBQMb }HH BM i?Qb2 ;Tb #v T`QpB/BM; 7mM+iBQM pHm2b i?i

Ryk
/2b+`B#2 i?2 KBbbBM; +QKTmiiBQMbX
``vb T`QpB/2  MmK#2` Q7 mb27mH ?B;?2`@Q`/2` K2i?Q/běforEach iQ
/Q bQK2i?BM; rBi? 2+? 2H2K2Mi BM M ``v- filter iQ #mBH/  M2r ``v
rBi? bQK2 2H2K2Mib }Hi2`2/ Qmi- map iQ #mBH/  M2r ``v r?2`2 2+?
2H2K2Mi ?b #22M Tmi i?`Qm;?  7mM+iBQM- M/ reduce iQ +QK#BM2 HH M
``vǶb 2H2K2Mib BMiQ  bBM;H2 pHm2X
6mM+iBQMb ?p2 M apply K2i?Q/ i?i +M #2 mb2/ iQ +HH i?2K rBi? M
``v bT2+B7vBM; i?2B` `;mK2MibX h?2v HbQ ?p2  bind K2i?Q/- r?B+?
Bb mb2/ iQ +`2i2  T`iBHHv TTHB2/ p2`bBQM Q7 i?2 7mM+iBQMX

1t2`+Bb2b
6Hii2MBM;
lb2 i?2 reduce K2i?Q/ BM +QK#BMiBQM rBi? i?2 concat K2i?Q/ iQ dz~ii2MǴ
M ``v Q7 ``vb BMiQ  bBM;H2 ``v i?i ?b HH i?2 2H2K2Mib Q7 i?2 BMTmi
``vbX

JQi?2`@+?BH/ ;2 /Bz2`2M+2


lbBM; i?2 2tKTH2 /i b2i 7`QK i?Bb +?Ti2`- +QKTmi2 i?2 p2`;2 ;2
/Bz2`2M+2 #2ir22M KQi?2`b M/ +?BH/`2M Ui?2 ;2 Q7 i?2 KQi?2` r?2M
i?2 +?BH/ Bb #Q`MVX uQm +M mb2 i?2 average 7mM+iBQM /2}M2/ 2`HB2` BM
i?Bb +?Ti2`X
LQi2 i?i MQi HH i?2 KQi?2`b K2MiBQM2/ BM i?2 /i `2 i?2Kb2Hp2b
T`2b2Mi BM i?2 ``vX h?2 byName Q#D2+i- r?B+? KF2b Bi 2bv iQ }M/ 
T2`bQMǶb Q#D2+i 7`QK i?2B` MK2- KB;?i #2 mb27mH ?2`2X

>BbiQ`B+H HB72 2tT2+iM+v


q?2M r2 HQQF2/ mT HH i?2 T2QTH2 BM Qm` /i b2i i?i HBp2/ KQ`2 i?M
Ny v2`b- QMHv i?2 Hi2bi ;2M2`iBQM BM i?2 /i +K2 QmiX G2iǶb iF2 
+HQb2` HQQF i i?i T?2MQK2MQMX
*QKTmi2 M/ QmiTmi i?2 p2`;2 ;2 Q7 i?2 T2QTH2 BM i?2 M+2bi`v /i
b2i T2` +2Mim`vX  T2`bQM Bb bbB;M2/ iQ  +2Mim`v #v iFBM; i?2B` v2`
Q7 /2i?- /BpB/BM; Bi #v Ryy- M/ `QmM/BM; Bi mT- b BM Math.ceil(person.
died / 100)X

Ryj
6Q` #QMmb TQBMib- r`Bi2  7mM+iBQM groupBy i?i #bi`+ib i?2 ;`QmTBM;
QT2`iBQMX Ai b?QmH/ ++2Ti b `;mK2Mib M ``v M/  7mM+iBQM i?i
+QKTmi2b i?2 ;`QmT 7Q` M 2H2K2Mi BM i?2 ``v M/ `2im`Mb M Q#D2+i
i?i KTb ;`QmT MK2b iQ ``vb Q7 ;`QmT K2K#2`bX

1p2`v M/ i?2M bQK2


``vb HbQ +QK2 rBi? i?2 biM/`/ K2i?Q/b every M/ someX "Qi? iF2 
T`2/B+i2 7mM+iBQM i?i- r?2M +HH2/ rBi? M ``v 2H2K2Mi b `;mK2Mi-
`2im`Mb i`m2 Q` 7Hb2X Cmbi HBF2 && `2im`Mb  i`m2 pHm2 QMHv r?2M i?2
2tT`2bbBQMb QM #Qi? bB/2b `2 i`m2- every `2im`Mb i`m2 QMHv r?2M i?2
T`2/B+i2 `2im`Mb i`m2 7Q` HH 2H2K2Mib Q7 i?2 ``vX aBKBH`Hv- some `2im`Mb
i`m2 b bQQM b i?2 T`2/B+i2 `2im`Mb i`m2 7Q` Mv Q7 i?2 2H2K2MibX h?2v
/Q MQi T`Q+2bb KQ`2 2H2K2Mib i?M M2+2bb`vě7Q` 2tKTH2- B7 some }M/b
i?i i?2 T`2/B+i2 ?QH/b 7Q` i?2 }`bi 2H2K2Mi Q7 i?2 ``v- Bi rBHH MQi HQQF
i i?2 pHm2b 7i2` i?iX
q`Bi2 irQ 7mM+iBQMb- every M/ some- i?i #2?p2 HBF2 i?2b2 K2i?Q/b-
2t+2Ti i?i i?2v iF2 i?2 ``v b i?2B` }`bi `;mK2Mi `i?2` i?M #2BM;
 K2i?Q/X

Ry9
dzh?2 T`Q#H2K rBi? Q#D2+i@Q`B2Mi2/ HM;m;2b Bb i?2vǶp2 ;Qi HH
i?Bb BKTHB+Bi 2MpB`QMK2Mi i?i i?2v +``v `QmM/ rBi? i?2KX
uQm rMi2/  #MM #mi r?i vQm ;Qi rb  ;Q`BHH ?QH/BM;
i?2 #MM M/ i?2 2MiB`2 DmM;H2XǴ
ěCQ2 `Kbi`QM;- BMi2`pB2r2/ BM *Q/2`b i qQ`F

e h?2 a2+`2i GB72 Q7 P#D2+ib


q?2M  T`Q;`KK2` bvb dzQ#D2+iǴ- i?Bb Bb  HQ/2/ i2`KX AM Kv T`Q72b@
bBQM- Q#D2+ib `2  rv Q7 HB72- i?2 bm#D2+i Q7 ?QHv r`b- M/  #2HQp2/
#mxxrQ`/ i?i biBHH ?bMǶi [mBi2 HQbi Bib TQr2`X
hQ M QmibB/2`- i?Bb Bb T`Q##Hv  HBiiH2 +QM7mbBM;X G2iǶb bi`i rBi? 
#`B27 ?BbiQ`v Q7 Q#D2+ib b  T`Q;`KKBM; +QMbi`m+iX

>BbiQ`v
h?Bb biQ`v- HBF2 KQbi T`Q;`KKBM; biQ`B2b- bi`ib rBi? i?2 T`Q#H2K Q7
+QKTH2tBivX PM2 T?BHQbQT?v Bb i?i +QKTH2tBiv +M #2 K/2 KM;2#H2
#v b2T`iBM; Bi BMiQ bKHH +QKT`iK2Mib i?i `2 BbQHi2/ 7`QK 2+?
Qi?2`X h?2b2 +QKT`iK2Mib ?p2 2M/2/ mT rBi? i?2 MK2 Q#D2+ibX
M Q#D2+i Bb  ?`/ b?2HH i?i ?B/2b i?2 ;QQ2v +QKTH2tBiv BMbB/2 Bi M/
BMbi2/ Qz2`b mb  72r FMQ#b M/ +QMM2+iQ`b Ubm+? b K2i?Q/bV i?i
T`2b2Mi M BMi2`7+2 i?`Qm;? r?B+? i?2 Q#D2+i Bb iQ #2 mb2/X h?2 B/2 Bb
i?i i?2 BMi2`7+2 Bb `2HiBp2Hv bBKTH2 M/ HH i?2 +QKTH2t i?BM;b ;QBM;
QM BMbB/2 i?2 Q#D2+i +M #2 B;MQ`2/ r?2M rQ`FBM; rBi? BiX

Ry8
b M 2tKTH2- vQm +M BK;BM2 M Q#D2+i i?i T`QpB/2b M BMi2`7+2 iQ
M `2 QM vQm` b+`22MX Ai T`QpB/2b  rv iQ /`r b?T2b Q` i2ti QMiQ i?Bb
`2 #mi ?B/2b HH i?2 /2iBHb Q7 ?Qr i?2b2 b?T2b `2 +QMp2`i2/ iQ i?2
+imH TBt2Hb i?i KF2 mT i?2 b+`22MX uQmǶ/ ?p2  b2i Q7 K2i?Q/bě7Q`
2tKTH2- drawCircleěM/ i?Qb2 `2 i?2 QMHv i?BM;b vQm M22/ iQ FMQr BM
Q`/2` iQ mb2 bm+? M Q#D2+iX
h?2b2 B/2b r2`2 BMBiBHHv rQ`F2/ Qmi BM i?2 RNdyb M/ RN3yb M/- BM
i?2 RNNyb- r2`2 +``B2/ mT #v  ?m;2 rp2 Q7 ?vT2ěi?2 Q#D2+i@Q`B2Mi2/
T`Q;`KKBM; `2pQHmiBQMX am//2MHv- i?2`2 rb  H`;2 i`B#2 Q7 T2QTH2
/2+H`BM; i?i Q#D2+ib r2`2 i?2 `B;?i rv iQ T`Q;`KěM/ i?i Mvi?BM;
i?i /B/ MQi BMpQHp2 Q#D2+ib rb Qmi/i2/ MQMb2Mb2X
h?i FBM/ Q7 x2HQi`v Hrvb T`Q/m+2b  HQi Q7 BKT`+iB+H bBHHBM2bb- M/
i?2`2 ?b #22M  bQ`i Q7 +QmMi2`@`2pQHmiBQM bBM+2 i?2MX AM bQK2 +B`+H2b-
Q#D2+ib ?p2  `i?2` #/ `2TmiiBQM MQr/vbX
A T`272` iQ HQQF i i?2 Bbbm2 7`QK  T`+iB+H- `i?2` i?M B/2QHQ;B@
+H- M;H2X h?2`2 `2 b2p2`H mb27mH +QM+2Tib- KQbi BKTQ`iMiHv i?i Q7
2M+TbmHiBQM U/BbiBM;mBb?BM; #2ir22M BMi2`MH +QKTH2tBiv M/ 2ti2`MH
BMi2`7+2V- i?i i?2 Q#D2+i@Q`B2Mi2/ +mHim`2 ?b TQTmH`Bx2/X h?2b2 `2
rQ`i? bim/vBM;X
h?Bb +?Ti2` /2b+`B#2b Cpa+`BTiǶb `i?2` 2++2Mi`B+ iF2 QM Q#D2+ib
M/ i?2 rv i?2v `2Hi2 iQ bQK2 +HbbB+H Q#D2+i@Q`B2Mi2/ i2+?MB[m2bX

Rye
J2i?Q/b
J2i?Q/b `2 bBKTHv T`QT2`iB2b i?i ?QH/ 7mM+iBQM pHm2bX h?Bb Bb  bBKTH2
K2i?Q/,
var rabbit = {};
rabbit . speak = function ( line ) {
console . log (" The rabbit says " + line + " ") ;
};

rabbit . speak (" I m alive .") ;


// → The rabbit says I m alive .

lbmHHv  K2i?Q/ M22/b iQ /Q bQK2i?BM; rBi? i?2 Q#D2+i Bi rb +HH2/


QMX q?2M  7mM+iBQM Bb +HH2/ b  K2i?Q/ěHQQF2/ mT b  T`QT2`iv M/
BKK2/Bi2Hv +HH2/- b BM object.method()ěi?2 bT2+BH p`B#H2 this BM Bib
#Q/v rBHH TQBMi iQ i?2 Q#D2+i i?i Bi rb +HH2/ QMX
function speak ( line ) {
console . log (" The " + this . type + " rabbit says " +
line + " ") ;
}
var whiteRabbit = { type : " white " , speak : speak };
var fatRabbit = { type : " fat " , speak : speak };

whiteRabbit . speak (" Oh my ears and whiskers , " +


" how late it s getting !") ;
// → The white rabbit says Oh my ears and whiskers , how
// late it s getting !
fatRabbit . speak (" I could sure use a carrot right now .") ;
// → The fat rabbit says I could sure use a carrot
// right now .

h?2 +Q/2 mb2b i?2 this F2vrQ`/ iQ QmiTmi i?2 ivT2 Q7 `##Bi i?i Bb
bT2FBM;X _2+HH i?i i?2 apply M/ bind K2i?Q/b #Qi? iF2  }`bi `;m@
K2Mi i?i +M #2 mb2/ iQ bBKmHi2 K2i?Q/ +HHbX h?Bb }`bi `;mK2Mi Bb
BM 7+i mb2/ iQ ;Bp2  pHm2 iQ thisX
h?2`2 Bb  K2i?Q/ bBKBH` iQ apply- +HH2/ callX Ai HbQ +HHb i?2 7mM+iBQM
Bi Bb  K2i?Q/ Q7 #mi iF2b Bib `;mK2Mib MQ`KHHv- `i?2` i?M b M
``vX GBF2 apply M/ bind- call +M #2 Tbb2/  bT2+B}+ this pHm2X
speak . apply ( fatRabbit , [" Burp !"]) ;

Ryd
// → The fat rabbit says Burp !
speak . call ({ type : " old "} , " Oh my .") ;
// → The old rabbit says Oh my .

S`QiQivT2b
qi+? +HQb2HvX
var empty = {};
console . log ( empty . toString );
// → function toString ()...{}
console . log ( empty . toString () ) ;
// → [ object Object ]

A Dmbi TmHH2/  T`QT2`iv Qmi Q7 M 2KTiv Q#D2+iX J;B+5


q2HH- MQi `2HHvX A ?p2 bBKTHv #22M rBi??QH/BM; BM7Q`KiBQM #Qmi
i?2 rv Cpa+`BTi Q#D2+ib rQ`FX AM //BiBQM iQ i?2B` b2i Q7 T`QT2`iB2b-
HKQbi HH Q#D2+ib HbQ ?p2  T`QiQivT2X  T`QiQivT2 Bb MQi?2` Q#D2+i
i?i Bb mb2/ b  7HH#+F bQm`+2 Q7 T`QT2`iB2bX q?2M M Q#D2+i ;2ib
 `2[m2bi 7Q`  T`QT2`iv i?i Bi /Q2b MQi ?p2- Bib T`QiQivT2 rBHH #2
b2`+?2/ 7Q` i?2 T`QT2`iv- i?2M i?2 T`QiQivT2Ƕb T`QiQivT2- M/ bQ QMX
aQ r?Q Bb i?2 T`QiQivT2 Q7 i?i 2KTiv Q#D2+i\ Ai Bb i?2 ;`2i M+2bi`H
T`QiQivT2- i?2 2MiBiv #2?BM/ HKQbi HH Q#D2+ib- Object.prototypeX
console . log ( Object . getPrototypeOf ({}) ==
Object . prototype );
// → true
console . log ( Object . getPrototypeOf ( Object . prototype ) ) ;
// → null

b vQm KB;?i 2tT2+i- i?2 Object.getPrototypeOf 7mM+iBQM `2im`Mb i?2 T`Q@


iQivT2 Q7 M Q#D2+iX
h?2 T`QiQivT2 `2HiBQMb Q7 Cpa+`BTi Q#D2+ib 7Q`K  i`22@b?T2/ bi`m+@
im`2- M/ i i?2 `QQi Q7 i?Bb bi`m+im`2 bBib Object.prototypeX Ai T`QpB/2b 
72r K2i?Q/b i?i b?Qr mT BM HH Q#D2+ib- bm+? b toString- r?B+? +QMp2`ib
M Q#D2+i iQ  bi`BM; `2T`2b2MiiBQMX
JMv Q#D2+ib /QMǶi /B`2+iHv ?p2 Object.prototype b i?2B` T`QiQivT2-
#mi BMbi2/ ?p2 MQi?2` Q#D2+i- r?B+? T`QpB/2b Bib QrM /27mHi T`QT@
2`iB2bX 6mM+iBQMb /2`Bp2 7`QK Function.prototype- M/ ``vb /2`Bp2 7`QK

Ry3
Array.prototypeX

console . log ( Object . getPrototypeOf ( isNaN ) ==


Function . prototype ) ;
// → true
console . log ( Object . getPrototypeOf ([]) ==
Array . prototype );
// → true

am+?  T`QiQivT2 Q#D2+i rBHH Bib2H7 ?p2  T`QiQivT2- Q7i2M Object.prototype


- bQ i?i Bi biBHH BM/B`2+iHv T`QpB/2b K2i?Q/b HBF2 toStringX
h?2 Object.getPrototypeOf 7mM+iBQM Q#pBQmbHv `2im`Mb i?2 T`QiQivT2 Q7
M Q#D2+iX uQm +M mb2 Object.create iQ +`2i2 M Q#D2+i rBi?  bT2+B}+
T`QiQivT2X
var protoRabbit = {
speak : function ( line ) {
console . log (" The " + this . type + " rabbit says " +
line + " ") ;
}
};
var killerRabbit = Object . create ( protoRabbit );
killerRabbit . type = " killer ";
killerRabbit . speak (" SKREEEE !") ;
// → The killer rabbit says SKREEEE !

h?2 dzT`QiQǴ `##Bi +ib b  +QMiBM2` 7Q` i?2 T`QT2`iB2b i?i `2 b?`2/
#v HH `##BibX M BM/BpB/mH `##Bi Q#D2+i- HBF2 i?2 FBHH2` `##Bi- +QMiBMb
T`QT2`iB2b i?i TTHv QMHv iQ Bib2H7ěBM i?Bb +b2 Bib ivT2ěM/ /2`Bp2b
b?`2/ T`QT2`iB2b 7`QK Bib T`QiQivT2X

*QMbi`m+iQ`b
 KQ`2 +QMp2MB2Mi rv iQ +`2i2 Q#D2+ib i?i /2`Bp2 7`QK bQK2 b?`2/
T`QiQivT2 Bb iQ mb2  +QMbi`m+iQ`X AM Cpa+`BTi- +HHBM;  7mM+iBQM rBi?
i?2 new F2vrQ`/ BM 7`QMi Q7 Bi +mb2b Bi iQ #2 i`2i2/ b  +QMbi`m+iQ`X
h?2 +QMbi`m+iQ` rBHH ?p2 Bib this p`B#H2 #QmM/ iQ  7`2b? Q#D2+i- M/
mMH2bb Bi 2tTHB+BiHv `2im`Mb MQi?2` Q#D2+i pHm2- i?Bb M2r Q#D2+i rBHH #2
`2im`M2/ 7`QK i?2 +HHX
M Q#D2+i +`2i2/ rBi? new Bb bB/ iQ #2 M BMbiM+2 Q7 Bib +QMbi`m+iQ`X

RyN
>2`2 Bb  bBKTH2 +QMbi`m+iQ` 7Q` `##BibX Ai Bb  +QMp2MiBQM iQ +TBiHBx2
i?2 MK2b Q7 +QMbi`m+iQ`b bQ i?i i?2v `2 2bBHv /BbiBM;mBb?2/ 7`QK Qi?2`
7mM+iBQMbX
function Rabbit ( type ) {
this . type = type ;
}

var killerRabbit = new Rabbit (" killer ") ;


var blackRabbit = new Rabbit (" black ") ;
console . log ( blackRabbit . type ) ;
// → black

*QMbi`m+iQ`b UBM 7+i- HH 7mM+iBQMbV miQKiB+HHv ;2i  T`QT2`iv MK2/


prototype- r?B+? #v /27mHi ?QH/b  THBM- 2KTiv Q#D2+i i?i /2`Bp2b 7`QK
Object.prototypeX 1p2`v BMbiM+2 +`2i2/ rBi? i?Bb +QMbi`m+iQ` rBHH ?p2
i?Bb Q#D2+i b Bib T`QiQivT2X aQ iQ //  speak K2i?Q/ iQ `##Bib +`2i2/
rBi? i?2 Rabbit +QMbi`m+iQ`- r2 +M bBKTHv /Q i?Bb,
Rabbit . prototype . speak = function ( line ) {
console . log (" The " + this . type + " rabbit says " +
line + " ") ;
};
blackRabbit . speak (" Doom ...") ;
// → The black rabbit says Doom ...

Ai Bb BKTQ`iMi iQ MQi2 i?2 /BbiBM+iBQM #2ir22M i?2 rv  T`QiQivT2


Bb bbQ+Bi2/ rBi?  +QMbi`m+iQ` Ui?`Qm;? Bib prototype T`QT2`ivV M/
i?2 rv Q#D2+ib ?p2  T`QiQivT2 Ur?B+? +M #2 `2i`B2p2/ rBi? Object.
getPrototypeOfVX h?2 +imH T`QiQivT2 Q7  +QMbi`m+iQ` Bb Function.prototype
bBM+2 +QMbi`m+iQ`b `2 7mM+iBQMbX Aib prototype T`QT2`iv rBHH #2 i?2 T`QiQ@
ivT2 Q7 BMbiM+2b +`2i2/ i?`Qm;? Bi #mi Bb MQi Bib QrM T`QiQivT2X

Pp2``B/BM; /2`Bp2/ T`QT2`iB2b


q?2M vQm //  T`QT2`iv iQ M Q#D2+i- r?2i?2` Bi Bb T`2b2Mi BM i?2
T`QiQivT2 Q` MQi- i?2 T`QT2`iv Bb //2/ iQ i?2 Q#D2+i Bib2H7- r?B+? rBHH
?2M+27Q`i? ?p2 Bi b Bib QrM T`QT2`ivX A7 i?2`2 Bb  T`QT2`iv #v i?2 bK2
MK2 BM i?2 T`QiQivT2- i?Bb T`QT2`iv rBHH MQ HQM;2` z2+i i?2 Q#D2+iX h?2
T`QiQivT2 Bib2H7 Bb MQi +?M;2/X

RRy
Rabbit . prototype . teeth = " small ";
console . log ( killerRabbit . teeth ) ;
// → small
killerRabbit . teeth = " long , sharp , and bloody ";
console . log ( killerRabbit . teeth ) ;
// → long , sharp , and bloody
console . log ( blackRabbit . teeth );
// → small
console . log ( Rabbit . prototype . teeth ) ;
// → small

h?2 7QHHQrBM; /B;`K bF2i+?2b i?2 bBimiBQM 7i2` i?Bb +Q/2 ?b `mMX h?2
Rabbit M/ Object T`QiQivT2b HB2 #2?BM/ killerRabbit b  FBM/ Q7 #+F/`QT-
r?2`2 T`QT2`iB2b i?i `2 MQi 7QmM/ BM i?2 Q#D2+i Bib2H7 +M #2 HQQF2/ mTX
Rabbit

prototype

Object
killerRabbit
create: <function>
teeth: "long, sharp, ..."
prototype
adjective: "killer"
...
teeth: "small"
speak: <function>
toString: <function>
...

Pp2``B/BM; T`QT2`iB2b i?i 2tBbi BM  T`QiQivT2 Bb Q7i2M  mb27mH i?BM;


iQ /QX b i?2 `##Bi i22i? 2tKTH2 b?Qrb- Bi +M #2 mb2/ iQ 2tT`2bb
2t+2TiBQMH T`QT2`iB2b BM BMbiM+2b Q7  KQ`2 ;2M2`B+ +Hbb Q7 Q#D2+ib-
r?BH2 H2iiBM; i?2 MQM2t+2TiBQMH Q#D2+ib bBKTHv iF2  biM/`/ pHm2
7`QK i?2B` T`QiQivT2X
Ai Bb HbQ mb2/ iQ ;Bp2 i?2 biM/`/ 7mM+iBQM M/ ``v T`QiQivT2b 
/Bz2`2Mi toString K2i?Q/ i?M i?2 #bB+ Q#D2+i T`QiQivT2X
console . log ( Array . prototype . toString ==
Object . prototype . toString ) ;
// → false
console . log ([1 , 2]. toString () ) ;
// → 1 ,2

*HHBM; toString QM M ``v ;Bp2b  `2bmHi bBKBH` iQ +HHBM; .join(",")


QM BiěBi Tmib +QKKb #2ir22M i?2 pHm2b BM i?2 ``vX .B`2+iHv +HHBM;

RRR
rBi? M ``v T`Q/m+2b  /Bz2`2Mi bi`BM;X h?i
Object.prototype.toString
7mM+iBQM /Q2bMǶi FMQr #Qmi ``vb- bQ Bi bBKTHv Tmib i?2 rQ`/ dzQ#D2+iǴ
M/ i?2 MK2 Q7 i?2 ivT2 #2ir22M b[m`2 #`+F2ibX
console . log ( Object . prototype . toString . call ([1 , 2]) ) ;
// → [ object Array ]

S`QiQivT2 BMi2`72`2M+2
 T`QiQivT2 +M #2 mb2/ i Mv iBK2 iQ // M2r T`QT2`iB2b M/ K2i?Q/b
iQ HH Q#D2+ib #b2/ QM BiX 6Q` 2tKTH2- Bi KB;?i #2+QK2 M2+2bb`v 7Q`
Qm` `##Bib iQ /M+2X
Rabbit . prototype . dance = function () {
console . log (" The " + this . type + " rabbit dances a jig .") ;
};
killerRabbit . dance () ;
// → The killer rabbit dances a jig .

h?iǶb +QMp2MB2MiX "mi i?2`2 `2 bBimiBQMb r?2`2 Bi +mb2b T`Q#H2KbX


AM T`2pBQmb +?Ti2`b- r2 mb2/ M Q#D2+i b  rv iQ bbQ+Bi2 pHm2b
rBi? MK2b #v +`2iBM; T`QT2`iB2b 7Q` i?2 MK2b M/ ;BpBM; i?2K i?2
+Q``2bTQM/BM; pHm2 b i?2B` pHm2X >2`2Ƕb M 2tKTH2 7`QK *?Ti2` 9,
var map = {};
function storePhi ( event , phi ) {
map [ event ] = phi ;
}

storePhi (" pizza " , 0.069) ;


storePhi (" touched tree " , -0.081) ;

q2 +M Bi2`i2 Qp2` HH T?B pHm2b BM i?2 Q#D2+i mbBM;  forfin HQQT M/
i2bi r?2i?2`  MK2 Bb BM i?2`2 mbBM; i?2 `2;mH` in QT2`iQ`X "mi
mM7Q`imMi2Hv- i?2 Q#D2+iǶb T`QiQivT2 ;2ib BM i?2 rvX
Object . prototype . nonsense = " hi ";
for ( var name in map )
console . log ( name ) ;
// → pizza

RRk
// → touched tree
// → nonsense
console . log (" nonsense " in map ) ;
// → true
console . log (" toString " in map ) ;
// → true

// Delete the problematic property again


delete Object . prototype . nonsense ;

h?iǶb HH r`QM;X h?2`2 Bb MQ 2p2Mi +HH2/ dzMQMb2Mb2Ǵ BM Qm` /i b2iX
M/ i?2`2 /2}MBi2Hv Bb MQ 2p2Mi +HH2/ dziQai`BM;ǴX
P//Hv- toString /B/ MQi b?Qr mT BM i?2 forfin HQQT- #mi i?2 in QT2`iQ`
/B/ `2im`M i`m2 7Q` BiX h?Bb Bb #2+mb2 Cpa+`BTi /BbiBM;mBb?2b #2ir22M
2MmK2`#H2 M/ MQM2MmK2`#H2 T`QT2`iB2bX
HH T`QT2`iB2b i?i r2 +`2i2 #v bBKTHv bbB;MBM; iQ i?2K `2 2MmK2`@
#H2X h?2 biM/`/ T`QT2`iB2b BM Object.prototype `2 HH MQM2MmK2`#H2-
r?B+? Bb r?v i?2v /Q MQi b?Qr mT BM bm+?  forfin HQQTX
Ai Bb TQbbB#H2 iQ /2}M2 Qm` QrM MQM2MmK2`#H2 T`QT2`iB2b #v mbBM;
i?2 Object.defineProperty 7mM+iBQM- r?B+? HHQrb mb iQ +QMi`QH i?2 ivT2 Q7
T`QT2`iv r2 `2 +`2iBM;X
Object . defineProperty ( Object . prototype , " hiddenNonsense " ,
{ enumerable : false , value : " hi "}) ;
for ( var name in map )
console . log ( name ) ;
// → pizza
// → touched tree
console . log ( map . hiddenNonsense );
// → hi

aQ MQr i?2 T`QT2`iv Bb i?2`2- #mi Bi rQMǶi b?Qr mT BM  HQQTX h?iǶb


;QQ/X "mi r2 biBHH ?p2 i?2 T`Q#H2K rBi? i?2 `2;mH` in QT2`iQ` +HBKBM;
i?i i?2 Object.prototype T`QT2`iB2b 2tBbi BM Qm` Q#D2+iX 6Q` i?i- r2 +M
mb2 i?2 Q#D2+iǶb hasOwnProperty K2i?Q/X
console . log ( map . hasOwnProperty (" toString ") ) ;
// → false

h?Bb K2i?Q/ i2HHb mb r?2i?2` i?2 Q#D2+i Bib2H7 ?b i?2 T`QT2`iv- rBi?Qmi
HQQFBM; i Bib T`QiQivT2bX h?Bb Bb Q7i2M  KQ`2 mb27mH TB2+2 Q7 BM7Q`KiBQM

RRj
i?M r?i i?2 in QT2`iQ` ;Bp2b mbX
q?2M vQm `2 rQ``B2/ i?i bQK2QM2 UbQK2 Qi?2` +Q/2 vQm HQ/2/ BMiQ
vQm` T`Q;`KV KB;?i ?p2 K2bb2/ rBi? i?2 #b2 Q#D2+i T`QiQivT2- A
`2+QKK2M/ vQm r`Bi2 vQm` forfin HQQTb HBF2 i?Bb,
for ( var name in map ) {
if ( map . hasOwnProperty ( name ) ) {
// ... this is an own property
}
}

S`QiQivT2@H2bb Q#D2+ib
"mi i?2 `##Bi ?QH2 /Q2bMǶi 2M/ i?2`2X q?i B7 bQK2QM2 `2;Bbi2`2/ i?2
MK2 hasOwnProperty BM Qm` map Q#D2+i M/ b2i Bi iQ i?2 pHm2 9k\ LQr i?2
+HH iQ map.hasOwnProperty rBHH i`v iQ +HH i?2 HQ+H T`QT2`iv- r?B+? ?QH/b
 MmK#2`- MQi  7mM+iBQMX
AM bm+?  +b2- T`QiQivT2b Dmbi ;2i BM i?2 rv- M/ r2 rQmH/ +imHHv
T`272` iQ ?p2 Q#D2+ib rBi?Qmi T`QiQivT2bX q2 br i?2 Object.create
7mM+iBQM- r?B+? HHQrb mb iQ +`2i2 M Q#D2+i rBi?  bT2+B}+ T`QiQivT2X
uQm `2 HHQr2/ iQ Tbb null b i?2 T`QiQivT2 iQ +`2i2  7`2b? Q#D2+i
rBi? MQ T`QiQivT2X 6Q` Q#D2+ib HBF2 map- r?2`2 i?2 T`QT2`iB2b +QmH/ #2
Mvi?BM;- i?Bb Bb 2t+iHv r?i r2 rMiX
var map = Object . create ( null );
map [" pizza "] = 0.069;
console . log (" toString " in map ) ;
// → false
console . log (" pizza " in map ) ;
// → true

Jm+? #2ii2`5 q2 MQ HQM;2` M22/ i?2 hasOwnProperty FHm/;2 #2+mb2 HH i?2
T`QT2`iB2b i?2 Q#D2+i ?b `2 Bib QrM T`QT2`iB2bX LQr r2 +M b72Hv mb2
forfin HQQTb- MQ Kii2` r?i T2QTH2 ?p2 #22M /QBM; iQ Object.prototypeX

RR9
SQHvKQ`T?BbK
q?2M vQm +HH i?2 String 7mM+iBQM- r?B+? +QMp2`ib  pHm2 iQ  bi`BM;- QM
M Q#D2+i- Bi rBHH +HH i?2 toString K2i?Q/ QM i?i Q#D2+i iQ i`v iQ +`2i2
 K2MBM;7mH bi`BM; iQ `2im`MX A K2MiBQM2/ i?i bQK2 Q7 i?2 biM/`/
T`QiQivT2b /2}M2 i?2B` QrM p2`bBQM Q7 toString bQ i?2v +M +`2i2  bi`BM;
i?i +QMiBMb KQ`2 mb27mH BM7Q`KiBQM i?M "[object Object]"X
h?Bb Bb  bBKTH2 BMbiM+2 Q7  TQr2`7mH B/2X q?2M  TB2+2 Q7 +Q/2
Bb r`Bii2M iQ rQ`F rBi? Q#D2+ib i?i ?p2  +2`iBM BMi2`7+2ěBM i?Bb
+b2-  toString K2i?Q/ěMv FBM/ Q7 Q#D2+i i?i ?TT2Mb iQ bmTTQ`i
i?Bb BMi2`7+2 +M #2 THm;;2/ BMiQ i?2 +Q/2- M/ Bi rBHH Dmbi rQ`FX
h?Bb i2+?MB[m2 Bb +HH2/ TQHvKQ`T?BbKěi?Qm;? MQ +imH b?T2@b?B7iBM;
Bb BMpQHp2/X SQHvKQ`T?B+ +Q/2 +M rQ`F rBi? pHm2b Q7 /Bz2`2Mi b?T2b-
b HQM; b i?2v bmTTQ`i i?2 BMi2`7+2 Bi 2tT2+ibX

GvBM; Qmi  i#H2


A K ;QBM; iQ rQ`F i?`Qm;?  bHB;?iHv KQ`2 BMpQHp2/ 2tKTH2 BM M
ii2KTi iQ ;Bp2 vQm  #2ii2` B/2 r?i TQHvKQ`T?BbK- b r2HH b Q#D2+i@
Q`B2Mi2/ T`Q;`KKBM; BM ;2M2`H- HQQFb HBF2X h?2 T`QD2+i Bb i?Bb, r2 rBHH
r`Bi2  T`Q;`K i?i- ;Bp2M M ``v Q7 ``vb Q7 i#H2 +2HHb- #mBH/b mT 
bi`BM; i?i +QMiBMb  MB+2Hv HB/ Qmi i#H2ěK2MBM; i?i i?2 +QHmKMb
`2 bi`B;?i M/ i?2 `Qrb `2 HB;M2/X aQK2i?BM; HBF2 i?Bb,
name height country
------------ ------ -------------
Kilimanjaro 5895 Tanzania
Everest 8848 Nepal
Mount Fuji 3776 Japan
Mont Blanc 4808 Italy / France
Vaalserberg 323 Netherlands
Denali 6168 United States
Popocatepetl 5465 Mexico

h?2 rv Qm` i#H2@#mBH/BM; bvbi2K rBHH rQ`F Bb i?i i?2 #mBH/2` 7mM+iBQM
rBHH bF 2+? +2HH ?Qr rB/2 M/ ?B;? Bi rMib iQ #2 M/ i?2M mb2 i?Bb
BM7Q`KiBQM iQ /2i2`KBM2 i?2 rB/i? Q7 i?2 +QHmKMb M/ i?2 ?2B;?i Q7 i?2
`QrbX h?2 #mBH/2` 7mM+iBQM rBHH i?2M bF i?2 +2HHb iQ /`r i?2Kb2Hp2b i

RR8
i?2 +Q``2+i bBx2 M/ bb2K#H2 i?2 `2bmHib BMiQ  bBM;H2 bi`BM;X
h?2 HvQmi T`Q;`K rBHH +QKKmMB+i2 rBi? i?2 +2HH Q#D2+ib i?`Qm;?
 r2HH@/2}M2/ BMi2`7+2X h?i rv- i?2 ivT2b Q7 +2HHb i?i i?2 T`Q;`K
bmTTQ`ib Bb MQi }t2/ BM /pM+2X q2 +M // M2r +2HH bivH2b Hi2`ě
7Q` 2tKTH2- mM/2`HBM2/ +2HHb 7Q` i#H2 ?2/2`běM/ B7 i?2v bmTTQ`i Qm`
BMi2`7+2- i?2v rBHH Dmbi rQ`F- rBi?Qmi `2[mB`BM; +?M;2b iQ i?2 HvQmi
T`Q;`KX
h?Bb Bb i?2 BMi2`7+2,

Ç minHeight() `2im`Mb  MmK#2` BM/B+iBM; i?2 KBMBKmK ?2B;?i i?Bb


+2HH `2[mB`2b UBM HBM2bVX

Ç minWidth() `2im`Mb  MmK#2` BM/B+iBM; i?Bb +2HHǶb KBMBKmK rB/i?


UBM +?`+i2`bVX

Ç draw(width, height) `2im`Mb M ``v Q7 H2M;i? height- r?B+? +QMiBMb


 b2`B2b Q7 bi`BM;b i?i `2 2+? width +?`+i2`b rB/2X h?Bb `2T`2@
b2Mib i?2 +QMi2Mi Q7 i?2 +2HHX

AǶK ;QBM; iQ KF2 ?2pv mb2 Q7 ?B;?2`@Q`/2` ``v K2i?Q/b BM i?Bb 2t@
KTH2 bBM+2 Bi H2M/b Bib2H7 r2HH iQ i?i TT`Q+?X
h?2 }`bi T`i Q7 i?2 T`Q;`K +QKTmi2b ``vb Q7 KBMBKmK +QHmKM
rB/i?b M/ `Qr ?2B;?ib 7Q`  ;`B/ Q7 +2HHbX h?2 rows p`B#H2 rBHH ?QH/ M
``v Q7 ``vb- rBi? 2+? BMM2` ``v `2T`2b2MiBM;  `Qr Q7 +2HHbX
function rowHeights ( rows ) {
return rows . map ( function ( row ) {
return row . reduce ( function ( max , cell ) {
return Math . max ( max , cell . minHeight () ) ;
}, 0) ;
}) ;
}

function colWidths ( rows ) {


return rows [0]. map ( function (_ , i ) {
return rows . reduce ( function ( max , row ) {
return Math . max ( max , row [ i ]. minWidth () ) ;
}, 0) ;
}) ;
}

RRe
lbBM;  p`B#H2 MK2 bi`iBM; rBi? M mM/2`b+Q`2 UnV Q` +QMbBbiBM;
2MiB`2Hv Q7  bBM;H2 mM/2`b+Q`2 Bb  rv iQ BM/B+i2 UiQ ?mKM `2/2`bV
i?i i?Bb `;mK2Mi Bb MQi ;QBM; iQ #2 mb2/X
h?2 rowHeights 7mM+iBQM b?QmH/MǶi #2 iQQ ?`/ iQ 7QHHQrX Ai mb2b reduce
iQ +QKTmi2 i?2 KtBKmK ?2B;?i Q7 M ``v Q7 +2HHb M/ r`Tb i?i BM
map BM Q`/2` iQ /Q Bi 7Q` HH `Qrb BM i?2 rows ``vX
h?BM;b `2 bHB;?iHv ?`/2` 7Q` i?2 colWidths 7mM+iBQM #2+mb2 i?2 Qmi2`
``v Bb M ``v Q7 `Qrb- MQi Q7 +QHmKMbX A ?p2 7BH2/ iQ K2MiBQM bQ
7` i?i map Ub r2HH b forEach- filter- M/ bBKBH` ``v K2i?Q/bV Tbb2b
 b2+QM/ `;mK2Mi iQ i?2 7mM+iBQM Bi Bb ;Bp2M, i?2 BM/2t Q7 i?2 +m``2Mi
2H2K2MiX "v KTTBM; Qp2` i?2 2H2K2Mib Q7 i?2 }`bi `Qr M/ QMHv mbBM;
i?2 KTTBM; 7mM+iBQMǶb b2+QM/ `;mK2Mi- colWidths #mBH/b mT M ``v
rBi? QM2 2H2K2Mi 7Q` 2p2`v +QHmKM BM/2tX h?2 +HH iQ reduce `mMb Qp2`
i?2 Qmi2` rows ``v 7Q` 2+? BM/2t M/ TB+Fb Qmi i?2 rB/i? Q7 i?2 rB/2bi
+2HH i i?i BM/2tX
>2`2Ƕb i?2 +Q/2 iQ /`r  i#H2,
function drawTable ( rows ) {
var heights = rowHeights ( rows ) ;
var widths = colWidths ( rows );

function drawLine ( blocks , lineNo ) {


return blocks . map ( function ( block ) {
return block [ lineNo ];
}) . join (" ") ;
}

function drawRow ( row , rowNum ) {


var blocks = row . map ( function ( cell , colNum ) {
return cell . draw ( widths [ colNum ] , heights [ rowNum ]) ;
}) ;
return blocks [0]. map ( function (_ , lineNo ) {
return drawLine ( blocks , lineNo ) ;
}) . join ("\ n ") ;
}

return rows . map ( drawRow ) . join ("\ n ") ;


}

RRd
h?2 drawTable 7mM+iBQM mb2b i?2 BMi2`MH ?2HT2` 7mM+iBQM drawRow iQ /`r
HH `Qrb M/ i?2M DQBMb i?2K iQ;2i?2` rBi? M2rHBM2 +?`+i2`bX
h?2 drawRow 7mM+iBQM Bib2H7 }`bi +QMp2`ib i?2 +2HH Q#D2+ib BM i?2 `Qr iQ
#HQ+Fb- r?B+? `2 ``vb Q7 bi`BM;b `2T`2b2MiBM; i?2 +QMi2Mi Q7 i?2 +2HHb-
bTHBi #v HBM2X  bBM;H2 +2HH +QMiBMBM; bBKTHv i?2 MmK#2` jdde KB;?i #2
`2T`2b2Mi2/ #v  bBM;H2@2H2K2Mi ``v HBF2 ["3776"]- r?2`2b M mM/2`HBM2/
+2HH KB;?i iF2 mT irQ HBM2b M/ #2 `2T`2b2Mi2/ #v i?2 ``v ["name",
"----"]X
h?2 #HQ+Fb 7Q`  `Qr- r?B+? HH ?p2 i?2 bK2 ?2B;?i- b?QmH/ TT2`
M2ti iQ 2+? Qi?2` BM i?2 }MH QmiTmiX h?2 b2+QM/ +HH iQ map BM drawRow
#mBH/b mT i?Bb QmiTmi HBM2 #v HBM2 #v KTTBM; Qp2` i?2 HBM2b BM i?2
H27iKQbi #HQ+F M/- 7Q` 2+? Q7 i?Qb2- +QHH2+iBM;  HBM2 i?i bTMb i?2 7mHH
rB/i? Q7 i?2 i#H2X h?2b2 HBM2b `2 i?2M DQBM2/ rBi? M2rHBM2 +?`+i2`b
iQ T`QpB/2 i?2 r?QH2 `Qr b drawRowǶb `2im`M pHm2X
h?2 7mM+iBQM drawLine 2ti`+ib HBM2b i?i b?QmH/ TT2` M2ti iQ 2+?
Qi?2` 7`QK M ``v Q7 #HQ+Fb M/ DQBMb i?2K rBi?  bT+2 +?`+i2` iQ
+`2i2  QM2@+?`+i2` ;T #2ir22M i?2 i#H2Ƕb +QHmKMbX
LQr H2iǶb r`Bi2  +QMbi`m+iQ` 7Q` +2HHb i?i +QMiBM i2ti- r?B+? BKTH2@
K2Mib i?2 BMi2`7+2 7Q` i#H2 +2HHbX h?2 +QMbi`m+iQ` bTHBib  bi`BM; BMiQ
M ``v Q7 HBM2b mbBM; i?2 bi`BM; K2i?Q/ split- r?B+? +mib mT  bi`BM;
i 2p2`v Q++m``2M+2 Q7 Bib `;mK2Mi M/ `2im`Mb M ``v Q7 i?2 TB2+2bX
h?2 minWidth K2i?Q/ }M/b i?2 KtBKmK HBM2 rB/i? BM i?Bb ``vX
function repeat ( string , times ) {
var result = "";
for ( var i = 0; i < times ; i ++)
result += string ;
return result ;
}

function TextCell ( text ) {


this . text = text . split ("\ n ") ;
}
TextCell . prototype . minWidth = function () {
return this . text . reduce ( function ( width , line ) {
return Math . max ( width , line . length ) ;
} , 0) ;
};
TextCell . prototype . minHeight = function () {

RR3
return this . text . length ;
};
TextCell . prototype . draw = function ( width , height ) {
var result = [];
for ( var i = 0; i < height ; i ++) {
var line = this . text [i ] || "";
result . push ( line + repeat (" ", width - line . length ) ) ;
}
return result ;
};

h?2 +Q/2 mb2b  ?2HT2` 7mM+iBQM +HH2/ repeat- r?B+? #mBH/b  bi`BM; r?Qb2
pHm2 Bb i?2 string `;mK2Mi `2T2i2/ times MmK#2` Q7 iBK2bX h?2 draw
K2i?Q/ mb2b Bi iQ // dzT//BM;Ǵ iQ HBM2b bQ i?i i?2v HH ?p2 i?2
`2[mB`2/ H2M;i?X
G2iǶb i`v 2p2`vi?BM; r2Ƕp2 r`Bii2M bQ 7` #v #mBH/BM; mT  8 × 8 +?2+F2`@
#Q`/X
var rows = [];
for ( var i = 0; i < 5; i ++) {
var row = [];
for ( var j = 0; j < 5; j ++) {
if (( j + i ) % 2 == 0)
row . push ( new TextCell ("##") );
else
row . push ( new TextCell (" ") ) ;
}
rows . push ( row ) ;
}
console . log ( drawTable ( rows ) ) ;
// → ## ## ##
// ## ##
// ## ## ##
// ## ##
// ## ## ##

Ai rQ`Fb5 "mi bBM+2 HH +2HHb ?p2 i?2 bK2 bBx2- i?2 i#H2@HvQmi +Q/2
/Q2bMǶi `2HHv /Q Mvi?BM; BMi2`2biBM;X
h?2 bQm`+2 /i 7Q` i?2 i#H2 Q7 KQmMiBMb i?i r2 `2 i`vBM; iQ #mBH/ Bb
pBH#H2 BM i?2 MOUNTAINS p`B#H2 BM i?2 bM/#Qt M/ HbQ /QrMHQ/#H2
7`QK i?2 r2#bBi2U2HQ[m2MiDpb+`BTiXM2if+Q/2OeVX

RRN
q2 rBHH rMi iQ ?B;?HB;?i i?2 iQT `Qr- r?B+? +QMiBMb i?2 +QHmKM
MK2b- #v mM/2`HBMBM; i?2 +2HHb rBi?  b2`B2b Q7 /b? +?`+i2`bX LQ
T`Q#H2Kěr2 bBKTHv r`Bi2  +2HH ivT2 i?i ?M/H2b mM/2`HBMBM;X
function UnderlinedCell ( inner ) {
this . inner = inner ;
}
UnderlinedCell . prototype . minWidth = function () {
return this . inner . minWidth () ;
};
UnderlinedCell . prototype . minHeight = function () {
return this . inner . minHeight () + 1;
};
UnderlinedCell . prototype . draw = function ( width , height ) {
return this . inner . draw ( width , height - 1)
. concat ([ repeat (" -" , width ) ]) ;
};

M mM/2`HBM2/ +2HH +QMiBMb MQi?2` +2HHX Ai `2TQ`ib Bib KBMBKmK bBx2 b


#2BM; i?2 bK2 b i?i Q7 Bib BMM2` +2HH U#v +HHBM; i?`Qm;? iQ i?i +2HHǶb
minWidth M/ minHeight K2i?Q/bV #mi //b QM2 iQ i?2 ?2B;?i iQ ++QmMi
7Q` i?2 bT+2 iF2M mT #v i?2 mM/2`HBM2X
.`rBM; bm+?  +2HH Bb [mBi2 bBKTH2ěr2 iF2 i?2 +QMi2Mi Q7 i?2 BMM2`
+2HH M/ +QM+i2Mi2  bBM;H2 HBM2 7mHH Q7 /b?2b iQ BiX
>pBM; M mM/2`HBMBM; K2+?MBbK- r2 +M MQr r`Bi2  7mM+iBQM i?i
#mBH/b mT  ;`B/ Q7 +2HHb 7`QK Qm` /i b2iX
function dataTable ( data ) {
var keys = Object . keys ( data [0]) ;
var headers = keys . map ( function ( name ) {
return new UnderlinedCell ( new TextCell ( name ) ) ;
}) ;
var body = data . map ( function ( row ) {
return keys . map ( function ( name ) {
return new TextCell ( String ( row [ name ]) ) ;
}) ;
}) ;
return [ headers ]. concat ( body );
}

console . log ( drawTable ( dataTable ( MOUNTAINS ) ) ) ;

Rky
// → name height country
// ------------ ------ -------------
// Kilimanjaro 5895 Tanzania
// ... etcetera

h?2 biM/`/ Object.keys 7mM+iBQM `2im`Mb M ``v Q7 T`QT2`iv MK2b BM


M Q#D2+iX h?2 iQT `Qr Q7 i?2 i#H2 Kmbi +QMiBM mM/2`HBM2/ +2HHb i?i
;Bp2 i?2 MK2b Q7 i?2 +QHmKMbX "2HQr i?i- i?2 pHm2b Q7 HH i?2 Q#D2+ib
BM i?2 /i b2i TT2` b MQ`KH +2HHběr2 2ti`+i i?2K #v KTTBM;
Qp2` i?2 keys ``v bQ i?i r2 `2 bm`2 i?i i?2 Q`/2` Q7 i?2 +2HHb Bb i?2
bK2 BM 2p2`v `QrX
h?2 `2bmHiBM; i#H2 `2b2K#H2b i?2 2tKTH2 b?QrM #27Q`2- 2t+2Ti i?i
Bi /Q2b MQi `B;?i@HB;M i?2 MmK#2`b BM i?2 height +QHmKMX q2 rBHH ;2i iQ
i?i BM  KQK2MiX

:2ii2`b M/ b2ii2`b


q?2M bT2+B7vBM; M BMi2`7+2- Bi Bb TQbbB#H2 iQ BM+Hm/2 T`QT2`iB2b i?i
`2 MQi K2i?Q/bX q2 +QmH/ ?p2 /2}M2/ minHeight M/ minWidth iQ bBK@
THv ?QH/ MmK#2`bX "mi i?iǶ/ ?p2 `2[mB`2/ mb iQ +QKTmi2 i?2K BM i?2
+QMbi`m+iQ`- r?B+? //b +Q/2 i?2`2 i?i BbMǶi bi`B+iHv `2H2pMi iQ +QM@
bi`m+iBM; i?2 Q#D2+iX Ai rQmH/ +mb2 T`Q#H2Kb B7- 7Q` 2tKTH2- i?2 BMM2`
+2HH Q7 M mM/2`HBM2/ +2HH rb +?M;2/- i r?B+? TQBMi i?2 bBx2 Q7 i?2
mM/2`HBM2/ +2HH b?QmH/ HbQ +?M;2X
h?Bb ?b H2/ bQK2 T2QTH2 iQ /QTi  T`BM+BTH2 Q7 M2p2` BM+Hm/BM; MQM@
K2i?Q/ T`QT2`iB2b BM BMi2`7+2bX _i?2` i?M /B`2+iHv ++2bb  bBKTH2
pHm2 T`QT2`iv- i?2vǶ/ mb2 getSomething M/ setSomething K2i?Q/b iQ `2/
M/ r`Bi2 i?2 T`QT2`ivX h?Bb TT`Q+? ?b i?2 /QrMbB/2 i?i vQm rBHH
2M/ mT r`BiBM;ěM/ `2/BM;ě HQi Q7 //BiBQMH K2i?Q/bX
6Q`imMi2Hv- Cpa+`BTi T`QpB/2b  i2+?MB[m2 i?i ;2ib mb i?2 #2bi Q7
#Qi? rQ`H/bX q2 +M bT2+B7v T`QT2`iB2b i?i- 7`QK i?2 QmibB/2- HQQF HBF2
MQ`KH T`QT2`iB2b #mi b2+`2iHv ?p2 K2i?Q/b bbQ+Bi2/ rBi? i?2KX
var pile = {
elements : [" eggshell " , " orange peel ", " worm "] ,
get height () {
return this . elements . length ;
},

RkR
set height ( value ) {
console . log (" Ignoring attempt to set height to " , value ) ;
}
};

console . log ( pile . height );


// → 3
pile . height = 100;
// → Ignoring attempt to set height to 100

AM M Q#D2+i HBi2`H- i?2 get Q` set MQiiBQM 7Q` T`QT2`iB2b HHQrb vQm
iQ bT2+B7v  7mM+iBQM iQ #2 `mM r?2M i?2 T`QT2`iv Bb `2/ Q` r`Bii2MX
uQm +M HbQ // bm+?  T`QT2`iv iQ M 2tBbiBM; Q#D2+i- 7Q` 2tKTH2 
T`QiQivT2- mbBM; i?2 Object.defineProperty 7mM+iBQM Ur?B+? r2 T`2pBQmbHv
mb2/ iQ +`2i2 MQM2MmK2`#H2 T`QT2`iB2bVX
Object . defineProperty ( TextCell . prototype , " heightProp " , {
get : function () { return this . text . length ; }
}) ;

var cell = new TextCell (" no \ nway ") ;


console . log ( cell . heightProp );
// → 2
cell . heightProp = 100;
console . log ( cell . heightProp );
// → 2

uQm +M mb2  bBKBH` set T`QT2`iv- BM i?2 Q#D2+i Tbb2/ iQ defineProperty
- iQ bT2+B7v  b2ii2` K2i?Q/X q?2M  ;2ii2` #mi MQ b2ii2` Bb /2}M2/-
r`BiBM; iQ i?2 T`QT2`iv Bb bBKTHv B;MQ`2/X

AM?2`BiM+2
q2 `2 MQi [mBi2 /QM2 v2i rBi? Qm` i#H2 HvQmi 2t2`+Bb2X Ai ?2HTb `2/@
#BHBiv iQ `B;?i@HB;M +QHmKMb Q7 MmK#2`bX q2 b?QmH/ +`2i2 MQi?2` +2HH
ivT2 i?i Bb HBF2 TextCell- #mi `i?2` i?M T//BM; i?2 HBM2b QM i?2 `B;?i
bB/2- Bi T/b i?2K QM i?2 H27i bB/2 bQ i?i i?2v HB;M iQ i?2 `B;?iX
q2 +QmH/ bBKTHv r`Bi2  r?QH2 M2r +QMbi`m+iQ` rBi? HH i?`22 K2i?Q/b
BM Bib T`QiQivT2X "mi T`QiQivT2b Kv i?2Kb2Hp2b ?p2 T`QiQivT2b- M/
i?Bb HHQrb mb iQ /Q bQK2i?BM; +H2p2`X

Rkk
function RTextCell ( text ) {
TextCell . call ( this , text );
}
RTextCell . prototype = Object . create ( TextCell . prototype ) ;
RTextCell . prototype . draw = function ( width , height ) {
var result = [];
for ( var i = 0; i < height ; i ++) {
var line = this . text [i ] || "";
result . push ( repeat (" " , width - line . length ) + line ) ;
}
return result ;
};

q2 `2mb2 i?2 +QMbi`m+iQ` M/ i?2 minHeight M/ minWidth K2i?Q/b 7`QK i?2
`2;mH` TextCellX M RTextCell Bb MQr #bB+HHv 2[mBpH2Mi iQ  TextCell-
2t+2Ti i?i Bib draw K2i?Q/ +QMiBMb  /Bz2`2Mi 7mM+iBQMX
h?Bb Tii2`M Bb +HH2/ BM?2`BiM+2X Ai HHQrb mb iQ #mBH/ bHB;?iHv /Bz2`2Mi
/i ivT2b 7`QK 2tBbiBM; /i ivT2b rBi? `2HiBp2Hv HBiiH2 rQ`FX hvTB+HHv-
i?2 M2r +QMbi`m+iQ` rBHH +HH i?2 QH/ +QMbi`m+iQ` UmbBM; i?2 call K2i?Q/
BM Q`/2` iQ #2 #H2 iQ ;Bp2 Bi i?2 M2r Q#D2+i b Bib this pHm2VX PM+2
i?Bb +QMbi`m+iQ` ?b #22M +HH2/- r2 +M bbmK2 i?i HH i?2 }2H/b i?i
i?2 QH/ Q#D2+i ivT2 Bb bmTTQb2/ iQ +QMiBM ?p2 #22M //2/X q2 ``M;2
7Q` i?2 +QMbi`m+iQ`Ƕb T`QiQivT2 iQ /2`Bp2 7`QK i?2 QH/ T`QiQivT2 bQ i?i
BMbiM+2b Q7 i?Bb ivT2 rBHH HbQ ?p2 ++2bb iQ i?2 T`QT2`iB2b BM i?i
T`QiQivT2X 6BMHHv- r2 +M Qp2``B/2 bQK2 Q7 i?2b2 T`QT2`iB2b #v //BM;
i?2K iQ Qm` M2r T`QiQivT2X
LQr- B7 r2 bHB;?iHv /Dmbi i?2 dataTable 7mM+iBQM iQ mb2 RTextCellb 7Q`
+2HHb r?Qb2 pHm2 Bb  MmK#2`- r2 ;2i i?2 i#H2 r2 r2`2 BKBM; 7Q`X
function dataTable ( data ) {
var keys = Object . keys ( data [0]) ;
var headers = keys . map ( function ( name ) {
return new UnderlinedCell ( new TextCell ( name ) ) ;
}) ;
var body = data . map ( function ( row ) {
return keys . map ( function ( name ) {
var value = row [ name ];
// This was changed :
if ( typeof value == " number ")
return new RTextCell ( String ( value ) ) ;

Rkj
else
return new TextCell ( String ( value ) ) ;
}) ;
}) ;
return [ headers ]. concat ( body );
}

console . log ( drawTable ( dataTable ( MOUNTAINS ) ) ) ;


// →... beautifully aligned table

AM?2`BiM+2 Bb  7mM/K2MiH T`i Q7 i?2 Q#D2+i@Q`B2Mi2/ i`/BiBQM- HQM;@


bB/2 2M+TbmHiBQM M/ TQHvKQ`T?BbKX "mi r?BH2 i?2 Hii2` irQ `2 MQr
;2M2`HHv `2;`/2/ b rQM/2`7mH B/2b- BM?2`BiM+2 Bb bQK2r?i +QMi`Q@
p2`bBHX
h?2 KBM `2bQM 7Q` i?Bb Bb i?i Bi Bb Q7i2M +QM7mb2/ rBi? TQHvKQ`T?BbK-
bQH/ b  KQ`2 TQr2`7mH iQQH i?M Bi `2HHv Bb- M/ bm#b2[m2MiHv Qp2`mb2/
BM HH FBM/b Q7 m;Hv rvbX q?2`2b 2M+TbmHiBQM M/ TQHvKQ`T?BbK
+M #2 mb2/ iQ b2T`i2 TB2+2b Q7 +Q/2 7`QK 2+? Qi?2`- `2/m+BM; i?2
iM;H2/M2bb Q7 i?2 Qp2`HH T`Q;`K- BM?2`BiM+2 7mM/K2MiHHv iB2b ivT2b
iQ;2i?2`- +`2iBM; KQ`2 iM;H2X
uQm +M ?p2 TQHvKQ`T?BbK rBi?Qmi BM?2`BiM+2- b r2 brX A K MQi
;QBM; iQ i2HH vQm iQ pQB/ BM?2`BiM+2 2MiB`2HvěA mb2 Bi `2;mH`Hv BM Kv
QrM T`Q;`KbX "mi vQm b?QmH/ b22 Bi b  bHB;?iHv /Q/;v i`B+F i?i +M
?2HT vQm /2}M2 M2r ivT2b rBi? HBiiH2 +Q/2- MQi b  ;`M/ T`BM+BTH2 Q7 +Q/2
Q`;MBxiBQMX  T`272`#H2 rv iQ 2ti2M/ ivT2b Bb i?`Qm;? +QKTQbBiBQM-
bm+? b ?Qr UnderlinedCell #mBH/b QM MQi?2` +2HH Q#D2+i #v bBKTHv biQ`BM;
Bi BM  T`QT2`iv M/ 7Q`r`/BM; K2i?Q/ +HHb iQ Bi BM Bib QrM K2i?Q/bX

h?2 BMbiM+2Q7 QT2`iQ`


Ai Bb Q++bBQMHHv mb27mH iQ FMQr r?2i?2` M Q#D2+i rb /2`Bp2/ 7`QK
 bT2+B}+ +QMbi`m+iQ`X 6Q` i?Bb- Cpa+`BTi T`QpB/2b  #BM`v QT2`iQ`
+HH2/ instanceofX
console . log ( new RTextCell (" A ") instanceof RTextCell ) ;
// → true
console . log ( new RTextCell (" A ") instanceof TextCell ) ;
// → true
console . log ( new TextCell (" A ") instanceof RTextCell ) ;

Rk9
// → false
console . log ([1] instanceof Array ) ;
// → true

h?2 QT2`iQ` rBHH b22 i?`Qm;? BM?2`Bi2/ ivT2bX M RTextCell Bb M BMbiM+2


Q7 TextCell #2+mb2 RTextCell.prototype /2`Bp2b 7`QK TextCell.prototypeX h?2
QT2`iQ` +M #2 TTHB2/ iQ biM/`/ +QMbi`m+iQ`b HBF2 ArrayX HKQbi 2p2`v
Q#D2+i Bb M BMbiM+2 Q7 ObjectX

amKK`v
aQ Q#D2+ib `2 KQ`2 +QKTHB+i2/ i?M A BMBiBHHv TQ`i`v2/ i?2KX h?2v
?p2 T`QiQivT2b- r?B+? `2 Qi?2` Q#D2+ib- M/ rBHH +i b B7 i?2v ?p2
T`QT2`iB2b i?2v /QMǶi ?p2 b HQM; b i?2 T`QiQivT2 ?b i?i T`QT2`ivX
aBKTH2 Q#D2+ib ?p2 Object.prototype b i?2B` T`QiQivT2X
*QMbi`m+iQ`b- r?B+? `2 7mM+iBQMb r?Qb2 MK2b mbmHHv bi`i rBi? 
+TBiH H2ii2`- +M #2 mb2/ rBi? i?2 new QT2`iQ` iQ +`2i2 M2r Q#D2+ibX
h?2 M2r Q#D2+iǶb T`QiQivT2 rBHH #2 i?2 Q#D2+i 7QmM/ BM i?2 prototype
T`QT2`iv Q7 i?2 +QMbi`m+iQ` 7mM+iBQMX uQm +M KF2 ;QQ/ mb2 Q7 i?Bb #v
TmiiBM; i?2 T`QT2`iB2b i?i HH pHm2b Q7  ;Bp2M ivT2 b?`2 BMiQ i?2B` T`Q@
iQivT2X h?2 instanceof QT2`iQ` +M- ;Bp2M M Q#D2+i M/  +QMbi`m+iQ`-
i2HH vQm r?2i?2` i?i Q#D2+i Bb M BMbiM+2 Q7 i?i +QMbi`m+iQ`X
PM2 mb27mH i?BM; iQ /Q rBi? Q#D2+ib Bb iQ bT2+B7v M BMi2`7+2 7Q` i?2K
M/ i2HH 2p2`v#Q/v i?i i?2v `2 bmTTQb2/ iQ iHF iQ vQm` Q#D2+i QMHv
i?`Qm;? i?i BMi2`7+2X h?2 `2bi Q7 i?2 /2iBHb i?i KF2 mT vQm` Q#D2+i
`2 MQr 2M+TbmHi2/- ?B//2M #2?BM/ i?2 BMi2`7+2X
PM+2 vQm `2 iHFBM; BM i2`Kb Q7 BMi2`7+2b- r?Q bvb i?i QMHv QM2 FBM/
Q7 Q#D2+i Kv BKTH2K2Mi i?Bb BMi2`7+2\ >pBM; /Bz2`2Mi Q#D2+ib 2tTQb2
i?2 bK2 BMi2`7+2 M/ i?2M r`BiBM; +Q/2 i?i rQ`Fb QM Mv Q#D2+i rBi?
i?2 BMi2`7+2 Bb +HH2/ TQHvKQ`T?BbKX Ai Bb p2`v mb27mHX
q?2M BKTH2K2MiBM; KmHiBTH2 ivT2b i?i /Bz2` BM QMHv bQK2 /2iBHb- Bi
+M #2 ?2HT7mH iQ bBKTHv KF2 i?2 T`QiQivT2 Q7 vQm` M2r ivT2 /2`Bp2
7`QK i?2 T`QiQivT2 Q7 vQm` QH/ ivT2 M/ ?p2 vQm` M2r +QMbi`m+iQ` +HH
i?2 QH/ QM2X h?Bb ;Bp2b vQm M Q#D2+i ivT2 bBKBH` iQ i?2 QH/ ivT2 #mi
7Q` r?B+? vQm +M // M/ Qp2``B/2 T`QT2`iB2b b vQm b22 }iX

Rk8
1t2`+Bb2b
 p2+iQ` ivT2
q`Bi2  +QMbi`m+iQ` Vector i?i `2T`2b2Mib  p2+iQ` BM irQ@/BK2MbBQMH
bT+2X Ai iF2b x M/ y T`K2i2`b UMmK#2`bV- r?B+? Bi b?QmH/ bp2 iQ
T`QT2`iB2b Q7 i?2 bK2 MK2X
:Bp2 i?2 Vector T`QiQivT2 irQ K2i?Q/b- plus M/ minus- i?i iF2 M@
Qi?2` p2+iQ` b  T`K2i2` M/ `2im`M  M2r p2+iQ` i?i ?b i?2 bmK
Q` /Bz2`2M+2 Q7 i?2 irQ p2+iQ`bǶ Ui?2 QM2 BM this M/ i?2 T`K2i2`V t
M/ v pHm2bX
//  ;2ii2` T`QT2`iv length iQ i?2 T`QiQivT2 i?i +QKTmi2b i?2 H2M;i?
Q7 i?2 p2+iQ`ěi?i Bb- i?2 /BbiM+2 Q7 i?2 TQBMi Ut- vV 7`QK i?2 Q`B;BM Uy-
yVX

MQi?2` +2HH
AKTH2K2Mi  +2HH ivT2 MK2/ StretchCell(inner, width, height) i?i +QM@
7Q`Kb iQ i?2 i#H2 +2HH BMi2`7+2 /2b+`B#2/ 2`HB2` BM i?2 +?Ti2`X Ai b?QmH/
r`T MQi?2` +2HH UHBF2 UnderlinedCell /Q2bV M/ 2Mbm`2 i?i i?2 `2bmHiBM;
+2HH ?b i H2bi i?2 ;Bp2M width M/ height- 2p2M B7 i?2 BMM2` +2HH rQmH/
Mim`HHv #2 bKHH2`X

a2[m2M+2 BMi2`7+2
.2bB;M M BMi2`7+2 i?i #bi`+ib Bi2`iBQM Qp2`  +QHH2+iBQM Q7 pHm2bX
M Q#D2+i i?i T`QpB/2b i?Bb BMi2`7+2 `2T`2b2Mib  b2[m2M+2- M/ i?2
BMi2`7+2 Kmbi bQK2?Qr KF2 Bi TQbbB#H2 7Q` +Q/2 i?i mb2b bm+? M
Q#D2+i iQ Bi2`i2 Qp2` i?2 b2[m2M+2- HQQFBM; i i?2 2H2K2Mi pHm2b Bi Bb
K/2 mT Q7 M/ ?pBM; bQK2 rv iQ }M/ Qmi r?2M i?2 2M/ Q7 i?2 b2[m2M+2
Bb `2+?2/X
q?2M vQm ?p2 bT2+B}2/ vQm` BMi2`7+2- i`v iQ r`Bi2  7mM+iBQM logFive
i?i iF2b  b2[m2M+2 Q#D2+i M/ +HHb console.log QM Bib }`bi }p2 2H2K2Mibě
Q` 72r2`- B7 i?2 b2[m2M+2 ?b 72r2` i?M }p2 2H2K2MibX
h?2M BKTH2K2Mi M Q#D2+i ivT2 ArraySeq i?i r`Tb M ``v M/ HHQrb
Bi2`iBQM Qp2` i?2 ``v mbBM; i?2 BMi2`7+2 vQm /2bB;M2/X AKTH2K2Mi
MQi?2` Q#D2+i ivT2 RangeSeq i?i Bi2`i2b Qp2`  `M;2 Q7 BMi2;2`b UiFBM;

Rke
from M/ to `;mK2Mib iQ Bib +QMbi`m+iQ`V BMbi2/X

Rkd
dz(Ę) i?2 [m2biBQM Q7 r?2i?2` J+?BM2b *M h?BMF (Ę) Bb #Qmi
b `2H2pMi b i?2 [m2biBQM Q7 r?2i?2` am#K`BM2b *M arBKXǴ
ě1/b;2` .BDFbi`- h?2 h?`2ib iQ *QKTmiBM; a+B2M+2

d S`QD2+i, 1H2+i`QMB+ GB72


AM dzT`QD2+iǴ +?Ti2`b- AǶHH biQT TmKK2HBM; vQm rBi? M2r i?2Q`v 7Q` 
#`B27 KQK2Mi M/ BMbi2/ rQ`F i?`Qm;?  T`Q;`K rBi? vQmX h?2Q`v Bb
BM/BbT2Mb#H2 r?2M H2`MBM; iQ T`Q;`K- #mi Bi b?QmH/ #2 ++QKTMB2/
#v `2/BM; M/ mM/2`biM/BM; MQMi`BpBH T`Q;`KbX
Pm` T`QD2+i BM i?Bb +?Ti2` Bb iQ #mBH/  pB`imH 2+Qbvbi2K-  HBiiH2 rQ`H/
TQTmHi2/ rBi? +`Bii2`b i?i KQp2 `QmM/ M/ bi`m;;H2 7Q` bm`pBpHX

.2}MBiBQM
hQ KF2 i?Bb ibF KM;2#H2- r2 rBHH `/B+HHv bBKTHB7v i?2 +QM+2Ti
Q7  rQ`H/X LK2Hv-  rQ`H/ rBHH #2  irQ@/BK2MbBQMH ;`B/ r?2`2 2+?
2MiBiv iF2b mT QM2 7mHH b[m`2 Q7 i?2 ;`B/X PM 2p2`v im`M- i?2 +`Bii2`b
HH ;2i  +?M+2 iQ iF2 bQK2 +iBQMX
h?mb- r2 +?QT #Qi? iBK2 M/ bT+2 BMiQ mMBib rBi?  }t2/ bBx2, b[m`2b
7Q` bT+2 M/ im`Mb 7Q` iBK2X P7 +Qm`b2- i?Bb Bb  bQK2r?i +`m/2 M/
BM++m`i2 TT`QtBKiBQMX "mi Qm` bBKmHiBQM Bb BMi2M/2/ iQ #2 KmbBM;-
MQi ++m`i2- bQ r2 +M 7`22Hv +mi bm+? +Q`M2`bX
q2 +M /2}M2  rQ`H/ rBi?  THM- M ``v Q7 bi`BM;b i?i Hvb Qmi
i?2 rQ`H/Ƕb ;`B/ mbBM; QM2 +?`+i2` T2` b[m`2X
var plan = ["############################" ,
"# # # o ##" ,
"# #" ,
"# ##### #" ,
"## # # ## #" ,
"### ## # #" ,
"# ### # #" ,
"# #### #" ,
"# ## o #" ,
"# o # o ### #" ,
"# # #" ,

Rk3
"############################"];

h?2 dzOǴ +?`+i2`b BM i?Bb THM `2T`2b2Mi rHHb M/ `Q+Fb- M/ i?2 dzQǴ
+?`+i2`b `2T`2b2Mi +`Bii2`bX h?2 bT+2b- b vQm KB;?i ?p2 ;m2bb2/- `2
2KTiv bT+2X
 THM ``v +M #2 mb2/ iQ +`2i2  rQ`H/ Q#D2+iX am+? M Q#D2+i F22Tb
i`+F Q7 i?2 bBx2 M/ +QMi2Mi Q7 i?2 rQ`H/X Ai ?b  toString K2i?Q/- r?B+?
+QMp2`ib i?2 rQ`H/ #+F iQ  T`BMi#H2 bi`BM; UbBKBH` iQ i?2 THM Bi rb
#b2/ QMV bQ i?i r2 +M b22 r?iǶb ;QBM; QM BMbB/2X h?2 rQ`H/ Q#D2+i
HbQ ?b  turn K2i?Q/- r?B+? HHQrb HH i?2 +`Bii2`b BM Bi iQ iF2 QM2 im`M
M/ mT/i2b i?2 rQ`H/ iQ `2~2+i i?2B` +iBQMbX

_2T`2b2MiBM; bT+2
h?2 ;`B/ i?i KQ/2Hb i?2 rQ`H/ ?b  }t2/ rB/i? M/ ?2B;?iX a[m`2b
`2 B/2MiB}2/ #v i?2B` t@ M/ v@+QQ`/BMi2bX q2 mb2  bBKTH2 ivT2- Vector
Ub b22M BM i?2 2t2`+Bb2b 7Q` i?2 T`2pBQmb +?Ti2`V- iQ `2T`2b2Mi i?2b2
+QQ`/BMi2 TB`bX
function Vector (x , y ) {
this . x = x ;
this . y = y ;
}
Vector . prototype . plus = function ( other ) {
return new Vector ( this . x + other .x , this . y + other . y ) ;
};

L2ti- r2 M22/ M Q#D2+i ivT2 i?i KQ/2Hb i?2 ;`B/ Bib2H7X  ;`B/ Bb T`i
Q7  rQ`H/- #mi r2 `2 KFBM; Bi  b2T`i2 Q#D2+i Ur?B+? rBHH #2 
T`QT2`iv Q7  rQ`H/ Q#D2+iV iQ F22T i?2 rQ`H/ Q#D2+i Bib2H7 bBKTH2X h?2
rQ`H/ b?QmH/ +QM+2`M Bib2H7 rBi? rQ`H/@`2Hi2/ i?BM;b- M/ i?2 ;`B/ b?QmH/
+QM+2`M Bib2H7 rBi? ;`B/@`2Hi2/ i?BM;bX
hQ biQ`2  ;`B/ Q7 pHm2b- r2 ?p2 b2p2`H QTiBQMbX q2 +M mb2 M ``v
Q7 `Qr ``vb M/ mb2 irQ T`QT2`iv ++2bb2b iQ ;2i iQ  bT2+B}+ b[m`2-
HBF2 i?Bb,
var grid = [[" top left " , " top middle ", " top right "] ,
[" bottom left ", " bottom middle ", " bottom right "]];
console . log ( grid [1][2]) ;

RkN
// → bottom right

P` r2 +M mb2  bBM;H2 ``v- rBi? bBx2 rB/i? × ?2B;?i- M/ /2+B/2 i?i
i?2 2H2K2Mi i Ut-vV Bb 7QmM/ i TQbBiBQM t Y Uv × rB/i?V BM i?2 ``vX
var grid = [" top left " , " top middle ", " top right ",
" bottom left ", " bottom middle ", " bottom right "];
console . log ( grid [2 + (1 * 3) ]) ;
// → bottom right

aBM+2 i?2 +imH ++2bb iQ i?Bb ``v rBHH #2 r`TT2/ BM K2i?Q/b QM


i?2 ;`B/ Q#D2+i ivT2- Bi /Q2bMǶi Kii2` iQ QmibB/2 +Q/2 r?B+? TT`Q+?
r2 iF2X A +?Qb2 i?2 b2+QM/ `2T`2b2MiiBQM #2+mb2 Bi KF2b Bi Km+?
2bB2` iQ +`2i2 i?2 ``vX q?2M +HHBM; i?2 Array +QMbi`m+iQ` rBi? 
bBM;H2 MmK#2` b M `;mK2Mi- Bi +`2i2b  M2r 2KTiv ``v Q7 i?2 ;Bp2M
H2M;i?X
h?Bb +Q/2 /2}M2b i?2 Grid Q#D2+i- rBi? bQK2 #bB+ K2i?Q/b,
function Grid ( width , height ) {
this . space = new Array ( width * height ) ;
this . width = width ;
this . height = height ;
}
Grid . prototype . isInside = function ( vector ) {
return vector . x >= 0 && vector .x < this . width &&
vector . y >= 0 && vector .y < this . height ;
};
Grid . prototype . get = function ( vector ) {
return this . space [ vector .x + this . width * vector . y ];
};
Grid . prototype . set = function ( vector , value ) {
this . space [ vector . x + this . width * vector . y ] = value ;
};

M/ ?2`2 Bb  i`BpBH i2bi,


var grid = new Grid (5 , 5) ;
console . log ( grid . get ( new Vector (1 , 1) ) ) ;
// → undefined
grid . set ( new Vector (1 , 1) , "X ") ;
console . log ( grid . get ( new Vector (1 , 1) ) ) ;
// → X

Rjy
 +`Bii2`Ƕb T`Q;`KKBM; BMi2`7+2
"27Q`2 r2 +M bi`i QM i?2 World +QMbi`m+iQ`- r2 Kmbi ;2i KQ`2 bT2+B}+
#Qmi i?2 +`Bii2` Q#D2+ib i?i rBHH #2 HBpBM; BMbB/2 BiX A K2MiBQM2/ i?i i?2
rQ`H/ rBHH bF i?2 +`Bii2`b r?i +iBQMb i?2v rMi iQ iF2X h?Bb rQ`Fb b
7QHHQrb, 2+? +`Bii2` Q#D2+i ?b M act K2i?Q/ i?i- r?2M +HH2/- `2im`Mb
M +iBQMX M +iBQM Bb M Q#D2+i rBi?  type T`QT2`iv- r?B+? MK2b i?2
ivT2 Q7 +iBQM i?2 +`Bii2` rMib iQ iF2- 7Q` 2tKTH2 "move"X h?2 +iBQM
Kv HbQ +QMiBM 2ti` BM7Q`KiBQM- bm+? b i?2 /B`2+iBQM i?2 +`Bii2`
rMib iQ KQp2 BMX
*`Bii2`b `2 i2``B#Hv KvQTB+ M/ +M b22 QMHv i?2 b[m`2b /B`2+iHv
`QmM/ i?2K QM i?2 ;`B/X "mi 2p2M i?Bb HBKBi2/ pBbBQM +M #2 mb27mH
r?2M /2+B/BM; r?B+? +iBQM iQ iF2X q?2M i?2 act K2i?Q/ Bb +HH2/- Bi
Bb ;Bp2M  pB2r Q#D2+i i?i HHQrb i?2 +`Bii2` iQ BMbT2+i Bib bm``QmM/BM;bX
q2 MK2 i?2 2B;?i bm``QmM/BM; b[m`2b #v i?2B` +QKTbb /B`2+iBQMb, "n"
7Q` MQ`i?- "ne" 7Q` MQ`i?2bi- M/ bQ QMX >2`2Ƕb i?2 Q#D2+i r2 rBHH mb2 iQ
KT 7`QK /B`2+iBQM MK2b iQ +QQ`/BMi2 Qzb2ib,
var directions = {
" n ": new Vector ( 0 , -1) ,
" ne ": new Vector ( 1 , -1) ,
" e ": new Vector ( 1 , 0) ,
" se ": new Vector ( 1 , 1) ,
" s ": new Vector ( 0 , 1) ,
" sw ": new Vector ( -1 , 1) ,
" w ": new Vector ( -1 , 0) ,
" nw ": new Vector ( -1 , -1)
};

h?2 pB2r Q#D2+i ?b  K2i?Q/ look- r?B+? iF2b  /B`2+iBQM M/ `2im`Mb
 +?`+i2`- 7Q` 2tKTH2 "\#" r?2M i?2`2 Bb  rHH BM i?i /B`2+iBQM- Q`
" " UbT+2V r?2M i?2`2 Bb MQi?BM; i?2`2X h?2 Q#D2+i HbQ T`QpB/2b i?2
+QMp2MB2Mi K2i?Q/b find M/ findAllX "Qi? iF2  KT +?`+i2` b M
`;mK2MiX h?2 }`bi `2im`Mb  /B`2+iBQM BM r?B+? i?2 +?`+i2` +M #2
7QmM/ M2ti iQ i?2 +`Bii2` Q` `2im`Mb null B7 MQ bm+? /B`2+iBQM 2tBbibX h?2
b2+QM/ `2im`Mb M ``v +QMiBMBM; HH /B`2+iBQMb rBi? i?i +?`+i2`X
6Q` 2tKTH2-  +`2im`2 bBiiBM; H27i Ur2biV Q7  rHH rBHH ;2i ["ne", "e",
"se"] r?2M +HHBM; findAll QM Bib pB2r Q#D2+i rBi? i?2 "\#" +?`+i2` b
`;mK2MiX

RjR
>2`2 Bb  bBKTH2- bimTB/ +`Bii2` i?i Dmbi 7QHHQrb Bib MQb2 mMiBH Bi ?Bib
M Q#bi+H2 M/ i?2M #QmM+2b Qz BM  `M/QK QT2M /B`2+iBQM,
function randomElement ( array ) {
return array [ Math . floor ( Math . random () * array . length ) ];
}

var directionNames = " n ne e se s sw w nw ". split (" ") ;

function BouncingCritter () {
this . direction = randomElement ( directionNames ) ;
};

BouncingCritter . prototype . act = function ( view ) {


if ( view . look ( this . direction ) != " ")
this . direction = view . find (" ") || "s ";
return { type : " move " , direction : this . direction };
};

h?2 randomElement ?2HT2` 7mM+iBQM bBKTHv TB+Fb  `M/QK 2H2K2Mi 7`QK M


``v- mbBM; Math.random THmb bQK2 `Bi?K2iB+ iQ ;2i  `M/QK BM/2tX q2ǶHH
mb2 i?Bb ;BM Hi2` #2+mb2 `M/QKM2bb +M #2 mb27mH BM bBKmHiBQMbX
hQ TB+F  `M/QK /B`2+iBQM- i?2 BouncingCritter +QMbi`m+iQ` +HHb randomElement
QM M ``v Q7 /B`2+iBQM MK2bX q2 +QmH/ HbQ ?p2 mb2/ Object.keys iQ
;2i i?Bb ``v 7`QK i?2 directions Q#D2+i r2 /2}M2/ 2`HB2`- #mi i?i T`Q@
pB/2b MQ ;m`Mi22b #Qmi i?2 Q`/2` BM r?B+? i?2 T`QT2`iB2b `2 HBbi2/X
AM KQbi bBimiBQMb- KQ/2`M Cpa+`BTi 2M;BM2b rBHH `2im`M T`QT2`iB2b BM
i?2 Q`/2` i?2v r2`2 /2}M2/- #mi i?2v `2 MQi `2[mB`2/ iQX
h?2 dz|| "s"Ǵ BM i?2 act K2i?Q/ Bb i?2`2 iQ T`2p2Mi this.direction 7`QK
;2iiBM; i?2 pHm2 null B7 i?2 +`Bii2` Bb bQK2?Qr i`TT2/ rBi? MQ 2KTiv
bT+2 `QmM/ Bi U7Q` 2tKTH2 r?2M +`Qr/2/ BMiQ  +Q`M2` #v Qi?2` +`Bi@
i2`bVX

h?2 rQ`H/ Q#D2+i


LQr r2 +M bi`i QM i?2 World Q#D2+i ivT2X h?2 +QMbi`m+iQ` iF2b  THM
Ui?2 ``v Q7 bi`BM;b `2T`2b2MiBM; i?2 rQ`H/Ƕb ;`B/- /2b+`B#2/ 2`HB2`V
M/  H2;2M/ b `;mK2MibX  H2;2M/ Bb M Q#D2+i i?i i2HHb mb r?i
2+? +?`+i2` BM i?2 KT K2MbX Ai +QMiBMb  +QMbi`m+iQ` 7Q` 2p2`v

Rjk
+?`+i2`ě2t+2Ti 7Q` i?2 bT+2 +?`+i2`- r?B+? Hrvb `272`b iQ null-
i?2 pHm2 r2ǶHH mb2 iQ `2T`2b2Mi 2KTiv bT+2X
function elementFromChar ( legend , ch ) {
if ( ch == " ")
return null ;
var element = new legend [ ch ]() ;
element . originChar = ch ;
return element ;
}

function World ( map , legend ) {


var grid = new Grid ( map [0]. length , map . length ) ;
this . grid = grid ;
this . legend = legend ;

map . forEach ( function ( line , y) {


for ( var x = 0; x < line . length ; x ++)
grid . set ( new Vector (x , y ) ,
elementFromChar ( legend , line [x ]) );
}) ;
}

AM elementFromChar- }`bi r2 +`2i2 M BMbiM+2 Q7 i?2 `B;?i ivT2 #v HQQFBM;


mT i?2 +?`+i2`Ƕb +QMbi`m+iQ` M/ TTHvBM; new iQ BiX h?2M r2 // M
originChar T`QT2`iv iQ Bi iQ KF2 Bi 2bv iQ }M/ Qmi r?i +?`+i2` i?2
2H2K2Mi rb Q`B;BMHHv +`2i2/ 7`QKX
q2 M22/ i?Bb originChar T`QT2`iv r?2M BKTH2K2MiBM; i?2 rQ`H/Ƕb toString
K2i?Q/X h?Bb K2i?Q/ #mBH/b mT  KTHBF2 bi`BM; 7`QK i?2 rQ`H/Ƕb +m`@
`2Mi bii2 #v T2`7Q`KBM;  irQ@/BK2MbBQMH HQQT Qp2` i?2 b[m`2b QM i?2
;`B/X
function charFromElement ( element ) {
if ( element == null )
return " ";
else
return element . originChar ;
}

World . prototype . toString = function () {


var output = "";
for ( var y = 0; y < this . grid . height ; y ++) {

Rjj
for ( var x = 0; x < this . grid . width ; x ++) {
var element = this . grid . get ( new Vector (x , y));
output += charFromElement ( element ) ;
}
output += "\ n ";
}
return output ;
};

 rHH Bb  bBKTH2 Q#D2+iěBi Bb mb2/ QMHv 7Q` iFBM; mT bT+2 M/ ?b MQ
act K2i?Q/X

function Wall () {}

q?2M r2 i`v i?2 World Q#D2+i #v +`2iBM; M BMbiM+2 #b2/ QM i?2 THM
7`QK 2`HB2` BM i?2 +?Ti2` M/ i?2M +HHBM; toString QM Bi- r2 ;2i  bi`BM;
p2`v bBKBH` iQ i?2 THM r2 Tmi BMX
var world = new World ( plan , {"#": Wall ,
"o ": BouncingCritter }) ;
console . log ( world . toString () ) ;
// → ############################
// # # # o ##
// # #
// # ##### #
// ## # # ## #
// ### ## # #
// # ### # #
// # #### #
// # ## o #
// # o # o ### #
// # # #
// ############################

i?Bb M/ Bib b+QT2


h?2 World +QMbi`m+iQ` +QMiBMb  +HH iQ forEachX PM2 BMi2`2biBM; i?BM;
iQ MQi2 Bb i?i BMbB/2 i?2 7mM+iBQM Tbb2/ iQ forEach- r2 `2 MQ HQM;2`
/B`2+iHv BM i?2 7mM+iBQM b+QT2 Q7 i?2 +QMbi`m+iQ`X 1+? 7mM+iBQM +HH ;2ib
Bib QrM this #BM/BM;- bQ i?2 this BM i?2 BMM2` 7mM+iBQM /Q2b MQi `272` iQ

Rj9
i?2 M2rHv +QMbi`m+i2/ Q#D2+i i?i i?2 Qmi2` this `272`b iQX AM 7+i- r?2M
 7mM+iBQM BbMǶi +HH2/ b  K2i?Q/- this rBHH `272` iQ i?2 ;HQ#H Q#D2+iX
h?Bb K2Mb i?i r2 +MǶi r`Bi2 this.grid iQ ++2bb i?2 ;`B/ 7`QK BMbB/2
i?2 HQQTX AMbi2/- i?2 Qmi2` 7mM+iBQM +`2i2b  MQ`KH HQ+H p`B#H2-
grid- i?`Qm;? r?B+? i?2 BMM2` 7mM+iBQM ;2ib ++2bb iQ i?2 ;`B/X
h?Bb Bb  #Bi Q7  /2bB;M #HmM/2` BM Cpa+`BTiX 6Q`imMi2Hv- i?2 M2ti
p2`bBQM Q7 i?2 HM;m;2 T`QpB/2b  bQHmiBQM 7Q` i?Bb T`Q#H2KX J2Mr?BH2-
i?2`2 `2 rQ`F`QmM/bX  +QKKQM Tii2`M Bb iQ bv var self = this M/
7`QK i?2M QM `272` iQ self- r?B+? Bb  MQ`KH p`B#H2 M/ i?mb pBbB#H2 iQ
BMM2` 7mM+iBQMbX
MQi?2` bQHmiBQM Bb iQ mb2 i?2 bind K2i?Q/- r?B+? HHQrb mb iQ T`QpB/2
M 2tTHB+Bi this Q#D2+i iQ #BM/ iQX
var test = {
prop : 10 ,
addPropTo : function ( array ) {
return array . map ( function ( elt ) {
return this . prop + elt ;
}. bind ( this ) ) ;
}
};
console . log ( test . addPropTo ([5]) ) ;
// → [15]

h?2 7mM+iBQM Tbb2/ iQ map Bb i?2 `2bmHi Q7 i?2 bind +HH M/ i?mb ?b Bib
this #QmM/ iQ i?2 }`bi `;mK2Mi ;Bp2M iQ binděi?2 Qmi2` 7mM+iBQMǶb this
pHm2 Ur?B+? ?QH/b i?2 test Q#D2+iVX
JQbi biM/`/ ?B;?2`@Q`/2` K2i?Q/b QM ``vb- bm+? b forEach M/ map-
iF2 M QTiBQMH b2+QM/ `;mK2Mi i?i +M HbQ #2 mb2/ iQ T`QpB/2  this
7Q` i?2 +HHb iQ i?2 Bi2`iBQM 7mM+iBQMX aQ vQm +QmH/ 2tT`2bb i?2 T`2pBQmb
2tKTH2 BM  bHB;?iHv bBKTH2` rvX
var test = {
prop : 10 ,
addPropTo : function ( array ) {
return array . map ( function ( elt ) {
return this . prop + elt ;
}, this ) ; // ← no bind
}
};

Rj8
console . log ( test . addPropTo ([5]) ) ;
// → [15]

h?Bb rQ`Fb QMHv 7Q` ?B;?2`@Q`/2` 7mM+iBQMb i?i bmTTQ`i bm+?  +QMi2ti
T`K2i2`X q?2M i?2v /QMǶi- vQmǶHH M22/ iQ mb2 QM2 Q7 i?2 Qi?2` T@
T`Q+?2bX
AM Qm` QrM ?B;?2`@Q`/2` 7mM+iBQMb- r2 +M bmTTQ`i bm+?  +QMi2ti T@
`K2i2` #v mbBM; i?2 call K2i?Q/ iQ +HH i?2 7mM+iBQM ;Bp2M b M `;m@
K2MiX 6Q` 2tKTH2- ?2`2 Bb  forEach K2i?Q/ 7Q` Qm` Grid ivT2- r?B+? +HHb
 ;Bp2M 7mM+iBQM 7Q` 2+? 2H2K2Mi BM i?2 ;`B/ i?i BbMǶi MmHH Q` mM/2}M2/,
Grid . prototype . forEach = function (f , context ) {
for ( var y = 0; y < this . height ; y ++) {
for ( var x = 0; x < this . width ; x ++) {
var value = this . space [ x + y * this . width ];
if ( value != null )
f . call ( context , value , new Vector (x , y ) ) ;
}
}
};

MBKiBM; HB72
h?2 M2ti bi2T Bb iQ r`Bi2  turn K2i?Q/ 7Q` i?2 rQ`H/ Q#D2+i i?i ;Bp2b
i?2 +`Bii2`b  +?M+2 iQ +iX Ai rBHH ;Q Qp2` i?2 ;`B/ mbBM; i?2 forEach
K2i?Q/ r2 Dmbi /2}M2/- HQQFBM; 7Q` Q#D2+ib rBi? M act K2i?Q/X q?2M
Bi }M/b QM2- turn +HHb i?i K2i?Q/ iQ ;2i M +iBQM Q#D2+i M/ +``B2b Qmi
i?2 +iBQM r?2M Bi Bb pHB/X 6Q` MQr- QMHv "move" +iBQMb `2 mM/2`biQQ/X
h?2`2 Bb QM2 TQi2MiBH T`Q#H2K rBi? i?Bb TT`Q+?X *M vQm bTQi Bi\ A7
r2 H2i +`Bii2`b KQp2 b r2 +QK2 +`Qbb i?2K- i?2v Kv KQp2 iQ  b[m`2
i?i r2 ?p2MǶi HQQF2/ i v2i- M/ r2ǶHH HHQr i?2K iQ KQp2 ;BM r?2M
r2 `2+? i?i b[m`2X h?mb- r2 ?p2 iQ F22T M ``v Q7 +`Bii2`b i?i
?p2 H`2/v ?/ i?2B` im`M M/ B;MQ`2 i?2K r?2M r2 b22 i?2K ;BMX
World . prototype . turn = function () {
var acted = [];
this . grid . forEach ( function ( critter , vector ) {
if ( critter . act && acted . indexOf ( critter ) == -1) {
acted . push ( critter ) ;

Rje
this . letAct ( critter , vector );
}
} , this ) ;
};

q2 mb2 i?2 b2+QM/ T`K2i2` iQ i?2 ;`B/Ƕb forEach K2i?Q/ iQ #2 #H2


iQ ++2bb i?2 +Q``2+i this BMbB/2 i?2 BMM2` 7mM+iBQMX h?2 letAct K2i?Q/
+QMiBMb i?2 +imH HQ;B+ i?i HHQrb i?2 +`Bii2`b iQ KQp2X
World . prototype . letAct = function ( critter , vector ) {
var action = critter . act ( new View ( this , vector ) ) ;
if ( action && action . type == " move ") {
var dest = this . checkDestination ( action , vector );
if ( dest && this . grid . get ( dest ) == null ) {
this . grid . set ( vector , null ) ;
this . grid . set ( dest , critter ) ;
}
}
};

World . prototype . checkDestination = function ( action , vector ) {


if ( directions . hasOwnProperty ( action . direction ) ) {
var dest = vector . plus ( directions [ action . direction ]) ;
if ( this . grid . isInside ( dest ))
return dest ;
}
};

6B`bi- r2 bBKTHv bF i?2 +`Bii2` iQ +i- TbbBM; Bi  pB2r Q#D2+i i?i
FMQrb #Qmi i?2 rQ`H/ M/ i?2 +`Bii2`Ƕb +m``2Mi TQbBiBQM BM i?i rQ`H/
Ur2ǶHH /2}M2 View BM  KQK2MiVX h?2 act K2i?Q/ `2im`Mb M +iBQM Q7
bQK2 FBM/X
A7 i?2 +iBQMǶb type Bb MQi "move"- Bi Bb B;MQ`2/X A7 Bi Bb "move"- B7 Bi ?b
 direction T`QT2`iv i?i `272`b iQ  pHB/ /B`2+iBQM- M/ B7 i?2 b[m`2 BM
i?i /B`2+iBQM Bb 2KTiv UMmHHV- r2 b2i i?2 b[m`2 r?2`2 i?2 +`Bii2` mb2/
iQ #2 iQ ?QH/ MmHH M/ biQ`2 i?2 +`Bii2` BM i?2 /2biBMiBQM b[m`2X
LQi2 i?i letAct iF2b +`2 iQ B;MQ`2 MQMb2Mb2 BMTmiěBi /Q2bMǶi bbmK2
i?i i?2 +iBQMǶb direction T`QT2`iv Bb pHB/ Q` i?i i?2 type T`QT2`iv
KF2b b2Mb2X h?Bb FBM/ Q7 /272MbBp2 T`Q;`KKBM; KF2b b2Mb2 BM bQK2
bBimiBQMbX h?2 KBM `2bQM 7Q` /QBM; Bi Bb iQ pHB/i2 BMTmib +QKBM;
7`QK bQm`+2b vQm /QMǶi +QMi`QH Ubm+? b mb2` Q` }H2 BMTmiV- #mi Bi +M

Rjd
HbQ #2 mb27mH iQ BbQHi2 bm#bvbi2Kb 7`QK 2+? Qi?2`X AM i?Bb +b2- i?2
BMi2MiBQM Bb i?i i?2 +`Bii2`b i?2Kb2Hp2b +M #2 T`Q;`KK2/ bHQTTBHvě
i?2v /QMǶi ?p2 iQ p2`B7v B7 i?2B` BMi2M/2/ +iBQMb KF2 b2Mb2X h?2v +M
Dmbi `2[m2bi M +iBQM- M/ i?2 rQ`H/ rBHH };m`2 Qmi r?2i?2` iQ HHQr BiX
h?2b2 irQ K2i?Q/b `2 MQi T`i Q7 i?2 2ti2`MH BMi2`7+2 Q7  World
Q#D2+iX h?2v `2 M BMi2`MH /2iBHX aQK2 HM;m;2b T`QpB/2 rvb iQ
2tTHB+BiHv /2+H`2 +2`iBM K2i?Q/b M/ T`QT2`iB2b T`Bpi2 M/ bB;MH M
2``Q` r?2M vQm i`v iQ mb2 i?2K 7`QK QmibB/2 i?2 Q#D2+iX Cpa+`BTi /Q2b
MQi- bQ vQm rBHH ?p2 iQ `2Hv QM bQK2 Qi?2` 7Q`K Q7 +QKKmMB+iBQM iQ
/2b+`B#2 r?i Bb T`i Q7 M Q#D2+iǶb BMi2`7+2X aQK2iBK2b Bi +M ?2HT
iQ mb2  MKBM; b+?2K2 iQ /BbiBM;mBb? #2ir22M 2ti2`MH M/ BMi2`MH
T`QT2`iB2b- 7Q` 2tKTH2 #v T`2}tBM; HH BMi2`MH QM2b rBi? M mM/2`b+Q`2
+?`+i2` UnVX h?Bb rBHH KF2 ++B/2MiH mb2b Q7 T`QT2`iB2b i?i `2 MQi
T`i Q7 M Q#D2+iǶb BMi2`7+2 2bB2` iQ bTQiX
h?2 QM2 KBbbBM; T`i- i?2 View ivT2- HQQFb HBF2 i?Bb,
function View ( world , vector ) {
this . world = world ;
this . vector = vector ;
}
View . prototype . look = function ( dir ) {
var target = this . vector . plus ( directions [ dir ]) ;
if ( this . world . grid . isInside ( target ) )
return charFromElement ( this . world . grid . get ( target ) ) ;
else
return "#";
};
View . prototype . findAll = function ( ch ) {
var found = [];
for ( var dir in directions )
if ( this . look ( dir ) == ch )
found . push ( dir ) ;
return found ;
};
View . prototype . find = function ( ch ) {
var found = this . findAll ( ch ) ;
if ( found . length == 0) return null ;
return randomElement ( found );
};

Rj3
h?2 look K2i?Q/ };m`2b Qmi i?2 +QQ`/BMi2b i?i r2 `2 i`vBM; iQ HQQF
i M/- B7 i?2v `2 BMbB/2 i?2 ;`B/- }M/b i?2 +?`+i2` +Q``2bTQM/BM; iQ
i?2 2H2K2Mi i?i bBib i?2`2X 6Q` +QQ`/BMi2b QmibB/2 i?2 ;`B/- look bBKTHv
T`2i2M/b i?i i?2`2 Bb  rHH i?2`2 bQ i?i B7 vQm /2}M2  rQ`H/ i?i BbMǶi
rHH2/ BM- i?2 +`Bii2`b biBHH rQMǶi #2 i2KTi2/ iQ i`v iQ rHF Qz i?2 2/;2bX

Ai KQp2b
q2 BMbiMiBi2/  rQ`H/ Q#D2+i 2`HB2`X LQr i?i r2Ƕp2 //2/ HH i?2
M2+2bb`v K2i?Q/b- Bi b?QmH/ #2 TQbbB#H2 iQ +imHHv KF2 i?2 rQ`H/
KQp2X
for ( var i = 0; i < 5; i ++) {
world . turn () ;
console . log ( world . toString () ) ;
}
// →... five turns of moving critters

h?2 }`bi irQ KTb i?i `2 /BbTHv2/ rBHH HQQF bQK2i?BM; HBF2 i?Bb U/2@
T2M/BM; QM i?2 `M/QK /B`2+iBQM i?2 +`Bii2`b TB+F2/V,
############################ ############################
# # # ## # # # ##
# o # # #
# ##### # # ##### o #
## # # ## # ## # # ## #
### ## # # ### ## # #
# ### # # # ### # #
# #### # # #### #
# ## # # ## #
# # o ### # #o # ### #
#o # o # # # o o #
############################ ############################

h?2v KQp25 hQ ;2i  KQ`2 BMi2`+iBp2 pB2r Q7 i?2b2 +`Bii2`b +`rHBM;


`QmM/ M/ #QmM+BM; Qz i?2 rHHb- QT2M i?Bb +?Ti2` BM i?2 QMHBM2 p2`bBQM
Q7 i?2 #QQF i 2HQ[m2MiDpb+`BTiXM2iX

RjN
JQ`2 HB72 7Q`Kb
h?2 /`KiB+ ?B;?HB;?i Q7 Qm` rQ`H/- B7 vQm ri+? 7Q`  #Bi- Bb r?2M irQ
+`Bii2`b #QmM+2 Qz 2+? Qi?2`X *M vQm i?BMF Q7 MQi?2` BMi2`2biBM; 7Q`K
Q7 #2?pBQ`\
h?2 QM2 A +K2 mT rBi? Bb  +`Bii2` i?i KQp2b HQM; rHHbX *QM+2Tim@
HHv- i?2 +`Bii2` F22Tb Bib H27i ?M/ UTr- i2Mi+H2- r?i2p2`V iQ i?2 rHH
M/ 7QHHQrb HQM;X h?Bb im`Mb Qmi iQ #2 MQi 2MiB`2Hv i`BpBH iQ BKTH2K2MiX
q2 M22/ iQ #2 #H2 iQ dz+QKTmi2Ǵ rBi? +QKTbb /B`2+iBQMbX aBM+2 /B`2+@
iBQMb `2 KQ/2H2/ #v  b2i Q7 bi`BM;b- r2 M22/ iQ /2}M2 Qm` QrM QT2`iBQM
UdirPlusV iQ +H+mHi2 `2HiBp2 /B`2+iBQMbX aQ dirPlus("n", 1) K2Mb QM2 98@
/2;`22 im`M +HQ+FrBb2 7`QK MQ`i?- ;BpBM; "ne"X aBKBH`Hv- dirPlus("s", -2)
K2Mb Ny /2;`22b +QmMi2`+HQ+FrBb2 7`QK bQmi?- r?B+? Bb 2biX
function dirPlus ( dir , n ) {
var index = directionNames . indexOf ( dir ) ;
return directionNames [( index + n + 8) % 8];
}

function WallFollower () {
this . dir = " s ";
}

WallFollower . prototype . act = function ( view ) {


var start = this . dir ;
if ( view . look ( dirPlus ( this . dir , -3) ) != " ")
start = this . dir = dirPlus ( this . dir , -2) ;
while ( view . look ( this . dir ) != " ") {
this . dir = dirPlus ( this . dir , 1) ;
if ( this . dir == start ) break ;
}
return { type : " move " , direction : this . dir };
};

h?2 act K2i?Q/ QMHv ?b iQ dzb+MǴ i?2 +`Bii2`Ƕb bm``QmM/BM;b- bi`iBM;
7`QK Bib H27i bB/2 M/ ;QBM; +HQ+FrBb2 mMiBH Bi }M/b M 2KTiv b[m`2X Ai
i?2M KQp2b BM i?2 /B`2+iBQM Q7 i?i 2KTiv b[m`2X
q?i +QKTHB+i2b i?BM;b Bb i?i  +`Bii2` Kv 2M/ mT BM i?2 KB//H2 Q7
2KTiv bT+2- 2Bi?2` b Bib bi`i TQbBiBQM Q` b  `2bmHi Q7 rHFBM; `QmM/
MQi?2` +`Bii2`X A7 r2 TTHv i?2 TT`Q+? A Dmbi /2b+`B#2/ BM 2KTiv bT+2-

R9y
i?2 TQQ` +`Bii2` rBHH Dmbi F22T QM im`MBM; H27i i 2p2`v bi2T- `mMMBM; BM
+B`+H2bX
aQ i?2`2 Bb M 2ti` +?2+F Ui?2 if bii2K2MiV iQ bi`i b+MMBM; iQ i?2
H27i QMHv B7 Bi HQQFb HBF2 i?2 +`Bii2` ?b Dmbi Tbb2/ bQK2 FBM/ Q7 Q#bi+H2ě
i?i Bb- B7 i?2 bT+2 #2?BM/ M/ iQ i?2 H27i Q7 i?2 +`Bii2` Bb MQi 2KTivX
Pi?2`rBb2- i?2 +`Bii2` bi`ib b+MMBM; /B`2+iHv ?2/- bQ i?i BiǶHH rHF
bi`B;?i r?2M BM 2KTiv bT+2X
M/ }MHHv- i?2`2Ƕb  i2bi +QKT`BM; this.dir iQ start 7i2` 2p2`v Tbb
i?`Qm;? i?2 HQQT iQ KF2 bm`2 i?i i?2 HQQT rQMǶi `mM 7Q`2p2` r?2M
i?2 +`Bii2` Bb rHH2/ BM Q` +`Qr/2/ BM #v Qi?2` +`Bii2`b M/ +MǶi }M/ M
2KTiv b[m`2X

 KQ`2 HB72HBF2 bBKmHiBQM


hQ KF2 HB72 BM Qm` rQ`H/ KQ`2 BMi2`2biBM;- r2 rBHH // i?2 +QM+2Tib
Q7 7QQ/ M/ `2T`Q/m+iBQMX 1+? HBpBM; i?BM; BM i?2 rQ`H/ ;2ib  M2r
T`QT2`iv- energy- r?B+? Bb `2/m+2/ #v T2`7Q`KBM; +iBQMb M/ BM+`2b2/
#v 2iBM; i?BM;bX q?2M i?2 +`Bii2` ?b 2MQm;? 2M2`;v- Bi +M `2T`Q/m+2-
;2M2`iBM;  M2r +`Bii2` Q7 i?2 bK2 FBM/X hQ F22T i?BM;b bBKTH2- i?2
+`Bii2`b BM Qm` rQ`H/ `2T`Q/m+2 b2tmHHv- HH #v i?2Kb2Hp2bX
A7 +`Bii2`b QMHv KQp2 `QmM/ M/ 2i QM2 MQi?2`- i?2 rQ`H/ rBHH bQQM
bm++mK# iQ i?2 Hr Q7 BM+`2bBM; 2Mi`QTv- `mM Qmi Q7 2M2`;v- M/ #2+QK2
 HB72H2bb rbi2HM/X hQ T`2p2Mi i?Bb 7`QK ?TT2MBM; UiQQ [mB+FHv- i
H2biV- r2 // THMib iQ i?2 rQ`H/X SHMib /Q MQi KQp2X h?2v Dmbi mb2
T?QiQbvMi?2bBb iQ ;`Qr Ui?i Bb- BM+`2b2 i?2B` 2M2`;vV M/ `2T`Q/m+2X
hQ KF2 i?Bb rQ`F- r2ǶHH M22/  rQ`H/ rBi?  /Bz2`2Mi letAct K2i?Q/X
q2 +QmH/ Dmbi `2TH+2 i?2 K2i?Q/ Q7 i?2 World T`QiQivT2- #mi AǶp2 #2@
+QK2 p2`v ii+?2/ iQ Qm` bBKmHiBQM rBi? i?2 rHH@7QHHQrBM; +`Bii2`b M/
rQmH/ ?i2 iQ #`2F i?i QH/ rQ`H/X
PM2 bQHmiBQM Bb iQ mb2 BM?2`BiM+2X q2 +`2i2  M2r +QMbi`m+iQ`-
LifelikeWorld- r?Qb2 T`QiQivT2 Bb #b2/ QM i?2 World T`QiQivT2 #mi r?B+?
Qp2``B/2b i?2 letAct K2i?Q/X h?2 M2r letAct K2i?Q/ /2H2;i2b i?2 rQ`F
Q7 +imHHv T2`7Q`KBM; M +iBQM iQ p`BQmb 7mM+iBQMb biQ`2/ BM i?2 actionTypes
Q#D2+iX
function LifelikeWorld ( map , legend ) {
World . call ( this , map , legend ) ;

R9R
}
LifelikeWorld . prototype = Object . create ( World . prototype );

var actionTypes = Object . create ( null );

LifelikeWorld . prototype . letAct = function ( critter , vector ) {


var action = critter . act ( new View ( this , vector ) ) ;
var handled = action &&
action . type in actionTypes &&
actionTypes [ action . type ]. call ( this , critter ,
vector , action );
if (! handled ) {
critter . energy -= 0.2;
if ( critter . energy <= 0)
this . grid . set ( vector , null ) ;
}
};

h?2 M2r letAct K2i?Q/ }`bi +?2+Fb r?2i?2` M +iBQM rb `2im`M2/ i
HH- i?2M r?2i?2`  ?M/H2` 7mM+iBQM 7Q` i?Bb ivT2 Q7 +iBQM 2tBbib- M/
}MHHv r?2i?2` i?i ?M/H2` `2im`M2/ i`m2- BM/B+iBM; i?i Bi bm++2bb7mHHv
?M/H2/ i?2 +iBQMX LQi2 i?2 mb2 Q7 call iQ ;Bp2 i?2 ?M/H2` ++2bb iQ
i?2 rQ`H/- i?`Qm;? Bib this #BM/BM;X
A7 i?2 +iBQM /B/MǶi rQ`F 7Q` r?i2p2` `2bQM- i?2 /27mHi +iBQM Bb 7Q`
i?2 +`2im`2 iQ bBKTHv rBiX Ai HQb2b QM2@}7i? TQBMi Q7 2M2`;v- M/ B7 Bib
2M2`;v H2p2H /`QTb iQ x2`Q Q` #2HQr- i?2 +`2im`2 /B2b M/ Bb `2KQp2/
7`QK i?2 ;`B/X

+iBQM ?M/H2`b
h?2 bBKTH2bi +iBQM  +`2im`2 +M T2`7Q`K Bb "grow"- mb2/ #v THMibX
q?2M M +iBQM Q#D2+i HBF2 {type: "grow"} Bb `2im`M2/- i?2 7QHHQrBM; ?M@
/H2` K2i?Q/ rBHH #2 +HH2/,
actionTypes . grow = function ( critter ) {
critter . energy += 0.5;
return true ;
};

R9k
:`QrBM; Hrvb bm++22/b M/ //b ?H7  TQBMi iQ i?2 THMiǶb 2M2`;v
H2p2HX
JQpBM; Bb KQ`2 BMpQHp2/X
actionTypes . move = function ( critter , vector , action ) {
var dest = this . checkDestination ( action , vector ) ;
if ( dest == null ||
critter . energy <= 1 ||
this . grid . get ( dest ) != null )
return false ;
critter . energy -= 1;
this . grid . set ( vector , null ) ;
this . grid . set ( dest , critter );
return true ;
};

h?Bb +iBQM }`bi +?2+Fb- mbBM; i?2 checkDestination K2i?Q/ /2}M2/ 2`@
HB2`- r?2i?2` i?2 +iBQM T`QpB/2b  pHB/ /2biBMiBQMX A7 MQi- Q` B7 i?2
/2biBMiBQM BbMǶi 2KTiv- Q` B7 i?2 +`Bii2` H+Fb i?2 `2[mB`2/ 2M2`;v- move
`2im`Mb 7Hb2 iQ BM/B+i2 MQ +iBQM rb iF2MX Pi?2`rBb2- Bi KQp2b i?2
+`Bii2` M/ bm#i`+ib i?2 2M2`;v +QbiX
AM //BiBQM iQ KQpBM;- +`Bii2`b +M 2iX
actionTypes . eat = function ( critter , vector , action ) {
var dest = this . checkDestination ( action , vector ) ;
var atDest = dest != null && this . grid . get ( dest ) ;
if (! atDest || atDest . energy == null )
return false ;
critter . energy += atDest . energy ;
this . grid . set ( dest , null );
return true ;
};

1iBM; MQi?2` +`Bii2` HbQ BMpQHp2b T`QpB/BM;  pHB/ /2biBMiBQM b[m`2X


h?Bb iBK2- i?2 /2biBMiBQM Kmbi MQi #2 2KTiv M/ Kmbi +QMiBM bQK2@
i?BM; rBi? 2M2`;v- HBF2  +`Bii2` U#mi MQi  rHHěrHHb `2 MQi 2/B#H2VX A7
bQ- i?2 2M2`;v 7`QK i?2 2i2M Bb i`Mb72``2/ iQ i?2 2i2`- M/ i?2 pB+iBK
Bb `2KQp2/ 7`QK i?2 ;`B/X
M/ }MHHv- r2 HHQr Qm` +`Bii2`b iQ `2T`Q/m+2X
actionTypes . reproduce = function ( critter , vector , action ) {

R9j
var baby = elementFromChar ( this . legend ,
critter . originChar ) ;
var dest = this . checkDestination ( action , vector ) ;
if ( dest == null ||
critter . energy <= 2 * baby . energy ||
this . grid . get ( dest ) != null )
return false ;
critter . energy -= 2 * baby . energy ;
this . grid . set ( dest , baby );
return true ;
};

_2T`Q/m+BM; +Qbib irB+2 i?2 2M2`;v H2p2H Q7 i?2 M2r#Q`M +`Bii2`X aQ r2


}`bi +`2i2  U?vTQi?2iB+HV ##v mbBM; elementFromChar QM i?2 +`Bii2`Ƕb
QrM Q`B;BM +?`+i2`X PM+2 r2 ?p2  ##v- r2 +M }M/ Bib 2M2`;v H2p2H
M/ i2bi r?2i?2` i?2 T`2Mi ?b 2MQm;? 2M2`;v iQ bm++2bb7mHHv #`BM; Bi
BMiQ i?2 rQ`H/X q2 HbQ `2[mB`2  pHB/ UM/ 2KTivV /2biBMiBQMX
A7 2p2`vi?BM; Bb QFv- i?2 ##v Bb Tmi QMiQ i?2 ;`B/ UBi Bb MQr MQ HQM;2`
?vTQi?2iB+HV- M/ i?2 2M2`;v Bb bT2MiX

SQTmHiBM; i?2 M2r rQ`H/


q2 MQr ?p2  7`K2rQ`F iQ bBKmHi2 i?2b2 KQ`2 HB72HBF2 +`2im`2bX q2
+QmH/ Tmi i?2 +`Bii2`b 7`QK i?2 QH/ rQ`H/ BMiQ Bi- #mi i?2v rQmH/ Dmbi /B2
bBM+2 i?2v /QMǶi ?p2 M 2M2`;v T`QT2`ivX aQ H2iǶb KF2 M2r QM2bX 6B`bi
r2ǶHH r`Bi2  THMi- r?B+? Bb  `i?2` bBKTH2 HB72@7Q`KX
function Plant () {
this . energy = 3 + Math . random () * 4;
}
Plant . prototype . act = function ( view ) {
if ( this . energy > 15) {
var space = view . find (" ") ;
if ( space )
return { type : " reproduce ", direction : space };
}
if ( this . energy < 20)
return { type : " grow "};
};

R99
SHMib bi`i rBi? M 2M2`;v H2p2H #2ir22M j M/ d- `M/QKBx2/ bQ i?i
i?2v /QMǶi HH `2T`Q/m+2 BM i?2 bK2 im`MX q?2M  THMi `2+?2b R8
2M2`;v TQBMib M/ i?2`2 Bb 2KTiv bT+2 M2`#v- Bi `2T`Q/m+2b BMiQ i?i
2KTiv bT+2X A7  THMi +MǶi `2T`Q/m+2- Bi bBKTHv ;`Qrb mMiBH Bi `2+?2b
2M2`;v H2p2H kyX
q2 MQr /2}M2  THMi 2i2`X
function PlantEater () {
this . energy = 20;
}
PlantEater . prototype . act = function ( view ) {
var space = view . find (" ") ;
if ( this . energy > 60 && space )
return { type : " reproduce ", direction : space };
var plant = view . find ("*") ;
if ( plant )
return { type : " eat " , direction : plant };
if ( space )
return { type : " move " , direction : space };
};

q2ǶHH mb2 i?2 * +?`+i2` 7Q` THMib- bQ i?iǶb r?i i?Bb +`2im`2 rBHH HQQF
7Q` r?2M Bi b2`+?2b 7Q` 7QQ/X

"`BM;BM; Bi iQ HB72
M/ i?i ;Bp2b mb 2MQm;? 2H2K2Mib iQ i`v Qm` M2r rQ`H/X AK;BM2 i?2
7QHHQrBM; KT b  ;`bbv pHH2v rBi?  ?2`/ Q7 ?2`#BpQ`2b BM Bi- bQK2
#QmH/2`b- M/ Hmb? THMi HB72 2p2`vr?2`2X
var valley = new LifelikeWorld (
["############################" ,
"##### ######" ,
"## *** **##" ,
"# *##** ** O *##" ,
"# *** O ##** *#" ,
"# O ##*** #" ,
"# ##** #" ,
"# O #* #" ,
"#* #** O #" ,

R98
"#*** ##** O **#" ,
"##**** ###*** *###" ,
"############################"] ,
{"#": Wall ,
"O ": PlantEater ,
"*": Plant }
);

G2iǶb b22 r?i ?TT2Mb B7 r2 `mM i?BbX h?2b2 bMTb?Qib BHHmbi`i2 


ivTB+H `mM Q7 i?Bb rQ`H/X
############################ ############################
##### ###### ##### ** ######
## *** O *## ## ** * O ##
# *##* ** *## # **## ##
# ** ##* *# # ** O ## O #
# ##* # # *O * * ## #
# ## O # # *** ## O #
# #* O # #** #*** #
#* #** O # #** O #**** #
#* O O ##* **# #*** ##*** O #
##* ###* ### ##** ###** O ###
############################ ############################

############################ ############################
##### O O ###### ##### O ######
## ## ## ##
# ## O ## # ## O ##
# O O *## # # ## #
# O O O **## O # # ## #
# **## O # # O ## * #
# # *** * # # # O #
# # O ***** O # # O # O #
# ##****** # # ## O O #
## ###****** ### ## ### O ###
############################ ############################

############################ ############################
##### ###### ##### ######
## ## ## ** * ##
# ## ## # ## ***** ##
# ## # # ##**** #

R9e
# ##* * # # ##***** #
# O ## * # # ##****** #
# # # # # ** ** #
# # # # # #
# ## # # ## #
## ### ### ## ### ###
############################ ############################

JQbi Q7 i?2 iBK2- i?2 THMib KmHiBTHv M/ 2tTM/ [mBi2 [mB+FHv- #mi i?2M
i?2 #mM/M+2 Q7 7QQ/ +mb2b  TQTmHiBQM 2tTHQbBQM Q7 i?2 ?2`#BpQ`2b-
r?Q T`Q+22/ iQ rBT2 Qmi HH Q` M2`Hv HH Q7 i?2 THMib- `2bmHiBM; BM
 Kbb bi`piBQM Q7 i?2 +`Bii2`bX aQK2iBK2b- i?2 2+Qbvbi2K `2+Qp2`b
M/ MQi?2` +v+H2 bi`ibX i Qi?2` iBK2b- QM2 Q7 i?2 bT2+B2b /B2b Qmi
+QKTH2i2HvX A7 BiǶb i?2 ?2`#BpQ`2b- i?2 r?QH2 bT+2 rBHH }HH rBi? THMibX
A7 BiǶb i?2 THMib- i?2 `2KBMBM; +`Bii2`b bi`p2- M/ i?2 pHH2v #2+QK2b
 /2bQHi2 rbi2HM/X ?- i?2 +`m2Hiv Q7 Mim`2X

1t2`+Bb2b
`iB}+BH bimTB/Biv
>pBM; i?2 BM?#BiMib Q7 Qm` rQ`H/ ;Q 2tiBM+i 7i2`  72r KBMmi2b Bb
FBM/ Q7 /2T`2bbBM;X hQ /2H rBi? i?Bb- r2 +QmH/ i`v iQ +`2i2  bK`i2`
THMi 2i2`X
h?2`2 `2 b2p2`H Q#pBQmb T`Q#H2Kb rBi? Qm` ?2`#BpQ`2bX 6B`bi- i?2v
`2 i2``B#Hv ;`22/v- bim{M; i?2Kb2Hp2b rBi? 2p2`v THMi i?2v b22 mMiBH
i?2v ?p2 rBT2/ Qmi i?2 HQ+H THMi HB72X a2+QM/- i?2B` `M/QKBx2/ KQp2@
K2Mi U`2+HH i?i i?2 view.find K2i?Q/ `2im`Mb  `M/QK /B`2+iBQM r?2M
KmHiBTH2 /B`2+iBQMb Ki+?V +mb2b i?2K iQ bimK#H2 `QmM/ BM2z2+iBp2Hv
M/ bi`p2 B7 i?2`2 /QMǶi ?TT2M iQ #2 Mv THMib M2`#vX M/ }MHHv-
i?2v #`22/ p2`v 7bi- r?B+? KF2b i?2 +v+H2b #2ir22M #mM/M+2 M/
7KBM2 [mBi2 BMi2Mb2X
q`Bi2  M2r +`Bii2` ivT2 i?i i`B2b iQ //`2bb QM2 Q` KQ`2 Q7 i?2b2
TQBMib M/ bm#biBimi2 Bi 7Q` i?2 QH/ PlantEater ivT2 BM i?2 pHH2v rQ`H/X
a22 ?Qr Bi 7`2bX hr2F Bi bQK2 KQ`2 B7 M2+2bb`vX

R9d
S`2/iQ`b
Mv b2`BQmb 2+Qbvbi2K ?b  7QQ/ +?BM HQM;2` i?M  bBM;H2 HBMFX q`Bi2
MQi?2` +`Bii2` i?i bm`pBp2b #v 2iBM; i?2 ?2`#BpQ`2 +`Bii2`X uQmǶHH MQ@
iB+2 i?i bi#BHBiv Bb 2p2M ?`/2` iQ +?B2p2 MQr i?i i?2`2 `2 +v+H2b
i KmHiBTH2 H2p2HbX h`v iQ }M/  bi`i2;v iQ KF2 i?2 2+Qbvbi2K `mM
bKQQi?Hv 7Q` i H2bi  HBiiH2 r?BH2X
PM2 i?BM; i?i rBHH ?2HT Bb iQ KF2 i?2 rQ`H/ #B;;2`X h?Bb rv- HQ+H
TQTmHiBQM #QQKb Q` #mbib `2 H2bb HBF2Hv iQ rBT2 Qmi  bT2+B2b 2MiB`2Hv-
M/ i?2`2 Bb bT+2 7Q` i?2 `2HiBp2Hv H`;2 T`2v TQTmHiBQM M22/2/ iQ
bmbiBM  bKHH T`2/iQ` TQTmHiBQMX

R93
dz.2#m;;BM; Bb irB+2 b ?`/ b r`BiBM; i?2 +Q/2 BM i?2 }`bi
TH+2X h?2`27Q`2- B7 vQm r`Bi2 i?2 +Q/2 b +H2p2`Hv b TQbbB#H2-
vQm `2- #v /2}MBiBQM- MQi bK`i 2MQm;? iQ /2#m; BiXǴ
ě"`BM E2`MB;?M M/ SXCX SHm;2`- h?2 1H2K2Mib Q7
S`Q;`KKBM; aivH2

3 "m;b M/ 1``Q` >M/HBM;


 T`Q;`K Bb +`vbiHHBx2/ i?Qm;?iX aQK2iBK2b i?Qb2 i?Qm;?ib `2 +QM@
7mb2/X Pi?2` iBK2b- KBbiF2b `2 BMi`Q/m+2/ r?2M +QMp2`iBM; i?Qm;?i
BMiQ +Q/2X 1Bi?2` rv- i?2 `2bmHi Bb  ~r2/ T`Q;`KX
6Hrb BM  T`Q;`K `2 mbmHHv +HH2/ #m;bX "m;b +M #2 T`Q;`KK2`
2``Q`b Q` T`Q#H2Kb BM Qi?2` bvbi2Kb i?i i?2 T`Q;`K BMi2`+ib rBi?X
aQK2 #m;b `2 BKK2/Bi2Hv TT`2Mi- r?BH2 Qi?2`b `2 bm#iH2 M/ KB;?i
`2KBM ?B//2M BM  bvbi2K 7Q` v2`bX
P7i2M- T`Q#H2Kb bm`7+2 QMHv r?2M  T`Q;`K 2M+QmMi2`b  bBimiBQM
i?i i?2 T`Q;`KK2` /B/MǶi Q`B;BMHHv +QMbB/2`X aQK2iBK2b bm+? bBim@
iBQMb `2 mMpQB/#H2X q?2M i?2 mb2` Bb bF2/ iQ BMTmi i?2B` ;2 M/
ivT2b Q`M;2- i?Bb Tmib Qm` T`Q;`K BM  /B{+mHi TQbBiBQMX h?2 bBimiBQM
?b iQ #2 MiB+BTi2/ M/ ?M/H2/ bQK2?QrX

S`Q;`KK2` KBbiF2b
q?2M Bi +QK2b iQ T`Q;`KK2` KBbiF2b- Qm` BK Bb bBKTH2X q2 rMi iQ
}M/ i?2K M/ }t i?2KX am+? KBbiF2b +M `M;2 7`QK bBKTH2 ivTQb i?i
+mb2 i?2 +QKTmi2` iQ +QKTHBM b bQQM b Bi Hvb 2v2b QM Qm` T`Q;`K iQ
bm#iH2 KBbiF2b BM Qm` mM/2`biM/BM; Q7 i?2 rv i?2 T`Q;`K QT2`i2b-
+mbBM; BM+Q``2+i Qmi+QK2b QMHv BM bT2+B}+ bBimiBQMbX "m;b Q7 i?2 Hii2`
ivT2 +M iF2 r22Fb iQ /B;MQb2X
h?2 /2;`22 iQ r?B+? HM;m;2b ?2HT vQm }M/ bm+? KBbiF2b p`B2bX
lMbm`T`BbBM;Hv- Cpa+`BTi Bb i i?2 dz?`/Hv ?2HTb i HHǴ 2M/ Q7 i?i
b+H2X aQK2 HM;m;2b rMi iQ FMQr i?2 ivT2b Q7 HH vQm` p`B#H2b M/
2tT`2bbBQMb #27Q`2 2p2M `mMMBM;  T`Q;`K M/ rBHH i2HH vQm `B;?i rv
r?2M  ivT2 Bb mb2/ BM M BM+QMbBbi2Mi rvX Cpa+`BTi +QMbB/2`b ivT2b
QMHv r?2M +imHHv `mMMBM; i?2 T`Q;`K- M/ 2p2M i?2M- Bi HHQrb vQm iQ
/Q bQK2 +H2`Hv MQMb2MbB+H i?BM;b rBi?Qmi +QKTHBMi- bm+? b x = true
* "monkey"X

R9N
h?2`2 `2 bQK2 i?BM;b i?i Cpa+`BTi /Q2b +QKTHBM #Qmi- i?Qm;?X
q`BiBM;  T`Q;`K i?i Bb MQi bvMi+iB+HHv pHB/ rBHH BKK2/Bi2Hv i`B;;2`
M 2``Q`X Pi?2` i?BM;b- bm+? b +HHBM; bQK2i?BM; i?iǶb MQi  7mM+iBQM
Q` HQQFBM; mT  T`QT2`iv QM M mM/2}M2/ pHm2- rBHH +mb2 M 2``Q` iQ #2
`2TQ`i2/ r?2M i?2 T`Q;`K Bb `mMMBM; M/ 2M+QmMi2`b i?2 MQMb2MbB+H
+iBQMX
"mi Q7i2M- vQm` MQMb2Mb2 +QKTmiiBQM rBHH bBKTHv T`Q/m+2  NaN UMQi
 MmK#2`V Q` mM/2}M2/ pHm2X M/ i?2 T`Q;`K ?TTBHv +QMiBMm2b- +QM@
pBM+2/ i?i BiǶb /QBM; bQK2i?BM; K2MBM;7mHX h?2 KBbiF2 rBHH KMB72bi
Bib2H7 QMHv Hi2`- 7i2` i?2 #Q;mb pHm2 ?b i`p2H2/ i?`Qm;? b2p2`H 7mM+@
iBQMbX Ai KB;?i MQi i`B;;2` M 2``Q` i HH #mi bBH2MiHv +mb2 i?2 T`Q;`KǶb
QmiTmi iQ #2 r`QM;X 6BM/BM; i?2 bQm`+2 Q7 bm+? T`Q#H2Kb +M #2 /B{+mHiX
h?2 T`Q+2bb Q7 }M/BM; KBbiF2bě#m;běBM T`Q;`Kb Bb +HH2/ /2#m;@
;BM;X

ai`B+i KQ/2
Cpa+`BTi +M #2 K/2  HBiiH2 KQ`2 bi`B+i #v 2M#HBM; bi`B+i KQ/2X h?Bb
Bb /QM2 #v TmiiBM; i?2 bi`BM; "use strict" i i?2 iQT Q7  }H2 Q`  7mM+iBQM
#Q/vX >2`2Ƕb M 2tKTH2,
function canYouSpotTheProblem () {
" use strict ";
for ( counter = 0; counter < 10; counter ++)
console . log (" Happy happy ") ;
}

canYouSpotTheProblem () ;
// → ReferenceError : counter is not defined

LQ`KHHv- r?2M vQm 7Q`;2i iQ Tmi var BM 7`QMi Q7 vQm` p`B#H2- b rBi?
counter BM i?2 2tKTH2- Cpa+`BTi [mB2iHv +`2i2b  ;HQ#H p`B#H2 M/
mb2b i?iX AM bi`B+i KQ/2- ?Qr2p2`- M 2``Q` Bb `2TQ`i2/ BMbi2/X h?Bb Bb
p2`v ?2HT7mHX Ai b?QmH/ #2 MQi2/- i?Qm;?- i?i i?Bb /Q2bMǶi rQ`F r?2M
i?2 p`B#H2 BM [m2biBQM H`2/v 2tBbib b  ;HQ#H p`B#H2- #mi QMHv r?2M
bbB;MBM; iQ Bi rQmH/ ?p2 +`2i2/ BiX
MQi?2` +?M;2 BM bi`B+i KQ/2 Bb i?i i?2 this #BM/BM; ?QH/b i?2 pHm2
undefined BM 7mM+iBQMb i?i `2 MQi +HH2/ b K2i?Q/bX q?2M KFBM; bm+?

R8y
 +HH QmibB/2 Q7 bi`B+i KQ/2- this `272`b iQ i?2 ;HQ#H b+QT2 Q#D2+iX aQ B7
vQm ++B/2MiHHv +HH  K2i?Q/ Q` +QMbi`m+iQ` BM+Q``2+iHv BM bi`B+i KQ/2-
Cpa+`BTi rBHH T`Q/m+2 M 2``Q` b bQQM b Bi i`B2b iQ `2/ bQK2i?BM;
7`QK this- `i?2` i?M ?TTBHv rQ`FBM; rBi? i?2 ;HQ#H Q#D2+i- +`2iBM;
M/ `2/BM; ;HQ#H p`B#H2bX
6Q` 2tKTH2- +QMbB/2` i?2 7QHHQrBM; +Q/2- r?B+? +HHb  +QMbi`m+iQ`
rBi?Qmi i?2 new F2vrQ`/ bQ i?i Bib this rBHH MQi `272` iQ  M2rHv +QM@
bi`m+i2/ Q#D2+i,
function Person ( name ) { this . name = name ; }
var ferdinand = Person (" Ferdinand ") ; // oops
console . log ( name ) ;
// → Ferdinand

aQ i?2 #Q;mb +HH iQ Person bm++22/2/ #mi `2im`M2/ M mM/2}M2/ pHm2 M/
+`2i2/ i?2 ;HQ#H p`B#H2 nameX AM bi`B+i KQ/2- i?2 `2bmHi Bb /Bz2`2MiX
" use strict ";
function Person ( name ) { this . name = name ; }
// Oops , forgot new
var ferdinand = Person (" Ferdinand ") ;
// → TypeError : Cannot set property name of undefined

q2 `2 BKK2/Bi2Hv iQH/ i?i bQK2i?BM; Bb r`QM;X h?Bb Bb ?2HT7mHX


ai`B+i KQ/2 /Q2b  72r KQ`2 i?BM;bX Ai /BbHHQrb ;BpBM;  7mM+iBQM
KmHiBTH2 T`K2i2`b rBi? i?2 bK2 MK2 M/ `2KQp2b +2`iBM T`Q#H2K@
iB+ HM;m;2 72im`2b 2MiB`2Hv Ubm+? b i?2 with bii2K2Mi- r?B+? Bb bQ
KBb;mB/2/ Bi Bb MQi 7m`i?2` /Bb+mbb2/ BM i?Bb #QQFVX
AM b?Q`i- TmiiBM;  "use strict" i i?2 iQT Q7 vQm` T`Q;`K ``2Hv ?m`ib
M/ KB;?i ?2HT vQm bTQi  T`Q#H2KX

h2biBM;
A7 i?2 HM;m;2 Bb MQi ;QBM; iQ /Q Km+? iQ ?2HT mb }M/ KBbiF2b- r2ǶHH
?p2 iQ }M/ i?2K i?2 ?`/ rv, #v `mMMBM; i?2 T`Q;`K M/ b22BM;
r?2i?2` Bi /Q2b i?2 `B;?i i?BM;X
.QBM; i?Bb #v ?M/- ;BM M/ ;BM- Bb  bm`2 rv iQ /`Bp2 vQm`b2H7
BMbM2X 6Q`imMi2Hv- Bi Bb Q7i2M TQbbB#H2 iQ r`Bi2  b2+QM/ T`Q;`K i?i
miQKi2b i2biBM; vQm` +imH T`Q;`KX

R8R
b M 2tKTH2- r2 QM+2 ;BM mb2 i?2 Vector ivT2X
function Vector (x , y ) {
this . x = x ;
this . y = y ;
}
Vector . prototype . plus = function ( other ) {
return new Vector ( this . x + other .x , this . y + other . y ) ;
};

q2 rBHH r`Bi2  T`Q;`K iQ +?2+F i?i Qm` BKTH2K2MiiBQM Q7 Vector rQ`Fb


b BMi2M/2/X h?2M- 2p2`v iBK2 r2 +?M;2 i?2 BKTH2K2MiiBQM- r2 7QHHQr
mT #v `mMMBM; i?2 i2bi T`Q;`K bQ i?i r2 +M #2 `2bQM#Hv +QM}/2Mi
i?i r2 /B/MǶi #`2F Mvi?BM;X q?2M r2 // 2ti` 7mM+iBQMHBiv U7Q`
2tKTH2-  M2r K2i?Q/V iQ i?2 Vector ivT2- r2 HbQ // i2bib 7Q` i?2
M2r 72im`2X
function testVector () {
var p1 = new Vector (10 , 20) ;
var p2 = new Vector ( -10 , 5) ;
var p3 = p1 . plus ( p2 ) ;

if ( p1 . x !== 10) return " fail : x property ";


if ( p1 . y !== 20) return " fail : y property ";
if ( p2 . x !== -10) return " fail : negative x property ";
if ( p3 . x !== 0) return " fail : x from plus ";
if ( p3 . y !== 25) return " fail : y from plus ";
return " everything ok ";
}
console . log ( testVector () );
// → everything ok

q`BiBM; i2bib HBF2 i?Bb i2M/b iQ T`Q/m+2 `i?2` `2T2iBiBp2- rFr`/ +Q/2X
6Q`imMi2Hv- i?2`2 2tBbi TB2+2b Q7 bQ7ir`2 i?i ?2HT vQm #mBH/ M/ `mM
+QHH2+iBQMb Q7 i2bib Ui2bi bmBi2bV #v T`QpB/BM;  HM;m;2 UBM i?2 7Q`K
Q7 7mM+iBQMb M/ K2i?Q/bV bmBi2/ iQ 2tT`2bbBM; i2bib M/ #v QmiTmiiBM;
BM7Q`KiBp2 BM7Q`KiBQM r?2M  i2bi 7BHbX h?2b2 `2 +HH2/ i2biBM; 7`K2@
rQ`FbX

R8k
.2#m;;BM;
PM+2 vQm MQiB+2 i?i i?2`2 Bb bQK2i?BM; r`QM; rBi? vQm` T`Q;`K #2@
+mb2 Bi KBb#2?p2b Q` T`Q/m+2b 2``Q`b- i?2 M2ti bi2T Bb iQ };m`2 Qmi
r?i i?2 T`Q#H2K BbX
aQK2iBK2b Bi Bb Q#pBQmbX h?2 2``Q` K2bb;2 rBHH TQBMi i  bT2+B}+ HBM2
Q7 vQm` T`Q;`K- M/ B7 vQm HQQF i i?2 2``Q` /2b+`BTiBQM M/ i?i HBM2
Q7 +Q/2- vQm +M Q7i2M b22 i?2 T`Q#H2KX
"mi MQi HrvbX aQK2iBK2b i?2 HBM2 i?i i`B;;2`2/ i?2 T`Q#H2K Bb
bBKTHv i?2 }`bi TH+2 r?2`2  #Q;mb pHm2 T`Q/m+2/ 2Hb2r?2`2 ;2ib mb2/
BM M BMpHB/ rvX M/ bQK2iBK2b i?2`2 Bb MQ 2``Q` K2bb;2 i HHěDmbi
M BMpHB/ `2bmHiX A7 vQm ?p2 #22M bQHpBM; i?2 2t2`+Bb2b BM i?2 2`HB2`
+?Ti2`b- vQm rBHH T`Q##Hv ?p2 H`2/v 2tT2`B2M+2/ bm+? bBimiBQMbX
h?2 7QHHQrBM; 2tKTH2 T`Q;`K i`B2b iQ +QMp2`i  r?QH2 MmK#2` iQ 
bi`BM; BM Mv #b2 U/2+BKH- #BM`v- M/ bQ QMV #v `2T2i2/Hv TB+FBM; Qmi
i?2 Hbi /B;Bi M/ i?2M /BpB/BM; i?2 MmK#2` iQ ;2i `B/ Q7 i?Bb /B;BiX "mi
i?2 BMbM2 QmiTmi i?i Bi +m``2MiHv T`Q/m+2b bm;;2bib i?i Bi ?b  #m;X
function numberToString (n , base ) {
var result = "" , sign = "";
if ( n < 0) {
sign = " -";
n = -n ;
}
do {
result = String ( n % base ) + result ;
n /= base ;
} while ( n > 0) ;
return sign + result ;
}
console . log ( numberToString (13 , 10) ) ;
// → 1.5 e -3231.3 e -3221.3 e -3211.3 e -3201.3 e -3191.3 e...-3181.3

1p2M B7 vQm b22 i?2 T`Q#H2K H`2/v- T`2i2M/ 7Q`  KQK2Mi i?i vQm
/QMǶiX q2 FMQr i?i Qm` T`Q;`K Bb KH7mM+iBQMBM;- M/ r2 rMi iQ
}M/ Qmi r?vX
h?Bb Bb r?2`2 vQm Kmbi `2bBbi i?2 m`;2 iQ bi`i KFBM; `M/QK +?M;2b
iQ i?2 +Q/2X AMbi2/- i?BMFX MHvx2 r?i Bb ?TT2MBM; M/ +QK2 mT
rBi?  i?2Q`v Q7 r?v Bi KB;?i #2 ?TT2MBM;X h?2M- KF2 //BiBQMH

R8j
Q#b2`piBQMb iQ i2bi i?Bb i?2Q`věQ`- B7 vQm /QMǶi v2i ?p2  i?2Q`v- KF2
//BiBQMH Q#b2`piBQMb i?i KB;?i ?2HT vQm +QK2 mT rBi? QM2X
SmiiBM;  72r bi`i2;B+ console.log +HHb BMiQ i?2 T`Q;`K Bb  ;QQ/ rv
iQ ;2i //BiBQMH BM7Q`KiBQM #Qmi r?i i?2 T`Q;`K Bb /QBM;X AM i?Bb
+b2- r2 rMi n iQ iF2 i?2 pHm2b 13- 1- M/ i?2M 0X G2iǶb r`Bi2 Qmi Bib
pHm2 i i?2 bi`i Q7 i?2 HQQTX
13
1.3
0.13
0.013...

1.5 e -323

_B;?iX .BpB/BM; Rj #v Ry /Q2b MQi T`Q/m+2  r?QH2 MmK#2`X AMbi2/ Q7


n /= base- r?i r2 +imHHv rMi Bb n = Math.floor(n / base) bQ i?i i?2
MmK#2` Bb T`QT2`Hv dzb?B7i2/Ǵ iQ i?2 `B;?iX
M Hi2`MiBp2 iQ mbBM; console.log Bb iQ mb2 i?2 /2#m;;2` +T#BHBiB2b Q7
vQm` #`Qrb2`X JQ/2`M #`Qrb2`b +QK2 rBi? i?2 #BHBiv iQ b2i  #`2FTQBMi
QM  bT2+B}+ HBM2 Q7 vQm` +Q/2X h?Bb rBHH +mb2 i?2 2t2+miBQM Q7 i?2
T`Q;`K iQ Tmb2 2p2`v iBK2 i?2 HBM2 rBi? i?2 #`2FTQBMi Bb `2+?2/
M/ HHQr vQm iQ BMbT2+i i?2 pHm2b Q7 p`B#H2b i i?i TQBMiX A rQMǶi
;Q BMiQ /2iBHb ?2`2 bBM+2 /2#m;;2`b /Bz2` 7`QK #`Qrb2` iQ #`Qrb2`- #mi
HQQF BM vQm` #`Qrb2`Ƕb /2p2HQT2` iQQHb M/ b2`+? i?2 q2# 7Q` KQ`2
BM7Q`KiBQMX MQi?2` rv iQ b2i  #`2FTQBMi Bb iQ BM+Hm/2  debugger
bii2K2Mi U+QMbBbiBM; Q7 bBKTHv i?i F2vrQ`/V BM vQm` T`Q;`KX A7
i?2 /2p2HQT2` iQQHb Q7 vQm` #`Qrb2` `2 +iBp2- i?2 T`Q;`K rBHH Tmb2
r?2M2p2` Bi `2+?2b i?i bii2K2Mi- M/ vQm rBHH #2 #H2 iQ BMbT2+i Bib
bii2X

1``Q` T`QT;iBQM
LQi HH T`Q#H2Kb +M #2 T`2p2Mi2/ #v i?2 T`Q;`KK2`- mM7Q`imMi2HvX A7
vQm` T`Q;`K +QKKmMB+i2b rBi? i?2 QmibB/2 rQ`H/ BM Mv rv- i?2`2 Bb
 +?M+2 i?i i?2 BMTmi Bi ;2ib rBHH #2 BMpHB/ Q` i?i Qi?2` bvbi2Kb i?i
Bi i`B2b iQ iHF iQ `2 #`QF2M Q` mM`2+?#H2X
aBKTH2 T`Q;`Kb- Q` T`Q;`Kb i?i `mM QMHv mM/2` vQm` bmT2`pBbBQM-
+M zQ`/ iQ Dmbi ;Bp2 mT r?2M bm+?  T`Q#H2K Q++m`bX uQmǶHH HQQF BMiQ

R89
i?2 T`Q#H2K M/ i`v ;BMX dz_2HǴ TTHB+iBQMb- QM i?2 Qi?2` ?M/- `2
2tT2+i2/ iQ MQi bBKTHv +`b?X aQK2iBK2b i?2 `B;?i i?BM; iQ /Q Bb iF2
i?2 #/ BMTmi BM bi`B/2 M/ +QMiBMm2 `mMMBM;X AM Qi?2` +b2b- Bi Bb #2ii2`
iQ `2TQ`i iQ i?2 mb2` r?i r2Mi r`QM; M/ i?2M ;Bp2 mTX "mi BM 2Bi?2`
bBimiBQM- i?2 T`Q;`K ?b iQ +iBp2Hv /Q bQK2i?BM; BM `2bTQMb2 iQ i?2
T`Q#H2KX
av vQm ?p2  7mM+iBQM promptInteger i?i bFb i?2 mb2` 7Q`  r?QH2
MmK#2` M/ `2im`Mb BiX q?i b?QmH/ Bi `2im`M B7 i?2 mb2` BMTmib Q`M;2\
PM2 QTiBQM Bb iQ KF2 Bi `2im`M  bT2+BH pHm2X *QKKQM +?QB+2b 7Q`
bm+? pHm2b `2 null M/ undefinedX
function promptNumber ( question ) {
var result = Number ( prompt ( question , "") ) ;
if ( isNaN ( result ) ) return null ;
else return result ;
}

console . log ( promptNumber (" How many trees do you see ?") ) ;

h?Bb Bb  bQmM/ bi`i2;vX LQr Mv +Q/2 i?i +HHb promptNumber Kmbi +?2+F
r?2i?2` M +imH MmK#2` rb `2/ M/- 7BHBM; i?i- Kmbi bQK2?Qr
`2+Qp2`ěKv#2 #v bFBM; ;BM Q` #v }HHBM; BM  /27mHi pHm2X P` Bi
+QmH/ ;BM `2im`M  bT2+BH pHm2 iQ Bib +HH2` iQ BM/B+i2 i?i Bi 7BH2/
iQ /Q r?i Bi rb bF2/X
AM KMv bBimiBQMb- KQbiHv r?2M 2``Q`b `2 +QKKQM M/ i?2 +HH2`
b?QmH/ #2 2tTHB+BiHv iFBM; i?2K BMiQ ++QmMi- `2im`MBM;  bT2+BH pHm2
Bb  T2`72+iHv }M2 rv iQ BM/B+i2 M 2``Q`X Ai /Q2b- ?Qr2p2`- ?p2 Bib
/QrMbB/2bX 6B`bi- r?i B7 i?2 7mM+iBQM +M H`2/v `2im`M 2p2`v TQbbB#H2
FBM/ Q7 pHm2\ 6Q` bm+?  7mM+iBQM- Bi Bb ?`/ iQ }M/  bT2+BH pHm2 i?i
+M #2 /BbiBM;mBb?2/ 7`QK  pHB/ `2bmHiX
h?2 b2+QM/ Bbbm2 rBi? `2im`MBM; bT2+BH pHm2b Bb i?i Bi +M H2/ iQ
bQK2 p2`v +Hmii2`2/ +Q/2X A7  TB2+2 Q7 +Q/2 +HHb promptNumber Ry iBK2b-
Bi ?b iQ +?2+F Ry iBK2b r?2i?2` null rb `2im`M2/X M/ B7 Bib `2bTQMb2
iQ }M/BM; null Bb iQ bBKTHv `2im`M null Bib2H7- i?2 +HH2` rBHH BM im`M ?p2
iQ +?2+F 7Q` Bi- M/ bQ QMX

R88
1t+2TiBQMb
q?2M  7mM+iBQM +MMQi T`Q+22/ MQ`KHHv- r?i r2 rQmH/ HBF2 iQ /Q Bb
Dmbi biQT r?i r2 `2 /QBM; M/ BKK2/Bi2Hv DmKT #+F iQ  TH+2 i?i
FMQrb ?Qr iQ ?M/H2 i?2 T`Q#H2KX h?Bb Bb r?i 2t+2TiBQM ?M/HBM; /Q2bX
1t+2TiBQMb `2  K2+?MBbK i?i KF2 Bi TQbbB#H2 7Q` +Q/2 i?i `mMb
BMiQ  T`Q#H2K iQ `Bb2 UQ` i?`QrV M 2t+2TiBQM- r?B+? Bb bBKTHv  pHm2X
_BbBM; M 2t+2TiBQM bQK2r?i `2b2K#H2b  bmT2`@+?`;2/ `2im`M 7`QK
 7mM+iBQM, Bi DmKTb Qmi Q7 MQi Dmbi i?2 +m``2Mi 7mM+iBQM #mi HbQ Qmi
Q7 Bib +HH2`b- HH i?2 rv /QrM iQ i?2 }`bi +HH i?i bi`i2/ i?2 +m``2Mi
2t2+miBQMX h?Bb Bb +HH2/ mMrBM/BM; i?2 bi+FX uQm Kv `2K2K#2` i?2
bi+F Q7 7mM+iBQM +HHb i?i rb K2MiBQM2/ BM *?Ti2` jX M 2t+2TiBQM
xQQKb /QrM i?Bb bi+F- i?`QrBM; rv HH i?2 +HH +QMi2tib Bi 2M+QmMi2`bX
A7 2t+2TiBQMb Hrvb xQQK2/ `B;?i /QrM iQ i?2 #QiiQK Q7 i?2 bi+F-
i?2v rQmH/ MQi #2 Q7 Km+? mb2X h?2v rQmH/ Dmbi T`QpB/2  MQp2H rv
iQ #HQr mT vQm` T`Q;`KX h?2B` TQr2` HB2b BM i?2 7+i i?i vQm +M b2i
dzQ#bi+H2bǴ HQM; i?2 bi+F iQ +i+? i?2 2t+2TiBQM b Bi Bb xQQKBM; /QrMX
h?2M vQm +M /Q bQK2i?BM; rBi? Bi- 7i2` r?B+? i?2 T`Q;`K +QMiBMm2b
`mMMBM; i i?2 TQBMi r?2`2 i?2 2t+2TiBQM rb +m;?iX
>2`2Ƕb M 2tKTH2,
function promptDirection ( question ) {
var result = prompt ( question , "") ;
if ( result . toLowerCase () == " left ") return " L ";
if ( result . toLowerCase () == " right ") return " R ";
throw new Error (" Invalid direction : " + result );
}

function look () {
if ( promptDirection (" Which way ?") == " L ")
return " a house ";
else
return " two angry bears ";
}

try {
console . log (" You see " , look () ) ;
} catch ( error ) {
console . log (" Something went wrong : " + error ) ;
}

R8e
h?2 throw F2vrQ`/ Bb mb2/ iQ `Bb2 M 2t+2TiBQMX *i+?BM; QM2 Bb /QM2 #v
r`TTBM;  TB2+2 Q7 +Q/2 BM  try #HQ+F- 7QHHQr2/ #v i?2 F2vrQ`/ catchX
q?2M i?2 +Q/2 BM i?2 try #HQ+F +mb2b M 2t+2TiBQM iQ #2 `Bb2/- i?2
catch #HQ+F Bb 2pHmi2/X h?2 p`B#H2 MK2 UBM T`2Mi?2b2bV 7i2` catch
rBHH #2 #QmM/ iQ i?2 2t+2TiBQM pHm2X 7i2` i?2 catch #HQ+F }MBb?2běQ`
B7 i?2 try #HQ+F }MBb?2b rBi?Qmi T`Q#H2Kbě+QMi`QH T`Q+22/b #2M2i? i?2
2MiB`2 try/catch bii2K2MiX
AM i?Bb +b2- r2 mb2/ i?2 Error +QMbi`m+iQ` iQ +`2i2 Qm` 2t+2TiBQM
pHm2X h?Bb Bb  biM/`/ Cpa+`BTi +QMbi`m+iQ` i?i +`2i2b M Q#D2+i
rBi?  message T`QT2`ivX AM KQ/2`M Cpa+`BTi 2MpB`QMK2Mib- BMbiM+2b Q7
i?Bb +QMbi`m+iQ` HbQ ;i?2` BM7Q`KiBQM #Qmi i?2 +HH bi+F i?i 2tBbi2/
r?2M i?2 2t+2TiBQM rb +`2i2/-  bQ@+HH2/ bi+F i`+2X h?Bb BM7Q`KiBQM
Bb biQ`2/ BM i?2 stack T`QT2`iv M/ +M #2 ?2HT7mH r?2M i`vBM; iQ /2#m;
 T`Q#H2K, Bi i2HHb mb i?2 T`2+Bb2 7mM+iBQM r?2`2 i?2 T`Q#H2K Q++m``2/
M/ r?B+? Qi?2` 7mM+iBQMb H2/ mT iQ i?2 +HH i?i 7BH2/X
LQi2 i?i i?2 7mM+iBQM look +QKTH2i2Hv B;MQ`2b i?2 TQbbB#BHBiv i?i
promptDirection KB;?i ;Q r`QM;X h?Bb Bb i?2 #B; /pMi;2 Q7 2t+2TiBQMbě
2``Q`@?M/HBM; +Q/2 Bb M2+2bb`v QMHv i i?2 TQBMi r?2`2 i?2 2``Q` Q++m`b
M/ i i?2 TQBMi r?2`2 Bi Bb ?M/H2/X h?2 7mM+iBQMb BM #2ir22M +M 7Q`;2i
HH #Qmi BiX
q2HH- HKQbiĘ

*H2MBM; mT 7i2` 2t+2TiBQMb


*QMbB/2` i?2 7QHHQrBM; bBimiBQM,  7mM+iBQM- withContext- rMib iQ KF2
bm`2 i?i- /m`BM; Bib 2t2+miBQM- i?2 iQT@H2p2H p`B#H2 context ?QH/b 
bT2+B}+ +QMi2ti pHm2X 7i2` Bi }MBb?2b- Bi `2biQ`2b i?Bb p`B#H2 iQ Bib QH/
pHm2X
var context = null ;

function withContext ( newContext , body ) {


var oldContext = context ;
context = newContext ;
var result = body () ;
context = oldContext ;
return result ;
}

R8d
q?i B7 body `Bb2b M 2t+2TiBQM\ AM i?i +b2- i?2 +HH iQ withContext rBHH
#2 i?`QrM Qz i?2 bi+F #v i?2 2t+2TiBQM- M/ context rBHH M2p2` #2 b2i
#+F iQ Bib QH/ pHm2X
h?2`2 Bb QM2 KQ`2 72im`2 i?i try bii2K2Mib ?p2X h?2v Kv #2
7QHHQr2/ #v  finally #HQ+F 2Bi?2` BMbi2/ Q7 Q` BM //BiBQM iQ  catch
#HQ+FX  finally #HQ+F K2Mb dzLQ Kii2` r?i ?TT2Mb- `mM i?Bb +Q/2
7i2` i`vBM; iQ `mM i?2 +Q/2 BM i?2 try #HQ+FǴX A7  7mM+iBQM ?b iQ +H2M
bQK2i?BM; mT- i?2 +H2MmT +Q/2 b?QmH/ mbmHHv #2 Tmi BMiQ  finally
#HQ+FX
function withContext ( newContext , body ) {
var oldContext = context ;
context = newContext ;
try {
return body () ;
} finally {
context = oldContext ;
}
}

LQi2 i?i r2 MQ HQM;2` ?p2 iQ biQ`2 i?2 `2bmHi Q7 body Ur?B+? r2 rMi
iQ `2im`MV BM  p`B#H2X 1p2M B7 r2 `2im`M /B`2+iHv 7`QK i?2 try #HQ+F-
i?2 finally #HQ+F rBHH #2 `mMX LQr r2 +M /Q i?Bb M/ #2 b72,
try {
withContext (5 , function () {
if ( context < 10)
throw new Error (" Not enough context !") ;
}) ;
} catch (e ) {
console . log (" Ignoring : " + e ) ;
}
// → Ignoring : Error : Not enough context !

console . log ( context ) ;


// → null

1p2M i?Qm;? i?2 7mM+iBQM +HH2/ 7`QK withContext 2tTHQ/2/- withContext


Bib2H7 biBHH T`QT2`Hv +H2M2/ mT i?2 context p`B#H2X

R83
a2H2+iBp2 +i+?BM;
q?2M M 2t+2TiBQM KF2b Bi HH i?2 rv iQ i?2 #QiiQK Q7 i?2 bi+F
rBi?Qmi #2BM; +m;?i- Bi ;2ib ?M/H2/ #v i?2 2MpB`QMK2MiX q?i i?Bb
K2Mb /Bz2`b #2ir22M 2MpB`QMK2MibX AM #`Qrb2`b-  /2b+`BTiBQM Q7 i?2
2``Q` ivTB+HHv ;2ib r`Bii2M iQ i?2 Cpa+`BTi +QMbQH2 U`2+?#H2 i?`Qm;?
i?2 #`Qrb2`Ƕb hQQHb Q` .2p2HQT2` K2MmVX
6Q` T`Q;`KK2` KBbiF2b Q` T`Q#H2Kb i?i i?2 T`Q;`K +MMQi TQbbB@
#Hv ?M/H2- Dmbi H2iiBM; i?2 2``Q` ;Q i?`Qm;? Bb Q7i2M QFvX M mM?M@
/H2/ 2t+2TiBQM Bb  `2bQM#H2 rv iQ bB;MH  #`QF2M T`Q;`K- M/ i?2
Cpa+`BTi +QMbQH2 rBHH- QM KQ/2`M #`Qrb2`b- T`QpB/2 vQm rBi? bQK2 BM@
7Q`KiBQM #Qmi r?B+? 7mM+iBQM +HHb r2`2 QM i?2 bi+F r?2M i?2 T`Q#H2K
Q++m``2/X
6Q` T`Q#H2Kb i?i `2 2tT2+i2/ iQ ?TT2M /m`BM; `QmiBM2 mb2- +`b?BM;
rBi? M mM?M/H2/ 2t+2TiBQM Bb MQi  p2`v 7`B2M/Hv `2bTQMb2X
AMpHB/ mb2b Q7 i?2 HM;m;2- bm+? b `272`2M+BM;  MQM2tBbi2Mi p`B#H2-
HQQFBM; mT  T`QT2`iv QM null- Q` +HHBM; bQK2i?BM; i?iǶb MQi  7mM+iBQM-
rBHH HbQ `2bmHi BM 2t+2TiBQMb #2BM; `Bb2/X am+? 2t+2TiBQMb +M #2 +m;?i
Dmbi HBF2 vQm` QrM 2t+2TiBQMbX
q?2M  catch #Q/v Bb 2Mi2`2/- HH r2 FMQr Bb i?i bQK2i?BM; BM Qm` try
#Q/v +mb2/ M 2t+2TiBQMX "mi r2 /QMǶi FMQr r?i- Q` r?B+? 2t+2TiBQM
Bi +mb2/X
Cpa+`BTi UBM  `i?2` ;H`BM; QKBbbBQMV /Q2bMǶi T`QpB/2 /B`2+i bmTTQ`i
7Q` b2H2+iBp2Hv +i+?BM; 2t+2TiBQMb, 2Bi?2` vQm +i+? i?2K HH Q` vQm /QMǶi
+i+? MvX h?Bb KF2b Bi p2`v 2bv iQ bbmK2 i?i i?2 2t+2TiBQM vQm ;2i
Bb i?2 QM2 vQm r2`2 i?BMFBM; #Qmi r?2M vQm r`Qi2 i?2 catch #HQ+FX
"mi Bi KB;?i MQi #2X aQK2 Qi?2` bbmKTiBQM KB;?i #2 pBQHi2/- Q` vQm
KB;?i ?p2 BMi`Q/m+2/  #m; bQK2r?2`2 i?i Bb +mbBM; M 2t+2TiBQMX
>2`2 Bb M 2tKTH2- r?B+? ii2KTib iQ F22T QM +HHBM; promptDirection
mMiBH Bi ;2ib  pHB/ Mbr2`,
for (;;) {
try {
var dir = promtDirection (" Where ?") ; // ← typo !
console . log (" You chose " , dir );
break ;
} catch ( e ) {
console . log (" Not a valid direction . Try again .") ;

R8N
}
}

h?2 for (;;) +QMbi`m+i Bb  rv iQ BMi2MiBQMHHv +`2i2  HQQT i?i /Q2bMǶi
i2`KBMi2 QM Bib QrMX q2 #`2F Qmi Q7 i?2 HQQT QMHv r?2M  pHB/
/B`2+iBQM Bb ;Bp2MX "mi r2 KBbbT2HH2/ promptDirection- r?B+? rBHH `2bmHi
BM M dzmM/2}M2/ p`B#H2Ǵ 2``Q`X "2+mb2 i?2 catch #HQ+F +QKTH2i2Hv
B;MQ`2b Bib 2t+2TiBQM pHm2 UeV- bbmKBM; Bi FMQrb r?i i?2 T`Q#H2K Bb-
Bi r`QM;Hv i`2ib i?2 p`B#H2 2``Q` b BM/B+iBM; #/ BMTmiX LQi QMHv
/Q2b i?Bb +mb2 M BM}MBi2 HQQT- #mi Bi HbQ dz#m`B2bǴ i?2 mb27mH 2``Q`
K2bb;2 #Qmi i?2 KBbbT2HH2/ p`B#H2X
b  ;2M2`H `mH2- /QMǶi #HMF2i@+i+? 2t+2TiBQMb mMH2bb Bi Bb 7Q` i?2
Tm`TQb2 Q7 dz`QmiBM;Ǵ i?2K bQK2r?2`2ě7Q` 2tKTH2- Qp2` i?2 M2irQ`F
iQ i2HH MQi?2` bvbi2K i?i Qm` T`Q;`K +`b?2/X M/ 2p2M i?2M- i?BMF
+`27mHHv #Qmi ?Qr vQm KB;?i #2 ?B/BM; BM7Q`KiBQMX
aQ r2 rMi iQ +i+?  bT2+B}+ FBM/ Q7 2t+2TiBQMX q2 +M /Q i?Bb #v
+?2+FBM; BM i?2 catch #HQ+F r?2i?2` i?2 2t+2TiBQM r2 ;Qi Bb i?2 QM2 r2 `2
BMi2`2bi2/ BM M/ #v `2i?`QrBM; Bi Qi?2`rBb2X "mi ?Qr /Q r2 `2+Q;MBx2
M 2t+2TiBQM\
P7 +Qm`b2- r2 +QmH/ Ki+? Bib message T`QT2`iv ;BMbi i?2 2``Q` K2b@
b;2 r2 ?TT2M iQ 2tT2+iX "mi i?iǶb  b?Fv rv iQ r`Bi2 +Q/2ěr2Ƕ/
#2 mbBM; BM7Q`KiBQM i?iǶb BMi2M/2/ 7Q` ?mKM +QMbmKTiBQM Ui?2 K2b@
b;2V iQ KF2  T`Q;`KKiB+ /2+BbBQMX b bQQM b bQK2QM2 +?M;2b UQ`
i`MbHi2bV i?2 K2bb;2- i?2 +Q/2 rBHH biQT rQ`FBM;X
_i?2`- H2iǶb /2}M2  M2r ivT2 Q7 2``Q` M/ mb2 instanceof iQ B/2MiB7v
BiX
function InputError ( message ) {
this . message = message ;
this . stack = ( new Error () ) . stack ;
}
InputError . prototype = Object . create ( Error . prototype ) ;
InputError . prototype . name = " InputError ";

h?2 T`QiQivT2 Bb K/2 iQ /2`Bp2 7`QK Error.prototype bQ i?i instanceof


Error rBHH HbQ `2im`M i`m2 7Q` InputError Q#D2+ibX AiǶb HbQ ;Bp2M  name
T`QT2`iv bBM+2 i?2 biM/`/ 2``Q` ivT2b UError- SyntaxError- ReferenceError-
M/ bQ QMV HbQ ?p2 bm+?  T`QT2`ivX
h?2 bbB;MK2Mi iQ i?2 stack T`QT2`iv i`B2b iQ ;Bp2 i?Bb Q#D2+i  bQK2@

Rey
r?i mb27mH bi+F i`+2- QM THi7Q`Kb i?i bmTTQ`i Bi- #v +`2iBM; 
`2;mH` 2``Q` Q#D2+i M/ i?2M mbBM; i?i Q#D2+iǶb stack T`QT2`iv b Bib
QrMX
LQr promptDirection +M i?`Qr bm+? M 2``Q`X
function promptDirection ( question ) {
var result = prompt ( question , "") ;
if ( result . toLowerCase () == " left ") return " L ";
if ( result . toLowerCase () == " right ") return " R ";
throw new InputError (" Invalid direction : " + result );
}

M/ i?2 HQQT +M +i+? Bi KQ`2 +`27mHHvX


for (;;) {
try {
var dir = promptDirection (" Where ?") ;
console . log (" You chose " , dir );
break ;
} catch ( e ) {
if ( e instanceof InputError )
console . log (" Not a valid direction . Try again .") ;
else
throw e ;
}
}

h?Bb rBHH +i+? QMHv BMbiM+2b Q7 InputError M/ H2i mM`2Hi2/ 2t+2TiBQMb
i?`Qm;?X A7 vQm `2BMi`Q/m+2 i?2 ivTQ- i?2 mM/2}M2/ p`B#H2 2``Q` rBHH
#2 T`QT2`Hv `2TQ`i2/X

bb2`iBQMb
bb2`iBQMb `2  iQQH iQ /Q #bB+ bMBiv +?2+FBM; 7Q` T`Q;`KK2` 2``Q`bX
*QMbB/2` i?Bb ?2HT2` 7mM+iBQM- assert,
function AssertionFailed ( message ) {
this . message = message ;
}
AssertionFailed . prototype = Object . create ( Error . prototype );

ReR
function assert ( test , message ) {
if (! test )
throw new AssertionFailed ( message );
}

function lastElement ( array ) {


assert ( array . length > 0 , " empty array in lastElement ") ;
return array [ array . length - 1];
}

h?Bb T`QpB/2b  +QKT+i rv iQ 2M7Q`+2 2tT2+iiBQMb- ?2HT7mHHv #HQrBM;


mT i?2 T`Q;`K B7 i?2 bii2/ +QM/BiBQM /Q2b MQi ?QH/X 6Q` BMbiM+2- i?2
lastElement 7mM+iBQM- r?B+? 72i+?2b i?2 Hbi 2H2K2Mi 7`QK M ``v- rQmH/
`2im`M undefined QM 2KTiv ``vb B7 i?2 bb2`iBQM rb QKBii2/X 62i+?BM;
i?2 Hbi 2H2K2Mi 7`QK M 2KTiv ``v /Q2b MQi KF2 Km+? b2Mb2- bQ Bi
Bb HKQbi +2`iBMHv  T`Q;`KK2` 2``Q` iQ /Q bQX
bb2`iBQMb `2  rv iQ KF2 bm`2 KBbiF2b +mb2 7BHm`2b i i?2 TQBMi
Q7 i?2 KBbiF2- `i?2` i?M bBH2MiHv T`Q/m+BM; MQMb2Mb2 pHm2b i?i Kv
;Q QM iQ +mb2 i`Qm#H2 BM M mM`2Hi2/ T`i Q7 i?2 bvbi2KX

amKK`v
JBbiF2b M/ #/ BMTmi `2 7+ib Q7 HB72X "m;b BM T`Q;`Kb M22/ iQ #2
7QmM/ M/ }t2/X h?2v +M #2+QK2 2bB2` iQ MQiB+2 #v ?pBM; miQKi2/
i2bi bmBi2b M/ //BM; bb2`iBQMb iQ vQm` T`Q;`KbX
S`Q#H2Kb +mb2/ #v 7+iQ`b QmibB/2 i?2 T`Q;`KǶb +QMi`QH b?QmH/ mbm@
HHv #2 ?M/H2/ ;`+27mHHvX aQK2iBK2b- r?2M i?2 T`Q#H2K +M #2 ?M/H2/
HQ+HHv- bT2+BH `2im`M pHm2b `2  bM2 rv iQ i`+F i?2KX Pi?2`rBb2-
2t+2TiBQMb `2 T`272`#H2X
h?`QrBM; M 2t+2TiBQM +mb2b i?2 +HH bi+F iQ #2 mMrQmM/ mMiBH i?2
M2ti 2M+HQbBM; try/catch #HQ+F Q` mMiBH i?2 #QiiQK Q7 i?2 bi+FX h?2
2t+2TiBQM pHm2 rBHH #2 ;Bp2M iQ i?2 catch #HQ+F i?i +i+?2b Bi- r?B+?
b?QmH/ p2`B7v i?i Bi Bb +imHHv i?2 2tT2+i2/ FBM/ Q7 2t+2TiBQM M/ i?2M
/Q bQK2i?BM; rBi? BiX hQ /2H rBi? i?2 mMT`2/B+i#H2 +QMi`QH ~Qr +mb2/
#v 2t+2TiBQMb- finally #HQ+Fb +M #2 mb2/ iQ 2Mbm`2  TB2+2 Q7 +Q/2 Bb
Hrvb `mM r?2M  #HQ+F }MBb?2bX

Rek
1t2`+Bb2b
_2i`v
av vQm ?p2  7mM+iBQM primitiveMultiply i?i- BM 8y T2`+2Mi Q7 +b2b-
KmHiBTHB2b irQ MmK#2`b- M/ BM i?2 Qi?2` 8y T2`+2Mi- `Bb2b M 2t+2TiBQM
Q7 ivT2 MultiplicatorUnitFailureX q`Bi2  7mM+iBQM i?i r`Tb i?Bb +HmMFv
7mM+iBQM M/ Dmbi F22Tb i`vBM; mMiBH  +HH bm++22/b- 7i2` r?B+? Bi `2im`Mb
i?2 `2bmHiX
JF2 bm`2 vQm ?M/H2 QMHv i?2 2t+2TiBQMb vQm `2 i`vBM; iQ ?M/H2X

h?2 HQ+F2/ #Qt


*QMbB/2` i?2 7QHHQrBM; U`i?2` +QMi`Bp2/V Q#D2+i,
var box = {
locked : true ,
unlock : function () { this . locked = false ; } ,
lock : function () { this . locked = true ; } ,
_content : [] ,
get content () {
if ( this . locked ) throw new Error (" Locked !") ;
return this . _content ;
}
};

Ai Bb  #Qt rBi?  HQ+FX AMbB/2 Bb M ``v- #mi vQm +M ;2i i Bi QMHv
r?2M i?2 #Qt Bb mMHQ+F2/X .B`2+iHv ++2bbBM; i?2 _content T`QT2`iv Bb MQi
HHQr2/X
q`Bi2  7mM+iBQM +HH2/ withBoxUnlocked i?i iF2b  7mM+iBQM pHm2 b
`;mK2Mi- mMHQ+Fb i?2 #Qt- `mMb i?2 7mM+iBQM- M/ i?2M 2Mbm`2b i?i i?2
#Qt Bb HQ+F2/ ;BM #27Q`2 `2im`MBM;- `2;`/H2bb Q7 r?2i?2` i?2 `;mK2Mi
7mM+iBQM `2im`M2/ MQ`KHHv Q` i?`2r M 2t+2TiBQMX

Rej
dzaQK2 T2QTH2- r?2M +QM7`QMi2/ rBi?  T`Q#H2K- i?BMF ǵA FMQr-
AǶHH mb2 `2;mH` 2tT`2bbBQMbXǶ LQr i?2v ?p2 irQ T`Q#H2KbXǴ
ěCKB2 wrBMbFB

N _2;mH` 1tT`2bbBQMb
S`Q;`KKBM; iQQHb M/ i2+?MB[m2b bm`pBp2 M/ bT`2/ BM  +?QiB+- 2pQ@
HmiBQM`v rvX AiǶb MQi Hrvb i?2 T`2iiv Q` #`BHHBMi QM2b i?i rBM #mi
`i?2` i?2 QM2b i?i 7mM+iBQM r2HH 2MQm;? rBi?BM i?2 `B;?i MB+?2ě7Q` 2t@
KTH2- #v #2BM; BMi2;`i2/ rBi? MQi?2` bm++2bb7mH TB2+2 Q7 i2+?MQHQ;vX
AM i?Bb +?Ti2`- A rBHH /Bb+mbb QM2 bm+? iQQH- `2;mH` 2tT`2bbBQMbX _2;m@
H` 2tT`2bbBQMb `2  rv iQ /2b+`B#2 Tii2`Mb BM bi`BM; /iX h?2v 7Q`K
 bKHH- b2T`i2 HM;m;2 i?i Bb T`i Q7 Cpa+`BTi M/ KMv Qi?2`
HM;m;2b M/ iQQHbX
_2;mH` 2tT`2bbBQMb `2 #Qi? i2``B#Hv rFr`/ M/ 2ti`2K2Hv mb27mHX
h?2B` bvMit Bb +`vTiB+- M/ i?2 T`Q;`KKBM; BMi2`7+2 Cpa+`BTi T`Q@
pB/2b 7Q` i?2K Bb +HmKbvX "mi i?2v `2  TQr2`7mH iQQH 7Q` BMbT2+iBM;
M/ T`Q+2bbBM; bi`BM;bX S`QT2`Hv mM/2`biM/BM; `2;mH` 2tT`2bbBQMb rBHH
KF2 vQm  KQ`2 2z2+iBp2 T`Q;`KK2`X

*`2iBM;  `2;mH` 2tT`2bbBQM


 `2;mH` 2tT`2bbBQM Bb  ivT2 Q7 Q#D2+iX Ai +M 2Bi?2` #2 +QMbi`m+i2/
rBi? i?2 RegExp +QMbi`m+iQ` Q` r`Bii2M b  HBi2`H pHm2 #v 2M+HQbBM; i?2
Tii2`M BM 7Q`r`/ bHb? U/V +?`+i2`bX
var re1 = new RegExp (" abc ") ;
var re2 = / abc /;

"Qi? Q7 i?2b2 `2;mH` 2tT`2bbBQM Q#D2+ib `2T`2b2Mi i?2 bK2 Tii2`M, M


 +?`+i2` 7QHHQr2/ #v  # 7QHHQr2/ #v  +X
q?2M mbBM; i?2 RegExp +QMbi`m+iQ`- i?2 Tii2`M Bb r`Bii2M b  MQ`KH
bi`BM;- bQ i?2 mbmH `mH2b TTHv 7Q` #+FbHb?2bX
h?2 b2+QM/ MQiiBQM- r?2`2 i?2 Tii2`M TT2`b #2ir22M bHb? +?`@
+i2`b- i`2ib #+FbHb?2b bQK2r?i /Bz2`2MiHvX 6B`bi- bBM+2  7Q`r`/
bHb? 2M/b i?2 Tii2`M- r2 M22/ iQ Tmi  #+FbHb? #27Q`2 Mv 7Q`r`/

Re9
bHb? i?i r2 rMi iQ #2 T`i Q7 i?2 Tii2`MX AM //BiBQM- #+FbHb?2b
i?i `2MǶi T`i Q7 bT2+BH +?`+i2` +Q/2b UHBF2 \nV rBHH #2 T`2b2`p2/-
`i?2` i?M B;MQ`2/ b i?2v `2 BM bi`BM;b- M/ +?M;2 i?2 K2MBM; Q7
i?2 Tii2`MX aQK2 +?`+i2`b- bm+? b [m2biBQM K`Fb M/ THmb bB;Mb-
?p2 bT2+BH K2MBM;b BM `2;mH` 2tT`2bbBQMb M/ Kmbi #2 T`2+2/2/ #v 
#+FbHb? B7 i?2v `2 K2Mi iQ `2T`2b2Mi i?2 +?`+i2` Bib2H7X
var eighteenPlus = / eighteen \+/;

EMQrBM; T`2+Bb2Hv r?i +?`+i2`b iQ #+FbHb?@2b+T2 r?2M r`BiBM;


`2;mH` 2tT`2bbBQMb `2[mB`2b vQm iQ FMQr 2p2`v +?`+i2` rBi?  bT2@
+BH K2MBM;X 6Q` i?2 iBK2 #2BM;- i?Bb Kv MQi #2 `2HBbiB+- bQ r?2M
BM /Qm#i- Dmbi Tmi  #+FbHb? #27Q`2 Mv +?`+i2` i?i Bb MQi  H2ii2`-
MmK#2`- Q` r?Bi2bT+2X

h2biBM; 7Q` Ki+?2b


_2;mH` 2tT`2bbBQM Q#D2+ib ?p2  MmK#2` Q7 K2i?Q/bX h?2 bBKTH2bi QM2
Bb testX A7 vQm Tbb Bi  bi`BM;- Bi rBHH `2im`M  "QQH2M i2HHBM; vQm r?2i?2`
i?2 bi`BM; +QMiBMb  Ki+? Q7 i?2 Tii2`M BM i?2 2tT`2bbBQMX
console . log (/ abc /. test (" abcde ") ) ;
// → true
console . log (/ abc /. test (" abxde ") ) ;
// → false

 `2;mH` 2tT`2bbBQM +QMbBbiBM; Q7 QMHv MQMbT2+BH +?`+i2`b bBKTHv `2T@


`2b2Mib i?i b2[m2M+2 Q7 +?`+i2`bX A7 #+ Q++m`b Mvr?2`2 BM i?2 bi`BM;
r2 `2 i2biBM; ;BMbi UMQi Dmbi i i?2 bi`iV- test rBHH `2im`M trueX

Ji+?BM;  b2i Q7 +?`+i2`b


6BM/BM; Qmi r?2i?2`  bi`BM; +QMiBMb #+ +QmH/ Dmbi b r2HH #2 /QM2
rBi?  +HH iQ indexOfX _2;mH` 2tT`2bbBQMb HHQr mb iQ ;Q #2vQM/ i?i
M/ 2tT`2bb KQ`2 +QKTHB+i2/ Tii2`MbX
av r2 rMi iQ Ki+? Mv MmK#2`X AM  `2;mH` 2tT`2bbBQM- TmiiBM; 
b2i Q7 +?`+i2`b #2ir22M b[m`2 #`+F2ib KF2b i?i T`i Q7 i?2 2tT`2b@
bBQM Ki+? Mv Q7 i?2 +?`+i2`b #2ir22M i?2 #`+F2ibX

Re8
"Qi? Q7 i?2 7QHHQrBM; 2tT`2bbBQMb Ki+? HH bi`BM;b i?i +QMiBM  /B;Bi,
console . log (/[0123456789]/. test (" in 1992") ) ;
// → true
console . log (/[0 -9]/. test (" in 1992") );
// → true

qBi?BM b[m`2 #`+F2ib-  /b? U-V #2ir22M irQ +?`+i2`b +M #2 mb2/
iQ BM/B+i2  `M;2 Q7 +?`+i2`b- r?2`2 i?2 Q`/2`BM; Bb /2i2`KBM2/ #v
i?2 +?`+i2`Ƕb lMB+Q/2 MmK#2`X *?`+i2`b y iQ N bBi `B;?i M2ti iQ 2+?
Qi?2` BM i?Bb Q`/2`BM; U+Q/2b 93 iQ 8dV- bQ [0-9] +Qp2`b HH Q7 i?2K M/
Ki+?2b Mv /B;BiX
h?2`2 `2  MmK#2` Q7 +QKKQM +?`+i2` ;`QmTb i?i ?p2 i?2B` QrM
#mBHi@BM b?Q`i+mibX .B;Bib `2 QM2 Q7 i?2K, \d K2Mb i?2 bK2 i?BM; b
[0-9]X
\d Mv /B;Bi +?`+i2`
\w M HT?MmK2`B+ +?`+i2` UdzrQ`/ +?`+i2`ǴV
\s Mv r?Bi2bT+2 +?`+i2` UbT+2- i#- M2rHBM2- M/ bBKBH`V
\D  +?`+i2` i?i Bb MQi  /B;Bi
\W  MQMHT?MmK2`B+ +?`+i2`
\S  MQMr?Bi2bT+2 +?`+i2`
. Mv +?`+i2` 2t+2Ti 7Q` M2rHBM2
aQ vQm +QmH/ Ki+?  /i2 M/ iBK2 7Q`Ki HBF2 jy@yR@kyyj R8,ky rBi?
i?2 7QHHQrBM; 2tT`2bbBQM,
var dateTime = /\ d \d -\ d \d -\ d \ d\d \ d \ d\d :\ d\d /;
console . log ( dateTime . test ("30 -01 -2003 15:20") ) ;
// → true
console . log ( dateTime . test ("30 - jan -2003 15:20") ) ;
// → false

h?i HQQFb +QKTH2i2Hv r7mH- /Q2bMǶi Bi\ Ai ?b rv iQQ KMv #+F@
bHb?2b- T`Q/m+BM; #+F;`QmM/ MQBb2 i?i KF2b Bi ?`/ iQ bTQi i?2 +@
imH Tii2`M 2tT`2bb2/X q2ǶHH b22  bHB;?iHv BKT`Qp2/ p2`bBQM Q7 i?Bb
2tT`2bbBQM Hi2`X
h?2b2 #+FbHb? +Q/2b +M HbQ #2 mb2/ BMbB/2 b[m`2 #`+F2ibX 6Q`
2tKTH2- [\d.] K2Mb Mv /B;Bi Q`  T2`BQ/ +?`+i2`X "mi MQi2 i?i
i?2 T2`BQ/ Bib2H7- r?2M mb2/ #2ir22M b[m`2 #`+F2ib- HQb2b Bib bT2+BH
K2MBM;X h?2 bK2 ;Q2b 7Q` Qi?2` bT2+BH +?`+i2`b- bm+? b +X
hQ BMp2`i  b2i Q7 +?`+i2`běi?i Bb- iQ 2tT`2bb i?i vQm rMi iQ

Ree
Ki+? Mv +?`+i2` 2t+2Ti i?2 QM2b BM i?2 b2iěvQm +M r`Bi2  +`2i
U^V +?`+i2` 7i2` i?2 QT2MBM; #`+F2iX
var notBinary = /[^01]/;
console . log ( notBinary . test ("1100100010100110") ) ;
// → false
console . log ( notBinary . test ("1100100010200110") ) ;
// → true

_2T2iBM; T`ib Q7  Tii2`M


q2 MQr FMQr ?Qr iQ Ki+?  bBM;H2 /B;BiX q?i B7 r2 rMi iQ Ki+? 
r?QH2 MmK#2`ě b2[m2M+2 Q7 QM2 Q` KQ`2 /B;Bib\
q?2M vQm Tmi  THmb bB;M U+V 7i2` bQK2i?BM; BM  `2;mH` 2tT`2bbBQM-
Bi BM/B+i2b i?i i?2 2H2K2Mi Kv #2 `2T2i2/ KQ`2 i?M QM+2X h?mb-
/\d+/ Ki+?2b QM2 Q` KQ`2 /B;Bi +?`+i2`bX

console . log (/ \ d + /. test ( " 1 2 3 " ) ) ;


// → true
console . log (/ \ d + /. test ( " " ) );
// → false
console . log (/ \ d * /. test ( " 1 2 3 " ) ) ;
// → true
console . log (/ \ d * /. test ( " " ) );
// → true

h?2 bi` U*V ?b  bBKBH` K2MBM; #mi HbQ HHQrb i?2 Tii2`M iQ Ki+?
x2`Q iBK2bX aQK2i?BM; rBi?  bi` 7i2` Bi M2p2` T`2p2Mib  Tii2`M 7`QK
Ki+?BM;ěBiǶHH Dmbi Ki+? x2`Q BMbiM+2b B7 Bi +MǶi }M/ Mv bmBi#H2 i2ti
iQ Ki+?X
 [m2biBQM K`F KF2b  T`i Q7  Tii2`M dzQTiBQMHǴ- K2MBM; Bi Kv
Q++m` x2`Q Q` QM2 iBK2X AM i?2 7QHHQrBM; 2tKTH2- i?2 m +?`+i2` Bb
HHQr2/ iQ Q++m`- #mi i?2 Tii2`M HbQ Ki+?2b r?2M Bi Bb KBbbBM;X
var neighbor = / neighbou ?r /;
console . log ( neighbor . test (" neighbour ") ) ;
// → true
console . log ( neighbor . test (" neighbor ") ) ;
// → true

Red
hQ BM/B+i2 i?i  Tii2`M b?QmH/ Q++m`  T`2+Bb2 MmK#2` Q7 iBK2b- mb2
+m`Hv #`+2bX SmiiBM; {4} 7i2` M 2H2K2Mi- 7Q` 2tKTH2- `2[mB`2b Bi iQ
Q++m` 2t+iHv 7Qm` iBK2bX Ai Bb HbQ TQbbB#H2 iQ bT2+B7v  `M;2 i?Bb rv,
{2,4} K2Mb i?2 2H2K2Mi Kmbi Q++m` i H2bi irB+2 M/ i KQbi 7Qm` iBK2bX
>2`2 Bb MQi?2` p2`bBQM Q7 i?2 /i2 M/ iBK2 Tii2`M i?i HHQrb #Qi?
bBM;H2@ M/ /Qm#H2@/B;Bi /vb- KQMi?b- M/ ?Qm`bX Ai Bb HbQ bHB;?iHv KQ`2
`2/#H2X
var dateTime = /\ d {1 ,2} -\ d {1 ,2} -\ d {4} \d {1 ,2}:\ d {2}/;
console . log ( dateTime . test ("30 -1 -2003 8:45") ) ;
// → true

uQm +M HbQ bT2+B7v QT2M@2M/2/ `M;2b r?2M mbBM; +m`Hv #`+2b #v QKBi@
iBM; i?2 MmK#2` 7i2` i?2 +QKKX aQ {5,} K2Mb }p2 Q` KQ`2 iBK2bX

:`QmTBM; bm#2tT`2bbBQMb
hQ mb2 M QT2`iQ` HBF2 * Q` + QM KQ`2 i?M QM2 2H2K2Mi i  iBK2- vQm
+M mb2 T`2Mi?2b2bX  T`i Q7  `2;mH` 2tT`2bbBQM i?i Bb 2M+HQb2/ BM
T`2Mi?2b2b +QmMib b  bBM;H2 2H2K2Mi b 7` b i?2 QT2`iQ`b 7QHHQrBM;
Bi `2 +QM+2`M2/X
var cartoonCrying = / boo +( hoo +) +/ i ;
console . log ( cartoonCrying . test (" Boohoooohoohooo ") ) ;
// → true

h?2 }`bi M/ b2+QM/ + +?`+i2`b TTHv QMHv iQ i?2 b2+QM/ Q BM #QQ M/
?QQ- `2bT2+iBp2HvX h?2 i?B`/ + TTHB2b iQ i?2 r?QH2 ;`QmT (hoo+)- Ki+?BM;
QM2 Q` KQ`2 b2[m2M+2b HBF2 i?iX
h?2 i i i?2 2M/ Q7 i?2 2tT`2bbBQM BM i?2 T`2pBQmb 2tKTH2 KF2b i?Bb
`2;mH` 2tT`2bbBQM +b2 BMb2MbBiBp2- HHQrBM; Bi iQ Ki+? i?2 mTT2`+b2 "
BM i?2 BMTmi bi`BM;- 2p2M i?Qm;? i?2 Tii2`M Bb Bib2H7 HH HQr2`+b2X

Ji+?2b M/ ;`QmTb


h?2 test K2i?Q/ Bb i?2 #bQHmi2 bBKTH2bi rv iQ Ki+?  `2;mH` 2tT`2b@
bBQMX Ai i2HHb vQm QMHv r?2i?2` Bi Ki+?2/ M/ MQi?BM; 2Hb2X _2;mH`
2tT`2bbBQMb HbQ ?p2 M exec U2t2+mi2V K2i?Q/ i?i rBHH `2im`M null B7

Re3
MQ Ki+? rb 7QmM/ M/ `2im`M M Q#D2+i rBi? BM7Q`KiBQM #Qmi i?2
Ki+? Qi?2`rBb2X
var match = /\ d +/. exec (" one two 100") ;
console . log ( match ) ;
// → ["100"]
console . log ( match . index );
// → 8

M Q#D2+i `2im`M2/ 7`QK exec ?b M index T`QT2`iv i?i i2HHb mb r?2`2
BM i?2 bi`BM; i?2 bm++2bb7mH Ki+? #2;BMbX Pi?2` i?M i?i- i?2 Q#D2+i
HQQFb HBF2 UM/ BM 7+i BbV M ``v Q7 bi`BM;b- r?Qb2 }`bi 2H2K2Mi Bb i?2
bi`BM; i?i rb Ki+?2/ěBM i?2 T`2pBQmb 2tKTH2- i?Bb Bb i?2 b2[m2M+2
Q7 /B;Bib i?i r2 r2`2 HQQFBM; 7Q`X
ai`BM; pHm2b ?p2  match K2i?Q/ i?i #2?p2b bBKBH`HvX
console . log (" one two 100". match (/\ d +/) ) ;
// → ["100"]

q?2M i?2 `2;mH` 2tT`2bbBQM +QMiBMb bm#2tT`2bbBQMb ;`QmT2/ rBi? T`2M@


i?2b2b- i?2 i2ti i?i Ki+?2/ i?Qb2 ;`QmTb rBHH HbQ b?Qr mT BM i?2 ``vX
h?2 r?QH2 Ki+? Bb Hrvb i?2 }`bi 2H2K2MiX h?2 M2ti 2H2K2Mi Bb i?2 T`i
Ki+?2/ #v i?2 }`bi ;`QmT Ui?2 QM2 r?Qb2 QT2MBM; T`2Mi?2bBb +QK2b
}`bi BM i?2 2tT`2bbBQMV- i?2M i?2 b2+QM/ ;`QmT- M/ bQ QMX
var quotedText = / ( [ ^ ] * ) /;
console . log ( quotedText . exec (" she said hello " ) ) ;
// → [" hello " , " hello "]

q?2M  ;`QmT /Q2b MQi 2M/ mT #2BM; Ki+?2/ i HH U7Q` 2tKTH2- r?2M
7QHHQr2/ #v  [m2biBQM K`FV- Bib TQbBiBQM BM i?2 QmiTmi ``v rBHH ?QH/
undefinedX aBKBH`Hv- r?2M  ;`QmT Bb Ki+?2/ KmHiBTH2 iBK2b- QMHv i?2
Hbi Ki+? 2M/b mT BM i?2 ``vX
console . log (/ bad ( ly ) ?/. exec (" bad ") ) ;
// → [" bad " , undefined ]
console . log (/(\ d ) +/. exec ("123") ) ;
// → ["123" , "3"]

:`QmTb +M #2 mb27mH 7Q` 2ti`+iBM; T`ib Q7  bi`BM;X A7 r2 /QMǶi Dmbi


rMi iQ p2`B7v r?2i?2`  bi`BM; +QMiBMb  /i2 #mi HbQ 2ti`+i Bi M/
+QMbi`m+i M Q#D2+i i?i `2T`2b2Mib Bi- r2 +M r`T T`2Mi?2b2b `QmM/

ReN
i?2 /B;Bi Tii2`Mb M/ /B`2+iHv TB+F i?2 /i2 Qmi Q7 i?2 `2bmHi Q7 execX
"mi }`bi-  #`B27 /2iQm`- BM r?B+? r2 /Bb+mbb i?2 T`272``2/ rv iQ biQ`2
/i2 M/ iBK2 pHm2b BM Cpa+`BTiX

h?2 /i2 ivT2


Cpa+`BTi ?b  biM/`/ Q#D2+i ivT2 7Q` `2T`2b2MiBM; /i2běQ` `i?2`-
TQBMib BM iBK2X Ai Bb +HH2/ DateX A7 vQm bBKTHv +`2i2  /i2 Q#D2+i mbBM;
new- vQm ;2i i?2 +m``2Mi /i2 M/ iBK2X

console . log ( new Date () ) ;


// → Wed Dec 04 2013 14:24:57 GMT +0100 ( CET )

uQm +M HbQ +`2i2 M Q#D2+i 7Q`  bT2+B}+ iBK2X


console . log ( new Date (2009 , 11 , 9) ) ;
// → Wed Dec 09 2009 00:00:00 GMT +0100 ( CET )
console . log ( new Date (2009 , 11 , 9 , 12 , 59 , 59 , 999) ) ;
// → Wed Dec 09 2009 12:59:59 GMT +0100 ( CET )

Cpa+`BTi mb2b  +QMp2MiBQM r?2`2 KQMi? MmK#2`b bi`i i x2`Q UbQ


.2+2K#2` Bb RRV- v2i /v MmK#2`b bi`i i QM2X h?Bb Bb +QM7mbBM; M/
bBHHvX "2 +`27mHX
h?2 Hbi 7Qm` `;mK2Mib U?Qm`b- KBMmi2b- b2+QM/b- M/ KBHHBb2+QM/bV
`2 QTiBQMH M/ iF2M iQ #2 x2`Q r?2M MQi ;Bp2MX
hBK2biKTb `2 biQ`2/ b i?2 MmK#2` Q7 KBHHBb2+QM/b bBM+2 i?2 bi`i
Q7 RNdy- mbBM; M2;iBp2 MmK#2`b 7Q` iBK2b #27Q`2 RNdy U7QHHQrBM;  +QM@
p2MiBQM b2i #v dzlMBt iBK2Ǵ- r?B+? rb BMp2Mi2/ `QmM/ i?i iBK2VX h?2
getTime K2i?Q/ QM  /i2 Q#D2+i `2im`Mb i?Bb MmK#2`X Ai Bb #B;- b vQm
+M BK;BM2X
console . log ( new Date (2013 , 11 , 19) . getTime () ) ;
// → 1387407600000
console . log ( new Date (1387407600000) ) ;
// → Thu Dec 19 2013 00:00:00 GMT +0100 ( CET )

A7 vQm ;Bp2 i?2 Date +QMbi`m+iQ`  bBM;H2 `;mK2Mi- i?i `;mK2Mi Bb


i`2i2/ b bm+?  KBHHBb2+QM/ +QmMiX uQm +M ;2i i?2 +m``2Mi KBHHBb2+QM/
+QmMi #v +`2iBM;  M2r Date Q#D2+i M/ +HHBM; getTime QM Bi #mi HbQ #v
+HHBM; i?2 Date.now 7mM+iBQMX

Rdy
.i2 Q#D2+ib T`QpB/2 K2i?Q/b HBF2 getFullYear- getMonth- getDate- getHours
- getMinutes- M/ getSeconds iQ 2ti`+i i?2B` +QKTQM2MibX h?2`2Ƕb HbQ
getYear- r?B+? ;Bp2b vQm  `i?2` mb2H2bb irQ@/B;Bi v2` pHm2 Ubm+? b 93
Q` 14VX
SmiiBM; T`2Mi?2b2b `QmM/ i?2 T`ib Q7 i?2 2tT`2bbBQM i?i r2 `2
BMi2`2bi2/ BM- r2 +M MQr 2bBHv +`2i2  /i2 Q#D2+i 7`QK  bi`BM;X
function findDate ( string ) {
var dateTime = /(\ d {1 ,2}) -(\ d {1 ,2}) -(\ d {4}) /;
var match = dateTime . exec ( string ) ;
return new Date ( Number ( match [3]) ,
Number ( match [2]) - 1 ,
Number ( match [1]) );
}
console . log ( findDate ("30 -1 -2003") );
// → Thu Jan 30 2003 00:00:00 GMT +0100 ( CET )

qQ`/ M/ bi`BM; #QmM/`B2b


lM7Q`imMi2Hv- findDate rBHH HbQ ?TTBHv 2ti`+i i?2 MQMb2MbB+H /i2 yy@
R@jyyy 7`QK i?2 bi`BM; "100-1-30000"X  Ki+? Kv ?TT2M Mvr?2`2 BM
i?2 bi`BM;- bQ BM i?Bb +b2- BiǶHH Dmbi bi`i i i?2 b2+QM/ +?`+i2` M/ 2M/
i i?2 b2+QM/@iQ@Hbi +?`+i2`X
A7 r2 rMi iQ 2M7Q`+2 i?i i?2 Ki+? Kmbi bTM i?2 r?QH2 bi`BM;- r2
+M // i?2 K`F2`b ^ M/ $X h?2 +`2i Ki+?2b i?2 bi`i Q7 i?2 BMTmi
bi`BM;- r?BH2 i?2 /QHH` bB;M Ki+?2b i?2 2M/X aQ- /^\d+$/ Ki+?2b 
bi`BM; +QMbBbiBM; 2MiB`2Hv Q7 QM2 Q` KQ`2 /B;Bib- /^!/ Ki+?2b Mv bi`BM;
i?i bi`ib rBi? M 2t+HKiBQM K`F- M/ /x^/ /Q2b MQi Ki+? Mv bi`BM;
Ui?2`2 +MMQi #2 M t #27Q`2 i?2 bi`i Q7 i?2 bi`BM;VX
A7- QM i?2 Qi?2` ?M/- r2 Dmbi rMi iQ KF2 bm`2 i?2 /i2 bi`ib M/
2M/b QM  rQ`/ #QmM/`v- r2 +M mb2 i?2 K`F2` \bX  rQ`/ #QmM/`v
+M #2 i?2 bi`i Q` 2M/ Q7 i?2 bi`BM; Q` Mv TQBMi BM i?2 bi`BM; i?i ?b
 rQ`/ +?`+i2` Ub BM \wV QM QM2 bB/2 M/  MQMrQ`/ +?`+i2` QM i?2
Qi?2`X
console . log (/ cat /. test (" concatenate ") ) ;
// → true
console . log (/\ bcat \ b /. test (" concatenate ") ) ;

RdR
// → false

LQi2 i?i  #QmM/`v K`F2` /Q2bMǶi `2T`2b2Mi M +imH +?`+i2`X Ai


Dmbi 2M7Q`+2b i?i i?2 `2;mH` 2tT`2bbBQM Ki+?2b QMHv r?2M  +2`iBM
+QM/BiBQM ?QH/b i i?2 TH+2 r?2`2 Bi TT2`b BM i?2 Tii2`MX

*?QB+2 Tii2`Mb
av r2 rMi iQ FMQr r?2i?2`  TB2+2 Q7 i2ti +QMiBMb MQi QMHv  MmK#2`
#mi  MmK#2` 7QHHQr2/ #v QM2 Q7 i?2 rQ`/b TB;- +Qr- Q` +?B+F2M- Q` Mv
Q7 i?2B` THm`H 7Q`KbX
q2 +QmH/ r`Bi2 i?`22 `2;mH` 2tT`2bbBQMb M/ i2bi i?2K BM im`M- #mi
i?2`2 Bb  MB+2` rvX h?2 TBT2 +?`+i2` U|V /2MQi2b  +?QB+2 #2ir22M
i?2 Tii2`M iQ Bib H27i M/ i?2 Tii2`M iQ Bib `B;?iX aQ A +M bv i?Bb,
var animalCount = /\ b \ d + ( pig | cow | chicken )s ?\ b /;
console . log ( animalCount . test ("15 pigs ") ) ;
// → true
console . log ( animalCount . test ("15 pigchickens ") ) ;
// → false

S`2Mi?2b2b +M #2 mb2/ iQ HBKBi i?2 T`i Q7 i?2 Tii2`M i?i i?2 TBT2
QT2`iQ` TTHB2b iQ- M/ vQm +M Tmi KmHiBTH2 bm+? QT2`iQ`b M2ti iQ
2+? Qi?2` iQ 2tT`2bb  +?QB+2 #2ir22M KQ`2 i?M irQ Tii2`MbX

h?2 K2+?MB+b Q7 Ki+?BM;


_2;mH` 2tT`2bbBQMb +M #2 i?Qm;?i Q7 b ~Qr /B;`KbX h?Bb Bb i?2
/B;`K 7Q` i?2 HBp2biQ+F 2tT`2bbBQM BM i?2 T`2pBQmb 2tKTH2,
Group #1

"pig"

boundary digit "" "cow" "s" boundary

"chicken"

Pm` 2tT`2bbBQM Ki+?2b  bi`BM; B7 r2 +M }M/  Ti? 7`QK i?2 H27i bB/2

Rdk
Q7 i?2 /B;`K iQ i?2 `B;?i bB/2X q2 F22T  +m``2Mi TQbBiBQM BM i?2 bi`BM;-
M/ 2p2`v iBK2 r2 KQp2 i?`Qm;?  #Qt- r2 p2`B7v i?i i?2 T`i Q7 i?2
bi`BM; 7i2` Qm` +m``2Mi TQbBiBQM Ki+?2b i?i #QtX
aQ B7 r2 i`v iQ Ki+? "the 3 pigs" rBi? Qm` `2;mH` 2tT`2bbBQM- Qm`
T`Q;`2bb i?`Qm;? i?2 ~Qr +?`i rQmH/ HQQF HBF2 i?Bb,

Ç i TQbBiBQM 9- i?2`2 Bb  rQ`/ #QmM/`v- bQ r2 +M KQp2 Tbi i?2


}`bi #QtX

Ç aiBHH i TQbBiBQM 9- r2 }M/  /B;Bi- bQ r2 +M HbQ KQp2 Tbi i?2


b2+QM/ #QtX

Ç i TQbBiBQM 8- QM2 Ti? HQQTb #+F iQ #27Q`2 i?2 b2+QM/ U/B;BiV #Qt-
r?BH2 i?2 Qi?2` KQp2b 7Q`r`/ i?`Qm;? i?2 #Qt i?i ?QH/b  bBM;H2
bT+2 +?`+i2`X h?2`2 Bb  bT+2 ?2`2- MQi  /B;Bi- bQ r2 Kmbi iF2
i?2 b2+QM/ Ti?X

Ç q2 `2 MQr i TQbBiBQM e Ui?2 bi`i Q7 dzTB;bǴV M/ i i?2 i?`22@rv


#`M+? BM i?2 /B;`KX q2 /QMǶi b22 dz+QrǴ Q` dz+?B+F2MǴ ?2`2- #mi
r2 /Q b22 dzTB;Ǵ- bQ r2 iF2 i?i #`M+?X

Ç i TQbBiBQM N- 7i2` i?2 i?`22@rv #`M+?- QM2 Ti? bFBTb i?2 b #Qt
M/ ;Q2b bi`B;?i iQ i?2 }MH rQ`/ #QmM/`v- r?BH2 i?2 Qi?2` Ti?
Ki+?2b M bX h?2`2 Bb M b +?`+i2` ?2`2- MQi  rQ`/ #QmM/`v-
bQ r2 ;Q i?`Qm;? i?2 b #QtX

Ç q2Ƕ`2 i TQbBiBQM Ry Ui?2 2M/ Q7 i?2 bi`BM;V M/ +M Ki+? QMHv 
rQ`/ #QmM/`vX h?2 2M/ Q7  bi`BM; +QmMib b  rQ`/ #QmM/`v-
bQ r2 ;Q i?`Qm;? i?2 Hbi #Qt M/ ?p2 bm++2bb7mHHv Ki+?2/ i?Bb
bi`BM;X

*QM+2TimHHv-  `2;mH` 2tT`2bbBQM 2M;BM2 HQQFb 7Q`  Ki+? BM  bi`BM;


b 7QHHQrb, Bi bi`ib i i?2 bi`i Q7 i?2 bi`BM; M/ i`B2b  Ki+? i?2`2X
AM i?Bb +b2- i?2`2 Bb  rQ`/ #QmM/`v i?2`2- bQ BiǶ/ ;2i Tbi i?2 }`bi
#Qtě#mi i?2`2 Bb MQ /B;Bi- bQ BiǶ/ 7BH i i?2 b2+QM/ #QtX h?2M Bi KQp2b
QM iQ i?2 b2+QM/ +?`+i2` BM i?2 bi`BM; M/ i`B2b iQ #2;BM  M2r Ki+?
i?2`2Ę M/ bQ QM- mMiBH Bi }M/b  Ki+? Q` `2+?2b i?2 2M/ Q7 i?2 bi`BM;
M/ /2+B/2b i?i i?2`2 `2HHv Bb MQ Ki+?X

Rdj
"+Fi`+FBM;
h?2 `2;mH` 2tT`2bbBQM /\b([01]+b|\d+|[\da-f]+h)\b/ Ki+?2b 2Bi?2`  #B@
M`v MmK#2` 7QHHQr2/ #v  #-  `2;mH` /2+BKH MmK#2` rBi? MQ bm{t
+?`+i2`- Q`  ?2t/2+BKH MmK#2` Ui?i Bb- #b2 Re- rBi? i?2 H2ii2`b
 iQ 7 biM/BM; 7Q` i?2 /B;Bib Ry iQ R8V 7QHHQr2/ #v M ?X h?Bb Bb i?2
+Q``2bTQM/BM; /B;`K,
Group #1

One of:

“0”
“b”
“1”

boundary digit boundary

One of:

digit
“h”
“a” - “f”

q?2M Ki+?BM; i?Bb 2tT`2bbBQM- Bi rBHH Q7i2M ?TT2M i?i i?2 iQT U#B@
M`vV #`M+? Bb 2Mi2`2/ 2p2M i?Qm;? i?2 BMTmi /Q2b MQi +imHHv +QMiBM
 #BM`v MmK#2`X q?2M Ki+?BM; i?2 bi`BM; "103"- 7Q` 2tKTH2- Bi #2@
+QK2b +H2` QMHv i i?2 j i?i r2 `2 BM i?2 r`QM; #`M+?X h?2 bi`BM;
/Q2b Ki+? i?2 2tT`2bbBQM- Dmbi MQi i?2 #`M+? r2 `2 +m``2MiHv BMX
aQ i?2 Ki+?2` #+Fi`+FbX q?2M 2Mi2`BM;  #`M+?- Bi `2K2K#2`b Bib
+m``2Mi TQbBiBQM UBM i?Bb +b2- i i?2 bi`i Q7 i?2 bi`BM;- Dmbi Tbi i?2 }`bi
#QmM/`v #Qt BM i?2 /B;`KV bQ i?i Bi +M ;Q #+F M/ i`v MQi?2`
#`M+? B7 i?2 +m``2Mi QM2 /Q2b MQi rQ`F QmiX 6Q` i?2 bi`BM; "103"- 7i2`
2M+QmMi2`BM; i?2 j +?`+i2`- Bi rBHH bi`i i`vBM; i?2 #`M+? 7Q` /2+BKH
MmK#2`bX h?Bb QM2 Ki+?2b- bQ  Ki+? Bb `2TQ`i2/ 7i2` HHX
h?2 Ki+?2` biQTb b bQQM b Bi }M/b  7mHH Ki+?X h?Bb K2Mb i?i

Rd9
B7 KmHiBTH2 #`M+?2b +QmH/ TQi2MiBHHv Ki+?  bi`BM;- QMHv i?2 }`bi QM2
UQ`/2`2/ #v r?2`2 i?2 #`M+?2b TT2` BM i?2 `2;mH` 2tT`2bbBQMV Bb mb2/X
"+Fi`+FBM; HbQ ?TT2Mb 7Q` `2T2iBiBQM QT2`iQ`b HBF2 Y M/ *X A7 vQm
Ki+? /^.*x/ ;BMbi "abcxe"- i?2 .* T`i rBHH }`bi i`v iQ +QMbmK2 i?2
r?QH2 bi`BM;X h?2 2M;BM2 rBHH i?2M `2HBx2 i?i Bi M22/b M t iQ Ki+?
i?2 Tii2`MX aBM+2 i?2`2 Bb MQ t Tbi i?2 2M/ Q7 i?2 bi`BM;- i?2 bi`
QT2`iQ` i`B2b iQ Ki+? QM2 +?`+i2` H2bbX "mi i?2 Ki+?2` /Q2bMǶi }M/
M t 7i2` abcx 2Bi?2`- bQ Bi #+Fi`+Fb ;BM- Ki+?BM; i?2 bi` QT2`iQ`
iQ Dmbi abcX LQr Bi }M/b M t r?2`2 Bi M22/b Bi M/ `2TQ`ib  bm++2bb7mH
Ki+? 7`QK TQbBiBQMb y iQ 9X
Ai Bb TQbbB#H2 iQ r`Bi2 `2;mH` 2tT`2bbBQMb i?i rBHH /Q  HQi Q7 #+F@
i`+FBM;X h?Bb T`Q#H2K Q++m`b r?2M  Tii2`M +M Ki+?  TB2+2 Q7
BMTmi BM KMv /Bz2`2Mi rvbX 6Q` 2tKTH2- B7 r2 ;2i +QM7mb2/ r?BH2
r`BiBM;  #BM`v@MmK#2` `2;mH` 2tT`2bbBQM- r2 KB;?i ++B/2MiHHv r`Bi2
bQK2i?BM; HBF2 /([01]+)+b/X
Group #1

One of:

"0"
"b"
"1"

A7 i?i i`B2b iQ Ki+? bQK2 HQM; b2`B2b Q7 x2`Qb M/ QM2b rBi? MQ i`BHBM;
# +?`+i2`- i?2 Ki+?2` rBHH }`bi ;Q i?`Qm;? i?2 BMM2` HQQT mMiBH Bi `mMb
Qmi Q7 /B;BibX h?2M Bi MQiB+2b i?2`2 Bb MQ #- bQ Bi #+Fi`+Fb QM2 TQbBiBQM-
;Q2b i?`Qm;? i?2 Qmi2` HQQT QM+2- M/ ;Bp2b mT ;BM- i`vBM; iQ #+Fi`+F
Qmi Q7 i?2 BMM2` HQQT QM+2 KQ`2X Ai rBHH +QMiBMm2 iQ i`v 2p2`v TQbbB#H2
`Qmi2 i?`Qm;? i?2b2 irQ HQQTbX h?Bb K2Mb i?2 KQmMi Q7 rQ`F /Qm#H2b
rBi? 2+? //BiBQMH +?`+i2`X 6Q` 2p2M Dmbi  72r /Qx2M +?`+i2`b-
i?2 `2bmHiBM; Ki+? rBHH iF2 T`+iB+HHv 7Q`2p2`X

Rd8
h?2 `2TH+2 K2i?Q/
ai`BM; pHm2b ?p2  replace K2i?Q/- r?B+? +M #2 mb2/ iQ `2TH+2 T`i
Q7 i?2 bi`BM; rBi? MQi?2` bi`BM;X
console . log (" papa ". replace (" p", "m ") ) ;
// → mapa

h?2 }`bi `;mK2Mi +M HbQ #2  `2;mH` 2tT`2bbBQM- BM r?B+? +b2 i?2
}`bi Ki+? Q7 i?2 `2;mH` 2tT`2bbBQM Bb `2TH+2/X q?2M  g QTiBQM U7Q`
;HQ#HV Bb //2/ iQ i?2 `2;mH` 2tT`2bbBQM- HH Ki+?2b BM i?2 bi`BM; rBHH
#2 `2TH+2/- MQi Dmbi i?2 }`biX
console . log (" Borobudur ". replace (/[ ou ]/ , " a ") ) ;
// → Barobudur
console . log (" Borobudur ". replace (/[ ou ]/ g , " a ") ) ;
// → Barabadar

Ai rQmH/ ?p2 #22M b2MbB#H2 B7 i?2 +?QB+2 #2ir22M `2TH+BM; QM2 Ki+?
Q` HH Ki+?2b rb K/2 i?`Qm;? M //BiBQMH `;mK2Mi iQ replace Q`
#v T`QpB/BM;  /Bz2`2Mi K2i?Q/- replaceAllX "mi 7Q` bQK2 mM7Q`imMi2
`2bQM- i?2 +?QB+2 `2HB2b QM  T`QT2`iv Q7 i?2 `2;mH` 2tT`2bbBQM BMbi2/X
h?2 `2H TQr2` Q7 mbBM; `2;mH` 2tT`2bbBQMb rBi? replace +QK2b 7`QK i?2
7+i i?i r2 +M `272` #+F iQ Ki+?2/ ;`QmTb BM i?2 `2TH+2K2Mi bi`BM;X
6Q` 2tKTH2- bv r2 ?p2  #B; bi`BM; +QMiBMBM; i?2 MK2b Q7 T2QTH2-
QM2 MK2 T2` HBM2- BM i?2 7Q`Ki Lastname, FirstnameX A7 r2 rMi iQ brT
i?2b2 MK2b M/ `2KQp2 i?2 +QKK iQ ;2i  bBKTH2 Firstname Lastname
7Q`Ki- r2 +M mb2 i?2 7QHHQrBM; +Q/2,
console . log (
" Hopper , Grace \ nMcCarthy , John \ nRitchie , Dennis "
. replace (/([\ w ]+) , ([\ w ]+) /g , " $2 $1 ") ) ;
// → Grace Hopper
// John McCarthy
// Dennis Ritchie

h?2 $1 M/ $2 BM i?2 `2TH+2K2Mi bi`BM; `272` iQ i?2 T`2Mi?2bBx2/ ;`QmTb


BM i?2 Tii2`MX $1 Bb `2TH+2/ #v i?2 i2ti i?i Ki+?2/ ;BMbi i?2 }`bi
;`QmT- $2 #v i?2 b2+QM/- M/ bQ QM- mT iQ $9X h?2 r?QH2 Ki+? +M #2
`272``2/ iQ rBi? $&X

Rde
Ai Bb HbQ TQbbB#H2 iQ Tbb  7mM+iBQM- `i?2` i?M  bi`BM;- b i?2 b2+QM/
`;mK2Mi iQ replaceX 6Q` 2+? `2TH+2K2Mi- i?2 7mM+iBQM rBHH #2 +HH2/
rBi? i?2 Ki+?2/ ;`QmTb Ub r2HH b i?2 r?QH2 Ki+?V b `;mK2Mib- M/
Bib `2im`M pHm2 rBHH #2 BMb2`i2/ BMiQ i?2 M2r bi`BM;X
>2`2Ƕb  bBKTH2 2tKTH2,
var s = " the cia and fbi ";
console . log ( s . replace (/\ b( fbi | cia )\ b /g , function ( str ) {
return str . toUpperCase () ;
}) ) ;
// → the CIA and FBI

M/ ?2`2Ƕb  KQ`2 BMi2`2biBM; QM2,


var stock = "1 lemon , 2 cabbages , and 101 eggs ";
function minusOne ( match , amount , unit ) {
amount = Number ( amount ) - 1;
if ( amount == 1) // only one left , remove the s
unit = unit . slice (0 , unit . length - 1) ;
else if ( amount == 0)
amount = " no ";
return amount + " " + unit ;
}
console . log ( stock . replace (/(\ d +) (\ w +) /g , minusOne ) ) ;
// → no lemon , 1 cabbage , and 100 eggs

h?Bb iF2b  bi`BM;- }M/b HH Q++m``2M+2b Q7  MmK#2` 7QHHQr2/ #v M


HT?MmK2`B+ rQ`/- M/ `2im`Mb  bi`BM; r?2`2BM 2p2`v bm+? Q++m``2M+2
Bb /2+`2K2Mi2/ #v QM2X
h?2 (\d+) ;`QmT 2M/b mT b i?2 amount `;mK2Mi iQ i?2 7mM+iBQM- M/
i?2 (\w+) ;`QmT ;2ib #QmM/ iQ unitX h?2 7mM+iBQM +QMp2`ib amount iQ 
MmK#2`ěr?B+? Hrvb rQ`Fb- bBM+2 Bi Ki+?2/ \d+ěM/ KF2b bQK2
/DmbiK2Mib BM +b2 i?2`2 Bb QMHv QM2 Q` x2`Q H27iX

:`22/
Ai BbMǶi ?`/ iQ mb2 replace iQ r`Bi2  7mM+iBQM i?i `2KQp2b HH +QKK2Mib
7`QK  TB2+2 Q7 Cpa+`BTi +Q/2X >2`2 Bb  }`bi ii2KTi,
function stripComments ( code ) {

Rdd
return code . replace (/\/\/.*|\/\*[^]*\*\// g , "") ;
}
console . log ( stripComments ("1 + /* 2 */3") ) ;
// → 1 + 3
console . log ( stripComments (" x = 10;// ten !") ) ;
// → x = 10;
console . log ( stripComments ("1 /* a */+/* b */ 1") ) ;
// → 1 1

h?2 T`i #27Q`2 i?2 Q` QT2`iQ` bBKTHv Ki+?2b irQ bHb? +?`+i2`b
7QHHQr2/ #v Mv MmK#2` Q7 MQM@M2rHBM2 +?`+i2`bX h?2 T`i 7Q` KmHiBHBM2
+QKK2Mib Bb KQ`2 BMpQHp2/X q2 mb2 [^] UMv +?`+i2` i?i Bb MQi BM i?2
2KTiv b2i Q7 +?`+i2`bV b  rv iQ Ki+? Mv +?`+i2`X q2 +MMQi
Dmbi mb2  /Qi ?2`2 #2+mb2 #HQ+F +QKK2Mib +M +QMiBMm2 QM  M2r HBM2-
M/ /Qib /Q MQi Ki+? i?2 M2rHBM2 +?`+i2`X
"mi i?2 QmiTmi Q7 i?2 T`2pBQmb 2tKTH2 TT2`b iQ ?p2 ;QM2 r`QM;X
q?v\
h?2 [^]* T`i Q7 i?2 2tT`2bbBQM- b A /2b+`B#2/ BM i?2 b2+iBQM QM #+F@
i`+FBM;- rBHH }`bi Ki+? b Km+? b Bi +MX A7 i?i +mb2b i?2 M2ti T`i
Q7 i?2 Tii2`M iQ 7BH- i?2 Ki+?2` KQp2b #+F QM2 +?`+i2` M/ i`B2b
;BM 7`QK i?2`2X AM i?2 2tKTH2- i?2 Ki+?2` }`bi i`B2b iQ Ki+? i?2
r?QH2 `2bi Q7 i?2 bi`BM; M/ i?2M KQp2b #+F 7`QK i?2`2X Ai rBHH }M/ M
Q++m``2M+2 Q7 */ 7i2` ;QBM; #+F 7Qm` +?`+i2`b M/ Ki+? i?iX h?Bb
Bb MQi r?i r2 rMi2/ěi?2 BMi2MiBQM rb iQ Ki+?  bBM;H2 +QKK2Mi-
MQi iQ ;Q HH i?2 rv iQ i?2 2M/ Q7 i?2 +Q/2 M/ }M/ i?2 2M/ Q7 i?2 Hbi
#HQ+F +QKK2MiX
"2+mb2 Q7 i?Bb #2?pBQ`- r2 bv i?2 `2T2iBiBQM QT2`iQ`b U+- *- ?- M/
{}V `2 ;`22/v- K2MBM; i?2v Ki+? b Km+? b i?2v +M M/ #+Fi`+F
7`QK i?2`2X A7 vQm Tmi  [m2biBQM K`F 7i2` i?2K U+?- *?- ??- {}?V- i?2v
#2+QK2 MQM;`22/v M/ bi`i #v Ki+?BM; b HBiiH2 b TQbbB#H2- Ki+?BM;
KQ`2 QMHv r?2M i?2 `2KBMBM; Tii2`M /Q2b MQi }i i?2 bKHH2` Ki+?X
M/ i?i Bb 2t+iHv r?i r2 rMi BM i?Bb +b2X "v ?pBM; i?2 bi`
Ki+? i?2 bKHH2bi bi`2i+? Q7 +?`+i2`b i?i #`BM;b mb iQ  */- r2 +QM@
bmK2 QM2 #HQ+F +QKK2Mi M/ MQi?BM; KQ`2X
function stripComments ( code ) {
return code . replace (/\/\/.*|\/\*[^]*?\*\// g , "") ;
}
console . log ( stripComments ("1 /* a */+/* b */ 1") ) ;

Rd3
// → 1 + 1

 HQi Q7 #m;b BM `2;mH` 2tT`2bbBQM T`Q;`Kb +M #2 i`+2/ iQ mMBM@


i2MiBQMHHv mbBM;  ;`22/v QT2`iQ` r?2`2  MQM;`22/v QM2 rQmH/ rQ`F
#2ii2`X q?2M mbBM;  `2T2iBiBQM QT2`iQ`- +QMbB/2` i?2 MQM;`22/v p`BMi
}`biX

.vMKB+HHv +`2iBM; _2;1tT Q#D2+ib


h?2`2 `2 +b2b r?2`2 vQm KB;?i MQi FMQr i?2 2t+i Tii2`M vQm M22/
iQ Ki+? ;BMbi r?2M vQm `2 r`BiBM; vQm` +Q/2X av vQm rMi iQ
HQQF 7Q` i?2 mb2`Ƕb MK2 BM  TB2+2 Q7 i2ti M/ 2M+HQb2 Bi BM mM/2`b+Q`2
+?`+i2`b iQ KF2 Bi biM/ QmiX aBM+2 vQm rBHH FMQr i?2 MK2 QMHv QM+2
i?2 T`Q;`K Bb +imHHv `mMMBM;- vQm +MǶi mb2 i?2 bHb?@#b2/ MQiiBQMX
"mi vQm +M #mBH/ mT  bi`BM; M/ mb2 i?2 RegExp +QMbi`m+iQ` QM i?iX
>2`2Ƕb M 2tKTH2,
var name = " harry ";
var text = " Harry is a suspicious character .";
var regexp = new RegExp ("\\ b (" + name + ") \\ b", " gi ") ;
console . log ( text . replace ( regexp , " _$1_ ") ) ;
// → _Harry_ is a suspicious character .

q?2M +`2iBM; i?2 \b #QmM/`v K`F2`b- r2 ?p2 iQ mb2 irQ #+FbHb?2b


#2+mb2 r2 `2 r`BiBM; i?2K BM  MQ`KH bi`BM;- MQi  bHb?@2M+HQb2/ `2;@
mH` 2tT`2bbBQMX h?2 b2+QM/ `;mK2Mi iQ i?2 RegExp +QMbi`m+iQ` +QMiBMb
i?2 QTiBQMb 7Q` i?2 `2;mH` 2tT`2bbBQMěBM i?Bb +b2 "gi" 7Q` ;HQ#H M/
+b2@BMb2MbBiBp2X
"mi r?i B7 i?2 MK2 Bb "dea+hl[]rd" #2+mb2 Qm` mb2` Bb  M2`/v i22M;2`\
h?i rQmH/ `2bmHi BM  MQMb2MbB+H `2;mH` 2tT`2bbBQM- r?B+? rQMǶi +@
imHHv Ki+? i?2 mb2`Ƕb MK2X
hQ rQ`F `QmM/ i?Bb- r2 +M // #+FbHb?2b #27Q`2 Mv +?`+i2` i?i
r2 /QMǶi i`mbiX //BM; #+FbHb?2b #27Q`2 HT?#2iB+ +?`+i2`b Bb  #/
B/2 #2+mb2 i?BM;b HBF2 \b M/ \n ?p2  bT2+BH K2MBM;X "mi 2b+TBM;
2p2`vi?BM; i?iǶb MQi HT?MmK2`B+ Q` r?Bi2bT+2 Bb b72X
var name = " dea + hl [] rd ";
var text = " This dea + hl [] rd guy is super annoying .";
var escaped = name . replace (/[^\ w \s ]/g , "\\ $ &") ;

RdN
var regexp = new RegExp ("\\ b (" + escaped + ") \\ b", " gi ") ;
console . log ( text . replace ( regexp , " _$1_ ") ) ;
// → This _dea + hl [] rd_ guy is super annoying .

h?2 b2`+? K2i?Q/


h?2 indexOf K2i?Q/ QM bi`BM;b +MMQi #2 +HH2/ rBi?  `2;mH` 2tT`2bbBQMX
"mi i?2`2 Bb MQi?2` K2i?Q/- search- r?B+? /Q2b 2tT2+i  `2;mH` 2tT`2b@
bBQMX GBF2 indexOf- Bi `2im`Mb i?2 }`bi BM/2t QM r?B+? i?2 2tT`2bbBQM rb
7QmM/- Q` @R r?2M Bi rbMǶi 7QmM/X
console . log (" word ". search (/\ S /) );
// → 2
console . log (" ". search (/\ S /) ) ;
// → -1

lM7Q`imMi2Hv- i?2`2 Bb MQ rv iQ BM/B+i2 i?i i?2 Ki+? b?QmH/ bi`i i


 ;Bp2M Qzb2i UHBF2 r2 +M rBi? i?2 b2+QM/ `;mK2Mi iQ indexOfV- r?B+?
rQmH/ Q7i2M #2 mb27mHX

h?2 HbiAM/2t T`QT2`iv


h?2 exec K2i?Q/ bBKBH`Hv /Q2b MQi T`QpB/2  +QMp2MB2Mi rv iQ bi`i
b2`+?BM; 7`QK  ;Bp2M TQbBiBQM BM i?2 bi`BM;X "mi Bi /Q2b T`QpB/2 M
BM+QMp2MB2Mi rvX
_2;mH` 2tT`2bbBQM Q#D2+ib ?p2 T`QT2`iB2bX PM2 bm+? T`QT2`iv Bb source
- r?B+? +QMiBMb i?2 bi`BM; i?i 2tT`2bbBQM rb +`2i2/ 7`QKX MQi?2`
T`QT2`iv Bb lastIndex- r?B+? +QMi`QHb- BM bQK2 HBKBi2/ +B`+mKbiM+2b-
r?2`2 i?2 M2ti Ki+? rBHH bi`iX
h?Qb2 +B`+mKbiM+2b `2 i?i i?2 `2;mH` 2tT`2bbBQM Kmbi ?p2 i?2
;HQ#H UgV QTiBQM 2M#H2/- M/ i?2 Ki+? Kmbi ?TT2M i?`Qm;? i?2 exec
K2i?Q/X ;BM-  KQ`2 bM2 bQHmiBQM rQmH/ ?p2 #22M iQ Dmbi HHQr
M 2ti` `;mK2Mi iQ #2 Tbb2/ iQ exec- #mi bMBiv Bb MQi  /2}MBM;
+?`+i2`BbiB+ Q7 Cpa+`BTiǶb `2;mH` 2tT`2bbBQM BMi2`7+2X
var pattern = / y / g ;
pattern . lastIndex = 3;

R3y
var match = pattern . exec (" xyzzy ") ;
console . log ( match . index );
// → 4
console . log ( pattern . lastIndex ) ;
// → 5

A7 i?2 Ki+? rb bm++2bb7mH- i?2 +HH iQ exec miQKiB+HHv mT/i2b i?2
lastIndex T`QT2`iv iQ TQBMi 7i2` i?2 Ki+?X A7 MQ Ki+? rb 7QmM/-
lastIndex Bb b2i #+F iQ x2`Q- r?B+? Bb HbQ i?2 pHm2 Bi ?b BM  M2rHv
+QMbi`m+i2/ `2;mH` 2tT`2bbBQM Q#D2+iX
q?2M mbBM;  ;HQ#H `2;mH` 2tT`2bbBQM pHm2 7Q` KmHiBTH2 exec +HHb-
i?2b2 miQKiB+ mT/i2b iQ i?2 lastIndex T`QT2`iv +M +mb2 T`Q#H2KbX
uQm` `2;mH` 2tT`2bbBQM KB;?i #2 ++B/2MiHHv bi`iBM; i M BM/2t i?i
rb H27i Qp2` 7`QK  T`2pBQmb +HHX
var digit = /\ d / g ;
console . log ( digit . exec (" here it is : 1") ) ;
// → ["1"]
console . log ( digit . exec (" and now : 1") ) ;
// → null

MQi?2` BMi2`2biBM; 2z2+i Q7 i?2 ;HQ#H QTiBQM Bb i?i Bi +?M;2b i?2 rv
i?2 match K2i?Q/ QM bi`BM;b rQ`FbX q?2M +HH2/ rBi?  ;HQ#H 2tT`2b@
bBQM- BMbi2/ Q7 `2im`MBM; M ``v bBKBH` iQ i?i `2im`M2/ #v exec- match
rBHH }M/ HH Ki+?2b Q7 i?2 Tii2`M BM i?2 bi`BM; M/ `2im`M M ``v
+QMiBMBM; i?2 Ki+?2/ bi`BM;bX
console . log (" Banana ". match (/ an /g) ) ;
// → [" an ", " an "]

aQ #2 +miBQmb rBi? ;HQ#H `2;mH` 2tT`2bbBQMbX h?2 +b2b r?2`2 i?2v


`2 M2+2bb`vě+HHb iQ replace M/ TH+2b r?2`2 vQm rMi iQ 2tTHB+BiHv
mb2 lastIndexě`2 ivTB+HHv i?2 QMHv TH+2b r?2`2 vQm rMi iQ mb2 i?2KX

GQQTBM; Qp2` Ki+?2b


 +QKKQM Tii2`M Bb iQ b+M i?`Qm;? HH Q++m``2M+2b Q7  Tii2`M BM
 bi`BM;- BM  rv i?i ;Bp2b mb ++2bb iQ i?2 Ki+? Q#D2+i BM i?2 HQQT
#Q/v- #v mbBM; lastIndex M/ execX
var input = " A string with 3 numbers in it ... 42 and 88.";

R3R
var number = /\ b (\ d +) \ b /g;
var match ;
while ( match = number . exec ( input ))
console . log (" Found " , match [1] , " at " , match . index ) ;
// → Found 3 at 14
// Found 42 at 33
// Found 88 at 40

h?Bb KF2b mb2 Q7 i?2 7+i i?i i?2 pHm2 Q7 M bbB;MK2Mi 2tT`2bbBQM
U=V Bb i?2 bbB;M2/ pHm2X aQ #v mbBM; match = number.exec(input) b i?2
+QM/BiBQM BM i?2 while bii2K2Mi- r2 T2`7Q`K i?2 Ki+? i i?2 bi`i Q7
2+? Bi2`iBQM- bp2 Bib `2bmHi BM  p`B#H2- M/ biQT HQQTBM; r?2M MQ
KQ`2 Ki+?2b `2 7QmM/X

S`bBM; M ALA }H2


hQ +QM+Hm/2 i?2 +?Ti2`- r2ǶHH HQQF i  T`Q#H2K i?i +HHb 7Q` `2;mH`
2tT`2bbBQMbX AK;BM2 r2 `2 r`BiBM;  T`Q;`K iQ miQKiB+HHv ?`p2bi
BM7Q`KiBQM #Qmi Qm` 2M2KB2b 7`QK i?2 AMi2`M2iX Uq2 rBHH MQi +imHHv
r`Bi2 i?i T`Q;`K ?2`2- Dmbi i?2 T`i i?i `2/b i?2 +QM};m`iBQM }H2X
aQ``v iQ /BbTTQBMiXV h?2 +QM};m`iBQM }H2 HQQFb HBF2 i?Bb,
searchengine = http :// www . google . com / search ? q = $1
spitefulness =9.7

; comments are preceded by a semicolon ...


; each section concerns an individual enemy
[ larry ]
fullname = Larry Doe
type = kindergarten bully
website = http :// www . geocities . com / CapeCanaveral /11451

[ gargamel ]
fullname = Gargamel
type = evil sorcerer
outputdir =/ home / marijn / enemies / gargamel

h?2 2t+i `mH2b 7Q` i?Bb 7Q`Ki Ur?B+? Bb +imHHv  rB/2Hv mb2/ 7Q`Ki-
mbmHHv +HH2/ M ALA }H2V `2 b 7QHHQrb,
Ç "HMF HBM2b M/ HBM2b bi`iBM; rBi? b2KB+QHQMb `2 B;MQ`2/X

R3k
Ç GBM2b r`TT2/ BM [ M/ ] bi`i  M2r b2+iBQMX

Ç GBM2b +QMiBMBM; M HT?MmK2`B+ B/2MiB}2` 7QHHQr2/ #v M = +?`@


+i2` //  b2iiBM; iQ i?2 +m``2Mi b2+iBQMX

Ç Mvi?BM; 2Hb2 Bb BMpHB/X

Pm` ibF Bb iQ +QMp2`i  bi`BM; HBF2 i?Bb BMiQ M ``v Q7 Q#D2+ib- 2+?
rBi?  name T`QT2`iv M/ M ``v Q7 b2iiBM;bX q2ǶHH M22/ QM2 bm+? Q#D2+i
7Q` 2+? b2+iBQM M/ QM2 7Q` i?2 ;HQ#H b2iiBM;b i i?2 iQTX
aBM+2 i?2 7Q`Ki ?b iQ #2 T`Q+2bb2/ HBM2 #v HBM2- bTHBiiBM; mT i?2 }H2
BMiQ b2T`i2 HBM2b Bb  ;QQ/ bi`iX q2 mb2/ string.split("\n") iQ /Q i?Bb
BM *?Ti2` eX aQK2 QT2`iBM; bvbi2Kb- ?Qr2p2`- mb2 MQi Dmbi  M2rHBM2
+?`+i2` iQ b2T`i2 HBM2b #mi  +``B;2 `2im`M +?`+i2` 7QHHQr2/ #v
 M2rHBM2 U"\r\n"VX :Bp2M i?i i?2 split K2i?Q/ HbQ HHQrb  `2;mH`
2tT`2bbBQM b Bib `;mK2Mi- r2 +M bTHBi QM  `2;mH` 2tT`2bbBQM HBF2
/\r?\n/ iQ bTHBi BM  rv i?i HHQrb #Qi? "\n" M/ "\r\n" #2ir22M HBM2bX

function parseINI ( string ) {


// Start with an object to hold the top - level fields
var currentSection = { name : null , fields : []};
var categories = [ currentSection ];

string . split (/\ r ?\ n /) . forEach ( function ( line ) {


var match ;
if (/^\ s *(;.*) ? $ /. test ( line ) ) {
return ;
} else if ( match = line . match (/^\[(.*) \] $ /) ) {
currentSection = { name : match [1] , fields : []};
categories . push ( currentSection ) ;
} else if ( match = line . match (/^(\ w +) =(.*) $ /) ) {
currentSection . fields . push ({ name : match [1] ,
value : match [2]}) ;
} else {
throw new Error (" Line " + line + " is invalid .") ;
}
}) ;

return categories ;
}

R3j
h?Bb +Q/2 ;Q2b Qp2` 2p2`v HBM2 BM i?2 }H2- mT/iBM; i?2 dz+m``2Mi b2+iBQMǴ
Q#D2+i b Bi ;Q2b HQM;X 6B`bi- Bi +?2+Fb r?2i?2` i?2 HBM2 +M #2 B;MQ`2/-
mbBM; i?2 2tT`2bbBQM /^\s*(;.*)?$/X .Q vQm b22 ?Qr Bi rQ`Fb\ h?2 T`i
#2ir22M i?2 T`2Mi?2b2b rBHH Ki+? +QKK2Mib- M/ i?2 ? rBHH KF2 bm`2
Bi HbQ Ki+?2b HBM2b +QMiBMBM; QMHv r?Bi2bT+2X
A7 i?2 HBM2 Bb MQi  +QKK2Mi- i?2 +Q/2 i?2M +?2+Fb r?2i?2` i?2 HBM2
bi`ib  M2r b2+iBQMX A7 bQ- Bi +`2i2b  M2r +m``2Mi b2+iBQM Q#D2+i- iQ
r?B+? bm#b2[m2Mi b2iiBM;b rBHH #2 //2/X
h?2 Hbi K2MBM;7mH TQbbB#BHBiv Bb i?i i?2 HBM2 Bb  MQ`KH b2iiBM;-
r?B+? i?2 +Q/2 //b iQ i?2 +m``2Mi b2+iBQM Q#D2+iX
A7  HBM2 Ki+?2b MQM2 Q7 i?2b2 7Q`Kb- i?2 7mM+iBQM i?`Qrb M 2``Q`X
LQi2 i?2 `2+m``BM; mb2 Q7 ^ M/ $ iQ KF2 bm`2 i?2 2tT`2bbBQM Ki+?2b
i?2 r?QH2 HBM2- MQi Dmbi T`i Q7 BiX G2pBM; i?2b2 Qmi `2bmHib BM +Q/2
i?i KQbiHv rQ`Fb #mi #2?p2b bi`M;2Hv 7Q` bQK2 BMTmi- r?B+? +M #2
 /B{+mHi #m; iQ i`+F /QrMX
h?2 Tii2`M if (match = string.match(...)) Bb bBKBH` iQ i?2 i`B+F Q7 mbBM;
M bbB;MK2Mi b i?2 +QM/BiBQM 7Q` whileX uQm Q7i2M `2MǶi bm`2 i?i vQm`
+HH iQ match rBHH bm++22/- bQ vQm +M ++2bb i?2 `2bmHiBM; Q#D2+i QMHv
BMbB/2 M if bii2K2Mi i?i i2bib 7Q` i?BbX hQ MQi #`2F i?2 TH2bMi
+?BM Q7 if 7Q`Kb- r2 bbB;M i?2 `2bmHi Q7 i?2 Ki+? iQ  p`B#H2 M/
BKK2/Bi2Hv mb2 i?i bbB;MK2Mi b i?2 i2bi BM i?2 if bii2K2MiX

AMi2`MiBQMH +?`+i2`b
"2+mb2 Q7 Cpa+`BTiǶb BMBiBH bBKTHBbiB+ BKTH2K2MiiBQM M/ i?2 7+i
i?i i?Bb bBKTHBbiB+ TT`Q+? rb Hi2` b2i BM biQM2 b biM/`/ #2?p@
BQ`- Cpa+`BTiǶb `2;mH` 2tT`2bbBQMb `2 `i?2` /mK# #Qmi +?`+i2`b
i?i /Q MQi TT2` BM i?2 1M;HBb? HM;m;2X 6Q` 2tKTH2- b 7` b
Cpa+`BTiǶb `2;mH` 2tT`2bbBQMb `2 +QM+2`M2/-  dzrQ`/ +?`+i2`Ǵ Bb
QMHv QM2 Q7 i?2 ke +?`+i2`b BM i?2 GiBM HT?#2i UmTT2`+b2 Q` HQr@
2`+b2V M/- 7Q` bQK2 `2bQM- i?2 mM/2`b+Q`2 +?`+i2`X h?BM;b HBF2 û Q`
Ľ- r?B+? KQbi /2}MBi2Hv `2 rQ`/ +?`+i2`b- rBHH MQi Ki+? \w UM/ rBHH
Ki+? mTT2`+b2 \W- i?2 MQMrQ`/ +i2;Q`vVX
"v  bi`M;2 ?BbiQ`B+H ++B/2Mi- \s Ur?Bi2bT+2V /Q2b MQi ?p2 i?Bb
T`Q#H2K M/ Ki+?2b HH +?`+i2`b i?i i?2 lMB+Q/2 biM/`/ +QMbB/2`b
r?Bi2bT+2- BM+Hm/BM; i?BM;b HBF2 i?2 MQM#`2FBM; bT+2 M/ i?2 JQM;Q@

R39
HBM pQr2H b2T`iQ`X
aQK2 `2;mH` 2tT`2bbBQM BKTH2K2MiiBQMb BM Qi?2` T`Q;`KKBM; HM@
;m;2b ?p2 bvMit iQ Ki+? bT2+B}+ lMB+Q/2 +?`+i2` +i2;Q`B2b- bm+?
b dzHH mTT2`+b2 H2ii2`bǴ- dzHH TmM+imiBQMǴ- Q` dz+QMi`QH +?`+i2`bǴX
h?2`2 `2 THMb iQ // bmTTQ`i 7Q` bm+? +i2;Q`B2b Cpa+`BTi- #mi Bi
mM7Q`imMi2Hv HQQFb HBF2 i?2v rQMǶi #2 `2HBx2/ BM i?2 M2` 7mim`2X

amKK`v
_2;mH` 2tT`2bbBQMb `2 Q#D2+ib i?i `2T`2b2Mi Tii2`Mb BM bi`BM;bX h?2v
mb2 i?2B` QrM bvMit iQ 2tT`2bb i?2b2 Tii2`MbX
/abc/  b2[m2M+2 Q7 +?`+i2`b
/[abc]/ Mv +?`+i2` 7`QK  b2i Q7 +?`+i2`b
/[^abc]/ Mv +?`+i2` MQi BM  b2i Q7 +?`+i2`b
/[0-9]/ Mv +?`+i2` BM  `M;2 Q7 +?`+i2`b
/x+/ PM2 Q` KQ`2 Q++m``2M+2b Q7 i?2 Tii2`M x
/x+?/ PM2 Q` KQ`2 Q++m``2M+2b- MQM;`22/v
/x*/ w2`Q Q` KQ`2 Q++m``2M+2b
/x?/ w2`Q Q` QM2 Q++m``2M+2
/x{2,4}/ "2ir22M irQ M/ 7Qm` Q++m``2M+2b
/(abc)/  ;`QmT
/a|b|c/ Mv QM2 Q7 b2p2`H Tii2`Mb
/\d/ Mv /B;Bi +?`+i2`
/\w/ M HT?MmK2`B+ +?`+i2` UdzrQ`/ +?`+i2`ǴV
/\s/ Mv r?Bi2bT+2 +?`+i2`
/./ Mv +?`+i2` 2t+2Ti M2rHBM2b
/\b/  rQ`/ #QmM/`v
/^/ ai`i Q7 BMTmi
/$/ 1M/ Q7 BMTmi
 `2;mH` 2tT`2bbBQM ?b  K2i?Q/ test iQ i2bi r?2i?2`  ;Bp2M bi`BM;
Ki+?2b BiX Ai HbQ ?b M exec K2i?Q/ i?i- r?2M  Ki+? Bb 7QmM/-
`2im`Mb M ``v +QMiBMBM; HH Ki+?2/ ;`QmTbX am+? M ``v ?b M
index T`QT2`iv i?i BM/B+i2b r?2`2 i?2 Ki+? bi`i2/X
ai`BM;b ?p2  match K2i?Q/ iQ Ki+? i?2K ;BMbi  `2;mH` 2tT`2b@
bBQM M/  search K2i?Q/ iQ b2`+? 7Q` QM2- `2im`MBM; QMHv i?2 bi`iBM;
TQbBiBQM Q7 i?2 Ki+?X h?2B` replace K2i?Q/ +M `2TH+2 Ki+?2b Q7 

R38
Tii2`M rBi?  `2TH+2K2Mi bi`BM;X Hi2`MiBp2Hv- vQm +M Tbb  7mM+@
iBQM iQ replace- r?B+? rBHH #2 mb2/ iQ #mBH/ mT  `2TH+2K2Mi bi`BM; #b2/
QM i?2 Ki+? i2ti M/ Ki+?2/ ;`QmTbX
_2;mH` 2tT`2bbBQMb +M ?p2 QTiBQMb- r?B+? `2 r`Bii2M 7i2` i?2 +HQb@
BM; bHb?X h?2 i QTiBQM KF2b i?2 Ki+? +b2 BMb2MbBiBp2- r?BH2 i?2 g
QTiBQM KF2b i?2 2tT`2bbBQM ;HQ#H- r?B+?- KQM; Qi?2` i?BM;b- +mb2b
i?2 replace K2i?Q/ iQ `2TH+2 HH BMbiM+2b BMbi2/ Q7 Dmbi i?2 }`biX
h?2 RegExp +QMbi`m+iQ` +M #2 mb2/ iQ +`2i2  `2;mH` 2tT`2bbBQM pHm2
7`QK  bi`BM;X
_2;mH` 2tT`2bbBQMb `2  b?`T iQQH rBi? M rFr`/ ?M/H2X h?2v
bBKTHB7v bQK2 ibFb i`2K2M/QmbHv #mi +M [mB+FHv #2+QK2 mMKM;2#H2
r?2M TTHB2/ iQ +QKTH2t T`Q#H2KbX S`i Q7 FMQrBM; ?Qr iQ mb2 i?2K
Bb `2bBbiBM; i?2 m`;2 iQ i`v iQ b?Q2?Q`M i?BM;b i?i i?2v +MMQi bM2Hv
2tT`2bb BMiQ i?2KX

1t2`+Bb2b
Ai Bb HKQbi mMpQB/#H2 i?i- BM i?2 +Qm`b2 Q7 rQ`FBM; QM i?2b2 2t2`@
+Bb2b- vQm rBHH ;2i +QM7mb2/ M/ 7`mbi`i2/ #v bQK2 `2;mH` 2tT`2bbBQMǶb
BM2tTHB+#H2 #2?pBQ`X aQK2iBK2b Bi ?2HTb iQ 2Mi2` vQm` 2tT`2bbBQM BMiQ
M QMHBM2 iQQH HBF2 /2#m;;2tX+QK iQ b22 r?2i?2` Bib pBbmHBxiBQM +Q``2@
bTQM/b iQ r?i vQm BMi2M/2/ M/ iQ 2tT2`BK2Mi rBi? i?2 rv Bi `2bTQM/b
iQ p`BQmb BMTmi bi`BM;bX

_2;2tT ;QH7
*Q/2 ;QH7 Bb  i2`K mb2/ 7Q` i?2 ;K2 Q7 i`vBM; iQ 2tT`2bb  T`iB+mH`
T`Q;`K BM b 72r +?`+i2`b b TQbbB#H2X aBKBH`Hv- `2;2tT ;QH7 Bb i?2
T`+iB+2 Q7 r`BiBM; b iBMv  `2;mH` 2tT`2bbBQM b TQbbB#H2 iQ Ki+? 
;Bp2M Tii2`M- M/ QMHv i?i Tii2`MX
6Q` 2+? Q7 i?2 7QHHQrBM; Bi2Kb- r`Bi2  `2;mH` 2tT`2bbBQM iQ i2bi
r?2i?2` Mv Q7 i?2 ;Bp2M bm#bi`BM;b Q++m` BM  bi`BM;X h?2 `2;mH`
2tT`2bbBQM b?QmH/ Ki+? QMHv bi`BM;b +QMiBMBM; QM2 Q7 i?2 bm#bi`BM;b
/2b+`B#2/X .Q MQi rQ``v #Qmi rQ`/ #QmM/`B2b mMH2bb 2tTHB+BiHv K2M@
iBQM2/X q?2M vQm` 2tT`2bbBQM rQ`Fb- b22 r?2i?2` vQm +M KF2 Bi Mv
bKHH2`X

R3e
RX +` M/ +i

kX TQT M/ T`QT

jX 72``2i- 72``v- M/ 72```B

9X Mv rQ`/ 2M/BM; BM BQmb

8X  r?Bi2bT+2 +?`+i2` 7QHHQr2/ #v  /Qi- +QKK- +QHQM- Q` b2KB@


+QHQM

eX  rQ`/ HQM;2` i?M bBt H2ii2`b

dX  rQ`/ rBi?Qmi i?2 H2ii2` 2

_272` iQ i?2 i#H2 BM i?2 +?Ti2` bmKK`v 7Q` ?2HTX h2bi 2+? bQHmiBQM
rBi?  72r i2bi bi`BM;bX

ZmQiBM; bivH2
AK;BM2 vQm ?p2 r`Bii2M  biQ`v M/ mb2/ bBM;H2 [mQiiBQM K`Fb i?`Qm;?@
Qmi iQ K`F TB2+2b Q7 /BHQ;m2X LQr vQm rMi iQ `2TH+2 HH i?2 /BHQ;m2
[mQi2b rBi? /Qm#H2 [mQi2b- r?BH2 F22TBM; i?2 bBM;H2 [mQi2b mb2/ BM +QM@
i`+iBQMb HBF2 `2MǶiX
h?BMF Q7  Tii2`M i?i /BbiBM;mBb?2b i?2b2 irQ FBM/b Q7 [mQi2 mb;2
M/ +`7i  +HH iQ i?2 replace K2i?Q/ i?i /Q2b i?2 T`QT2` `2TH+2K2MiX

LmK#2`b ;BM
 b2`B2b Q7 /B;Bib +M #2 Ki+?2/ #v i?2 bBKTH2 `2;mH` 2tT`2bbBQM /\d+/X
q`Bi2 M 2tT`2bbBQM i?i Ki+?2b QMHv Cpa+`BTi@bivH2 MmK#2`bX Ai
Kmbi bmTTQ`i M QTiBQMH KBMmb Q` THmb bB;M BM 7`QMi Q7 i?2 MmK#2`-
i?2 /2+BKH /Qi- M/ 2tTQM2Mi MQiiBQMě5e-3 Q` 1E10ě ;BM rBi? M
QTiBQMH bB;M BM 7`QMi Q7 i?2 2tTQM2MiX HbQ MQi2 i?i Bi Bb MQi M2+2bb`v
7Q` i?2`2 iQ #2 /B;Bib BM 7`QMi Q7 Q` 7i2` i?2 /Qi- #mi i?2 MmK#2` +MMQi
#2  /Qi HQM2X h?i Bb- .5 M/ 5. `2 pHB/ Cpa+`BTi MmK#2`b- #mi 
HQM2 /Qi BbMǶiX

R3d
Ry JQ/mH2b
1p2`v T`Q;`K ?b  b?T2X PM  bKHH b+H2- i?Bb b?T2 Bb /2i2`KBM2/
#v Bib /BpBbBQM BMiQ 7mM+iBQMb M/ i?2 #HQ+Fb BMbB/2 i?Qb2 7mM+iBQMbX S`Q@
;`KK2`b ?p2  HQi Q7 7`22/QK BM i?2 rv i?2v bi`m+im`2 i?2B` T`Q;`KbX
a?T2 7QHHQrb KQ`2 7`QK i?2 ibi2 Q7 i?2 T`Q;`KK2` i?M 7`QK i?2 T`Q@
;`KǶb BMi2M/2/ 7mM+iBQMHBivX
q?2M HQQFBM; i  H`;2` T`Q;`K BM Bib 2MiB`2iv- BM/BpB/mH 7mM+iBQMb
bi`i iQ #H2M/ BMiQ i?2 #+F;`QmM/X am+?  T`Q;`K +M #2 K/2 KQ`2
`2/#H2 B7 r2 ?p2  H`;2` mMBi Q7 Q`;MBxiBQMX
JQ/mH2b /BpB/2 T`Q;`Kb BMiQ +Hmbi2`b Q7 +Q/2 i?i- #v bQK2 +`Bi2`BQM-
#2HQM; iQ;2i?2`X h?Bb +?Ti2` 2tTHQ`2b bQK2 Q7 i?2 #2M2}ib i?i bm+? /B@
pBbBQM T`QpB/2b M/ b?Qrb i2+?MB[m2b 7Q` #mBH/BM; KQ/mH2b BM Cpa+`BTiX

q?v KQ/mH2b ?2HT


h?2`2 `2  MmK#2` Q7 `2bQMb r?v mi?Q`b /BpB/2 i?2B` #QQFb BMiQ +?T@
i2`b M/ b2+iBQMbX h?2b2 /BpBbBQMb KF2 Bi 2bB2` 7Q`  `2/2` iQ b22 ?Qr
i?2 #QQF Bb #mBHi mT M/ iQ }M/ bT2+B}+ T`ib i?i i?2v `2 BMi2`2bi2/ BMX
h?2v HbQ ?2HT i?2 mi?Q` #v T`QpB/BM;  +H2` 7Q+mb 7Q` 2p2`v b2+iBQMX
h?2 #2M2}ib Q7 Q`;MBxBM;  T`Q;`K BMiQ b2p2`H }H2b Q` KQ/mH2b `2
bBKBH`X ai`m+im`2 ?2HTb T2QTH2 r?Q `2MǶi v2i 7KBHB` rBi? i?2 +Q/2
}M/ r?i i?2v `2 HQQFBM; 7Q` M/ KF2b Bi 2bB2` 7Q` i?2 T`Q;`KK2`
iQ F22T i?BM;b i?i `2 `2Hi2/ +HQb2 iQ;2i?2`X
aQK2 T`Q;`Kb `2 2p2M Q`;MBx2/ HQM; i?2 KQ/2H Q7  i`/BiBQMH
i2ti- rBi?  r2HH@/2}M2/ Q`/2` BM r?B+? i?2 `2/2` Bb 2M+Qm`;2/ iQ ;Q
i?`Qm;? i?2 T`Q;`K M/ rBi? HQib Q7 T`Qb2 U+QKK2MibV T`QpB/BM; 
+Q?2`2Mi /2b+`BTiBQM Q7 i?2 +Q/2X h?Bb KF2b `2/BM; i?2 T`Q;`K 
HQi H2bb BMiBKB/iBM;ě`2/BM; mMFMQrM +Q/2 Bb mbmHHv BMiBKB/iBM;ě
#mi ?b i?2 /QrMbB/2 Q7 #2BM; KQ`2 rQ`F iQ b2i mTX Ai HbQ KF2b i?2
T`Q;`K KQ`2 /B{+mHi iQ +?M;2 #2+mb2 T`Qb2 i2M/b iQ #2 KQ`2 iB;?iHv

R33
BMi2`+QMM2+i2/ i?M +Q/2X h?Bb bivH2 Bb +HH2/ HBi2`i2 T`Q;`KKBM;X h?2
dzT`QD2+iǴ +?Ti2`b Q7 i?Bb #QQF +M #2 +QMbB/2`2/ HBi2`i2 T`Q;`KbX
b  ;2M2`H `mH2- bi`m+im`BM; i?BM;b +Qbib 2M2`;vX AM i?2 2`Hv bi;2b Q7
 T`QD2+i- r?2M vQm `2 MQi [mBi2 bm`2 v2i r?i ;Q2b r?2`2 Q` r?i FBM/
Q7 KQ/mH2b i?2 T`Q;`K M22/b i HH- A 2M/Q`b2  KBMBKHBbi- bi`m+im`2H2bb
iiBim/2X Cmbi Tmi 2p2`vi?BM; r?2`2p2` Bi Bb +QMp2MB2Mi iQ Tmi Bi mMiBH
i?2 +Q/2 bi#BHBx2bX h?i rv- vQm rQMǶi #2 rbiBM; iBK2 KQpBM; TB2+2b
Q7 i?2 T`Q;`K #+F M/ 7Q`i?- M/ vQm rQMǶi ++B/2MiHHv HQ+F vQm`b2H7
BMiQ  bi`m+im`2 i?i /Q2b MQi +imHHv }i vQm` T`Q;`KX

LK2bT+BM;
JQbi KQ/2`M T`Q;`KKBM; HM;m;2b ?p2  b+QT2 H2p2H #2ir22M ;HQ#H
U2p2`vQM2 +M b22 BiV M/ HQ+H UQMHv i?Bb 7mM+iBQM +M b22 BiVX Cpa+`BTi
/Q2b MQiX h?mb- #v /27mHi- 2p2`vi?BM; i?i M22/b iQ #2 pBbB#H2 QmibB/2
Q7 i?2 b+QT2 Q7  iQT@H2p2H 7mM+iBQM Bb pBbB#H2 2p2`vr?2`2X
LK2bT+2 TQHHmiBQM- i?2 T`Q#H2K Q7  HQi Q7 mM`2Hi2/ +Q/2 ?pBM; iQ
b?`2  bBM;H2 b2i Q7 ;HQ#H p`B#H2 MK2b- rb K2MiBQM2/ BM *?Ti2` 9-
r?2`2 i?2 Math Q#D2+i rb ;Bp2M b M 2tKTH2 Q7 M Q#D2+i i?i +ib HBF2
 KQ/mH2 #v ;`QmTBM; Ki?@`2Hi2/ 7mM+iBQMHBivX
h?Qm;? Cpa+`BTi T`QpB/2b MQ +imH KQ/mH2 +QMbi`m+i v2i- Q#D2+ib
+M #2 mb2/ iQ +`2i2 Tm#HB+Hv ++2bbB#H2 bm#MK2bT+2b- M/ 7mM+iBQMb
+M #2 mb2/ iQ +`2i2 M BbQHi2/- T`Bpi2 MK2bT+2 BMbB/2 Q7  KQ/mH2X
Gi2` BM i?Bb +?Ti2`- A rBHH /Bb+mbb  rv iQ #mBH/ `2bQM#Hv +QMp2@
MB2Mi- MK2bT+2@BbQHiBM; KQ/mH2b QM iQT Q7 i?2 T`BKBiBp2 +QM+2Tib i?i
Cpa+`BTi ;Bp2b mbX

_2mb2
AM  dz~iǴ T`QD2+i- r?B+? BbMǶi bi`m+im`2/ b  b2i Q7 KQ/mH2b- Bi Bb MQi
TT`2Mi r?B+? T`ib Q7 i?2 +Q/2 `2 M22/2/ iQ mb2  T`iB+mH` 7mM+iBQMX
AM Kv T`Q;`K 7Q` bTvBM; QM Kv 2M2KB2b Ub22 *?Ti2` NV- A r`Qi2 
7mM+iBQM 7Q` `2/BM; +QM};m`iBQM }H2bX A7 A rMi iQ mb2 i?i 7mM+iBQM BM
MQi?2` T`QD2+i- A Kmbi ;Q M/ +QTv Qmi i?2 T`ib Q7 i?2 QH/ T`Q;`K
i?i HQQF HBF2 i?2v `2 `2H2pMi iQ i?2 7mM+iBQMHBiv i?i A M22/ M/ Tbi2
i?2K BMiQ Kv M2r T`Q;`KX h?2M- B7 A }M/  KBbiF2 BM i?i +Q/2- AǶHH
}t Bi QMHv BM r?B+?2p2` T`Q;`K i?i AǶK rQ`FBM; rBi? i i?2 iBK2 M/

R3N
7Q`;2i iQ HbQ }t Bi BM i?2 Qi?2` T`Q;`KX
PM+2 vQm ?p2 HQib Q7 bm+? b?`2/- /mTHB+i2/ TB2+2b Q7 +Q/2- vQm rBHH
}M/ vQm`b2H7 rbiBM;  HQi Q7 iBK2 M/ 2M2`;v QM KQpBM; i?2K `QmM/
M/ F22TBM; i?2K mT@iQ@/i2X
SmiiBM; TB2+2b Q7 7mM+iBQMHBiv i?i biM/ QM i?2B` QrM BMiQ b2T`i2
}H2b M/ KQ/mH2b KF2b i?2K 2bB2` iQ i`+F- mT/i2- M/ b?`2 #2+mb2
HH i?2 p`BQmb TB2+2b Q7 +Q/2 i?i rMi iQ mb2 i?2 KQ/mH2 HQ/ Bi 7`QK
i?2 bK2 +imH }H2X
h?Bb B/2 ;2ib 2p2M KQ`2 TQr2`7mH r?2M i?2 `2HiBQMb #2ir22M KQ/mH2bě
r?B+? Qi?2` KQ/mH2b 2+? KQ/mH2 /2T2M/b QMě`2 2tTHB+BiHv bii2/X
uQm +M i?2M miQKi2 i?2 T`Q+2bb Q7 BMbiHHBM; M/ mT;`/BM; 2ti2`MH
KQ/mH2b UHB#``B2bVX
hFBM; i?Bb B/2 2p2M 7m`i?2`- BK;BM2 M QMHBM2 b2`pB+2 i?i i`+Fb
M/ /Bbi`B#mi2b ?mM/`2/b Q7 i?QmbM/b Q7 bm+? HB#``B2b- HHQrBM; vQm iQ
b2`+? 7Q` i?2 7mM+iBQMHBiv vQm M22/ M/- QM+2 vQm }M/ Bi- b2i mT vQm`
T`QD2+i iQ miQKiB+HHv /QrMHQ/ BiX
h?Bb b2`pB+2 2tBbibX Ai Bb +HH2/ LSJ UMTKDbXQ`;VX LSJ +QMbBbib Q7 M
QMHBM2 /i#b2 Q7 KQ/mH2b M/  iQQH 7Q` /QrMHQ/BM; M/ mT;`/BM;
i?2 KQ/mH2b vQm` T`Q;`K /2T2M/b QMX Ai ;`2r Qmi Q7 LQ/2XDb- i?2
#`Qrb2`H2bb Cpa+`BTi 2MpB`QMK2Mi r2 rBHH /Bb+mbb BM *?Ti2` ky- #mi
+M HbQ #2 mb27mH r?2M T`Q;`KKBM; 7Q` i?2 #`Qrb2`X

.2+QmTHBM;
MQi?2` BKTQ`iMi `QH2 Q7 KQ/mH2b Bb BbQHiBM; TB2+2b Q7 +Q/2 7`QK 2+?
Qi?2`- BM i?2 bK2 rv i?i i?2 Q#D2+i BMi2`7+2b 7`QK *?Ti2` e /QX 
r2HH@/2bB;M2/ KQ/mH2 rBHH T`QpB/2 M BMi2`7+2 7Q` 2ti2`MH +Q/2 iQ mb2X
b i?2 KQ/mH2 ;2ib mT/i2/ rBi? #m; }t2b M/ M2r 7mM+iBQMHBiv- i?2
2tBbiBM; BMi2`7+2 bivb i?2 bK2 UBi Bb bi#H2V bQ i?i Qi?2` KQ/mH2b +M
mb2 i?2 M2r- BKT`Qp2/ p2`bBQM rBi?Qmi Mv +?M;2b iQ i?2Kb2Hp2bX
LQi2 i?i  bi#H2 BMi2`7+2 /Q2b MQi K2M MQ M2r 7mM+iBQMb- K2i?Q/b-
Q` p`B#H2b `2 //2/X Ai Dmbi K2Mb i?i 2tBbiBM; 7mM+iBQMHBiv BbMǶi
`2KQp2/ M/ Bib K2MBM; Bb MQi +?M;2/X
 ;QQ/ KQ/mH2 BMi2`7+2 b?QmH/ HHQr i?2 KQ/mH2 iQ ;`Qr rBi?Qmi
#`2FBM; i?2 QH/ BMi2`7+2X h?Bb K2Mb 2tTQbBM; b 72r Q7 i?2 KQ/mH2Ƕb
BMi2`MH +QM+2Tib b TQbbB#H2 r?BH2 HbQ KFBM; i?2 dzHM;m;2Ǵ i?i i?2
BMi2`7+2 2tTQb2b TQr2`7mH M/ ~2tB#H2 2MQm;? iQ #2 TTHB+#H2 BM  rB/2

RNy
`M;2 Q7 bBimiBQMbX
6Q` BMi2`7+2b i?i 2tTQb2  bBM;H2- 7Q+mb2/ +QM+2Ti- bm+? b  +QM};m@
`iBQM }H2 `2/2`- i?Bb /2bB;M +QK2b Mim`HHvX 6Q` Qi?2`b- bm+? b  i2ti
2/BiQ`- r?B+? ?b KMv /Bz2`2Mi bT2+ib i?i 2ti2`MH +Q/2 KB;?i M22/
iQ ++2bb U+QMi2Mi- bivHBM;- mb2` +iBQMb- M/ bQ QMV- Bi `2[mB`2b +`27mH
/2bB;MX

lbBM; 7mM+iBQMb b MK2bT+2b


6mM+iBQMb `2 i?2 QMHv i?BM;b BM Cpa+`BTi i?i +`2i2  M2r b+QT2X aQ
B7 r2 rMi Qm` KQ/mH2b iQ ?p2 i?2B` QrM b+QT2- r2 rBHH ?p2 iQ #b2
i?2K QM 7mM+iBQMbX
*QMbB/2` i?Bb i`BpBH KQ/mH2 7Q` bbQ+BiBM; MK2b rBi? /v@Q7@i?2@
r22F MmK#2`b- b `2im`M2/ #v  Date Q#D2+iǶb getDay K2i?Q/,
var names = [" Sunday " , " Monday " , " Tuesday ", " Wednesday ",
" Thursday " , " Friday " , " Saturday "];
function dayName ( number ) {
return names [ number ];
}

console . log ( dayName (1) ) ;


// → Monday

h?2 dayName 7mM+iBQM Bb T`i Q7 i?2 KQ/mH2Ƕb BMi2`7+2- #mi i?2 names p`B@
#H2 Bb MQiX q2 rQmH/ T`272` MQi iQ bTBHH Bi BMiQ i?2 ;HQ#H b+QT2X
q2 +M /Q i?Bb,
var dayName = function () {
var names = [" Sunday " , " Monday ", " Tuesday " , " Wednesday " ,
" Thursday " , " Friday " , " Saturday "];
return function ( number ) {
return names [ number ];
};
}() ;

console . log ( dayName (3) ) ;


// → Wednesday

LQr names Bb  HQ+H p`B#H2 BM M UmMMK2/V 7mM+iBQMX h?Bb 7mM+iBQM Bb

RNR
+`2i2/ M/ BKK2/Bi2Hv +HH2/- M/ Bib `2im`M pHm2 Ui?2 +imH dayName
7mM+iBQMV Bb biQ`2/ BM  p`B#H2X q2 +QmH/ ?p2 T;2b M/ T;2b Q7 +Q/2
BM i?Bb 7mM+iBQM- rBi? Ryy HQ+H p`B#H2b- M/ i?2v rQmH/ HH #2 BMi2`MH
iQ Qm` KQ/mH2ěpBbB#H2 iQ i?2 KQ/mH2 Bib2H7 #mi MQi iQ QmibB/2 +Q/2X
q2 +M mb2  bBKBH` Tii2`M iQ BbQHi2 +Q/2 7`QK i?2 QmibB/2 rQ`H/
2MiB`2HvX h?2 7QHHQrBM; KQ/mH2 HQ;b  pHm2 iQ i?2 +QMbQH2 #mi /Q2b MQi
+imHHv T`QpB/2 Mv pHm2b 7Q` Qi?2` KQ/mH2b iQ mb2,
( function () {
function square ( x ) { return x * x ; }
var hundred = 100;

console . log ( square ( hundred )) ;


}) () ;
// → 10000

h?Bb +Q/2 bBKTHv QmiTmib i?2 b[m`2 Q7 Ryy- #mi BM i?2 `2H rQ`H/ Bi +QmH/
#2  KQ/mH2 i?i //b  K2i?Q/ iQ bQK2 T`QiQivT2 Q` b2ib mT  rB/;2i
QM  r2# T;2X Ai Bb r`TT2/ BM  7mM+iBQM iQ T`2p2Mi i?2 p`B#H2b Bi
mb2b BMi2`MHHv 7`QK TQHHmiBM; i?2 ;HQ#H b+QT2X
q?v /B/ r2 r`T i?2 MK2bT+2 7mM+iBQM BM  TB` Q7 T`2Mi?2b2b\
h?Bb ?b iQ /Q rBi?  [mB`F BM Cpa+`BTiǶb bvMitX A7 M 2tT`2bbBQM
bi`ib rBi? i?2 F2vrQ`/ function- Bi Bb  7mM+iBQM 2tT`2bbBQMX >Qr2p2`-
B7  bii2K2Mi bi`ib rBi? function- Bi Bb  7mM+iBQM /2+H`iBQM- r?B+?
`2[mB`2b  MK2 M/- MQi #2BM; M 2tT`2bbBQM- +MMQi #2 +HH2/ #v r`BiBM;
T`2Mi?2b2b 7i2` BiX uQm +M i?BMF Q7 i?2 2ti` r`TTBM; T`2Mi?2b2b b
 i`B+F iQ 7Q`+2 i?2 7mM+iBQM iQ #2 BMi2`T`2i2/ b M 2tT`2bbBQMX

P#D2+ib b BMi2`7+2b
LQr BK;BM2 i?i r2 rMi iQ // MQi?2` 7mM+iBQM iQ Qm` /v@Q7@i?2@
r22F KQ/mH2- QM2 i?i ;Q2b 7`QK  /v MK2 iQ  MmK#2`X q2 +MǶi
bBKTHv `2im`M i?2 7mM+iBQM MvKQ`2 #mi Kmbi r`T i?2 irQ 7mM+iBQMb BM
M Q#D2+iX
var weekDay = function () {
var names = [" Sunday " , " Monday ", " Tuesday " , " Wednesday " ,
" Thursday " , " Friday " , " Saturday "];
return {

RNk
name : function ( number ) { return names [ number ]; },
number : function ( name ) { return names . indexOf ( name ) ; }
};
}() ;

console . log ( weekDay . name ( weekDay . number (" Sunday ") ) ) ;


// → Sunday

6Q` #B;;2` KQ/mH2b- ;i?2`BM; HH i?2 2tTQ`i2/ pHm2b BMiQ M Q#D2+i i
i?2 2M/ Q7 i?2 7mM+iBQM #2+QK2b rFr`/ bBM+2 KMv Q7 i?2 2tTQ`i2/
7mM+iBQMb `2 HBF2Hv iQ #2 #B; M/ vQmǶ/ T`272` iQ r`Bi2 i?2K bQK2r?2`2
2Hb2- M2` `2Hi2/ BMi2`MH +Q/2X  +QMp2MB2Mi Hi2`MiBp2 Bb iQ /2+H`2
M Q#D2+i U+QMp2MiBQMHHv MK2/ exportsV M/ // T`QT2`iB2b iQ i?i
r?2M2p2` r2 `2 /2}MBM; bQK2i?BM; i?i M22/b iQ #2 2tTQ`i2/X AM i?2
7QHHQrBM; 2tKTH2- i?2 KQ/mH2 7mM+iBQM iF2b Bib BMi2`7+2 Q#D2+i b M
`;mK2Mi- HHQrBM; +Q/2 QmibB/2 Q7 i?2 7mM+iBQM iQ +`2i2 Bi M/ biQ`2
Bi BM  p`B#H2X UPmibB/2 Q7  7mM+iBQM- this `272`b iQ i?2 ;HQ#H b+QT2
Q#D2+iXV
( function ( exports ) {
var names = [" Sunday " , " Monday ", " Tuesday " , " Wednesday " ,
" Thursday " , " Friday " , " Saturday "];

exports . name = function ( number ) {


return names [ number ];
};
exports . number = function ( name ) {
return names . indexOf ( name ) ;
};
}) ( this . weekDay = {}) ;

console . log ( weekDay . name ( weekDay . number (" Saturday ") ) ) ;


// → Saturday

.2i+?BM; 7`QK i?2 ;HQ#H b+QT2


h?2 T`2pBQmb Tii2`M Bb +QKKQMHv mb2/ #v Cpa+`BTi KQ/mH2b BMi2M/2/
7Q` i?2 #`Qrb2`X h?2 KQ/mH2 rBHH +HBK  bBM;H2 ;HQ#H p`B#H2 M/ r`T
Bib +Q/2 BM  7mM+iBQM BM Q`/2` iQ ?p2 Bib QrM T`Bpi2 MK2bT+2X "mi

RNj
i?Bb Tii2`M biBHH +mb2b T`Q#H2Kb B7 KmHiBTH2 KQ/mH2b ?TT2M iQ +HBK
i?2 bK2 MK2 Q` B7 vQm rMi iQ HQ/ irQ p2`bBQMb Q7  KQ/mH2 HQM;bB/2
2+? Qi?2`X
qBi?  HBiiH2 THmK#BM;- r2 +M +`2i2  bvbi2K i?i HHQrb QM2 KQ/mH2
iQ /B`2+iHv bF 7Q` i?2 BMi2`7+2 Q#D2+i Q7 MQi?2` KQ/mH2- rBi?Qmi ;QBM;
i?`Qm;? i?2 ;HQ#H b+QT2X Pm` ;QH Bb  require 7mM+iBQM i?i- r?2M
;Bp2M  KQ/mH2 MK2- rBHH HQ/ i?i KQ/mH2Ƕb }H2 U7`QK /BbF Q` i?2 q2#-
/2T2M/BM; QM i?2 THi7Q`K r2 `2 `mMMBM; QMV M/ `2im`M i?2 TT`QT`Bi2
BMi2`7+2 pHm2X
h?Bb TT`Q+? bQHp2b i?2 T`Q#H2Kb K2MiBQM2/ T`2pBQmbHv M/ ?b i?2
//2/ #2M2}i Q7 KFBM; vQm` T`Q;`KǶb /2T2M/2M+B2b 2tTHB+Bi- KFBM;
Bi ?`/2` iQ ++B/2MiHHv KF2 mb2 Q7 bQK2 KQ/mH2 rBi?Qmi biiBM; i?i
vQm M22/ BiX
6Q` require r2 M22/ irQ i?BM;bX 6B`bi- r2 rMi  7mM+iBQM readFile-
r?B+? `2im`Mb i?2 +QMi2Mi Q7  ;Bp2M }H2 b  bi`BM;X U bBM;H2 bm+?
7mM+iBQM Bb MQi T`2b2Mi BM biM/`/ Cpa+`BTi- #mi /Bz2`2Mi Cpa+`BTi
2MpB`QMK2Mib- bm+? b i?2 #`Qrb2` M/ LQ/2XDb- T`QpB/2 i?2B` QrM rvb
Q7 ++2bbBM; }H2bX 6Q` MQr- H2iǶb Dmbi T`2i2M/ r2 ?p2 i?Bb 7mM+iBQMXV
a2+QM/- r2 M22/ iQ #2 #H2 iQ +imHHv 2t2+mi2 i?Bb bi`BM; b Cpa+`BTi
+Q/2X

1pHmiBM; /i b +Q/2


h?2`2 `2 b2p2`H rvb iQ iF2 /i U bi`BM; Q7 +Q/2V M/ `mM Bi b T`i
Q7 i?2 +m``2Mi T`Q;`KX
h?2 KQbi Q#pBQmb rv Bb i?2 bT2+BH QT2`iQ` eval- r?B+? rBHH 2t2+mi2
 bi`BM; Q7 +Q/2 BM i?2 +m``2Mi b+QT2X h?Bb Bb mbmHHv  #/ B/2 #2+mb2
Bi #`2Fb bQK2 Q7 i?2 bM2 T`QT2`iB2b i?i b+QT2b MQ`KHHv ?p2- bm+? b
#2BM; BbQHi2/ 7`QK i?2 QmibB/2 rQ`H/X
function evalAndReturnX ( code ) {
eval ( code ) ;
return x ;
}

console . log ( evalAndReturnX (" var x = 2") ) ;


// → 2

RN9
 #2ii2` rv Q7 BMi2`T`2iBM; /i b +Q/2 Bb iQ mb2 i?2 Function +QMbi`m+@
iQ`X h?Bb iF2b irQ `;mK2Mib,  bi`BM; +QMiBMBM;  +QKK@b2T`i2/
HBbi Q7 `;mK2Mi MK2b M/  bi`BM; +QMiBMBM; i?2 7mM+iBQMǶb #Q/vX
var plusOne = new Function (" n ", " return n + 1;") ;
console . log ( plusOne (4) ) ;
// → 5

h?Bb Bb T`2+Bb2Hv r?i r2 M22/ 7Q` Qm` KQ/mH2bX q2 +M r`T  KQ/mH2Ƕb
+Q/2 BM  7mM+iBQM- rBi? i?i 7mM+iBQMǶb b+QT2 #2+QKBM; Qm` KQ/mH2
b+QT2X

_2[mB`2
h?2 7QHHQrBM; Bb  KBMBKH BKTH2K2MiiBQM Q7 require,
function require ( name ) {
var code = new Function (" exports ", readFile ( name ) ) ;
var exports = {};
code ( exports ) ;
return exports ;
}

console . log ( require (" weekDay ") . name (1) ) ;


// → Monday

aBM+2 i?2 new Function +QMbi`m+iQ` r`Tb i?2 KQ/mH2 +Q/2 BM  7mM+iBQM-
r2 /QMǶi ?p2 iQ r`Bi2  r`TTBM; MK2bT+2 7mM+iBQM BM i?2 KQ/mH2 }H2
Bib2H7X M/ bBM+2 r2 KF2 exports M `;mK2Mi iQ i?2 KQ/mH2 7mM+iBQM-
i?2 KQ/mH2 /Q2b MQi ?p2 iQ /2+H`2 BiX h?Bb `2KQp2b  HQi Q7 +Hmii2`
7`QK Qm` 2tKTH2 KQ/mH2X
var names = [" Sunday " , " Monday " , " Tuesday ", " Wednesday ",
" Thursday " , " Friday " , " Saturday "];

exports . name = function ( number ) {


return names [ number ];
};
exports . number = function ( name ) {
return names . indexOf ( name );
};

RN8
q?2M mbBM; i?Bb Tii2`M-  KQ/mH2 ivTB+HHv bi`ib rBi?  72r p`B#H2
/2+H`iBQMb i?i HQ/ i?2 KQ/mH2b Bi /2T2M/b QMX
var weekDay = require (" weekDay ") ;
var today = require (" today ") ;

console . log ( weekDay . name ( today . dayNumber () ) ) ;

h?2 bBKTHBbiB+ BKTH2K2MiiBQM Q7 require ;Bp2M T`2pBQmbHv ?b b2p2`H


T`Q#H2KbX 6Q` QM2- Bi rBHH HQ/ M/ `mM  KQ/mH2 2p2`v iBK2 Bi Bb require
/- bQ B7 b2p2`H KQ/mH2b ?p2 i?2 bK2 /2T2M/2M+v Q`  require +HH Bb
Tmi BMbB/2  7mM+iBQM i?i rBHH #2 +HH2/ KmHiBTH2 iBK2b- iBK2 M/ 2M2`;v
rBHH #2 rbi2/X
h?Bb +M #2 bQHp2/ #v biQ`BM; i?2 KQ/mH2b i?i ?p2 H`2/v #22M
HQ/2/ BM M Q#D2+i M/ bBKTHv `2im`MBM; i?2 2tBbiBM; pHm2 r?2M QM2 Bb
HQ/2/ KmHiBTH2 iBK2bX
h?2 b2+QM/ T`Q#H2K Bb i?i Bi Bb MQi TQbbB#H2 7Q`  KQ/mH2 iQ /B`2+iHv
2tTQ`i  pHm2 Qi?2` i?M i?2 exports Q#D2+i- bm+? b  7mM+iBQMX 6Q`
2tKTH2-  KQ/mH2 KB;?i rMi iQ 2tTQ`i QMHv i?2 +QMbi`m+iQ` Q7 i?2
Q#D2+i ivT2 Bi /2}M2bX _B;?i MQr- Bi +MMQi /Q i?i #2+mb2 require
Hrvb mb2b i?2 exports Q#D2+i Bi +`2i2b b i?2 2tTQ`i2/ pHm2X
h?2 i`/BiBQMH bQHmiBQM 7Q` i?Bb Bb iQ T`QpB/2 KQ/mH2b rBi? MQi?2`
p`B#H2- module- r?B+? Bb M Q#D2+i i?i ?b  T`QT2`iv exportsX h?Bb
T`QT2`iv BMBiBHHv TQBMib i i?2 2KTiv Q#D2+i +`2i2/ #v require #mi +M
#2 Qp2`r`Bii2M rBi? MQi?2` pHm2 BM Q`/2` iQ 2tTQ`i bQK2i?BM; 2Hb2X
function require ( name ) {
if ( name in require . cache )
return require . cache [ name ];

var code = new Function (" exports , module " , readFile ( name ) ) ;
var exports = {} , module = { exports : exports };
code ( exports , module ) ;

require . cache [ name ] = module . exports ;


return module . exports ;
}
require . cache = Object . create ( null );

RNe
q2 MQr ?p2  KQ/mH2 bvbi2K i?i mb2b  bBM;H2 ;HQ#H p`B#H2 UrequireV
iQ HHQr KQ/mH2b iQ }M/ M/ mb2 2+? Qi?2` rBi?Qmi ;QBM; i?`Qm;? i?2
;HQ#H b+QT2X
h?Bb bivH2 Q7 KQ/mH2 bvbi2K Bb +HH2/ *QKKQMCa KQ/mH2b- 7i2` i?2
Tb2m/Q@biM/`/ i?i }`bi bT2+B}2/ BiX Ai Bb #mBHi BMiQ i?2 LQ/2XDb bvb@
i2KX _2H BKTH2K2MiiBQMb /Q  HQi KQ`2 i?M i?2 2tKTH2 A b?Qr2/X
JQbi BKTQ`iMiHv- i?2v ?p2  Km+? KQ`2 BMi2HHB;2Mi rv Q7 ;QBM; 7`QK
 KQ/mH2 MK2 iQ M +imH TB2+2 Q7 +Q/2- HHQrBM; #Qi? Ti?MK2b `2H@
iBp2 iQ i?2 +m``2Mi }H2 M/ KQ/mH2 MK2b i?i TQBMi /B`2+iHv iQ HQ+HHv
BMbiHH2/ KQ/mH2bX

aHQr@HQ/BM; KQ/mH2b
h?Qm;? Bi Bb TQbbB#H2 iQ mb2 i?2 *QKKQMCa KQ/mH2 bivH2 r?2M r`BiBM;
Cpa+`BTi 7Q` i?2 #`Qrb2`- Bi Bb bQK2r?i BMpQHp2/X h?2 `2bQM 7Q` i?Bb
Bb i?i `2/BM;  }H2 UKQ/mH2V 7`QK i?2 q2# Bb  HQi bHQr2` i?M `2/BM;
Bi 7`QK i?2 ?`/ /BbFX q?BH2  b+`BTi Bb `mMMBM; BM i?2 #`Qrb2`- MQi?BM;
2Hb2 +M ?TT2M iQ i?2 r2#bBi2 QM r?B+? Bi `mMb- 7Q` `2bQMb i?i rBHH
#2+QK2 +H2` BM *?Ti2` R9X h?Bb K2Mb i?i B7 2p2`v require +HH r2Mi
M/ 72i+?2/ bQK2i?BM; 7`QK bQK2 7`rv r2# b2`p2`- i?2 T;2 rQmH/
7`22x2 7Q`  TBM7mHHv HQM; iBK2 r?BH2 HQ/BM; Bib b+`BTibX
PM2 rv iQ rQ`F `QmM/ i?Bb T`Q#H2K Bb iQ `mM  T`Q;`K HBF2 "`Qrb2`@
B7v QM vQm` +Q/2 #27Q`2 vQm b2`p2 Bi QM  r2# T;2X h?Bb rBHH HQQF 7Q`
+HHb iQ require- `2bQHp2 HH /2T2M/2M+B2b- M/ ;i?2` i?2 M22/2/ +Q/2 BMiQ
 bBM;H2 #B; }H2X h?2 r2#bBi2 Bib2H7 +M bBKTHv HQ/ i?Bb }H2 iQ ;2i HH i?2
KQ/mH2b Bi M22/bX
MQi?2` bQHmiBQM Bb iQ r`T i?2 +Q/2 i?i KF2b mT vQm` KQ/mH2 BM 
7mM+iBQM bQ i?i i?2 KQ/mH2 HQ/2` +M }`bi HQ/ Bib /2T2M/2M+B2b BM i?2
#+F;`QmM/ M/ i?2M +HH i?2 7mM+iBQM- BMBiBHBxBM; i?2 KQ/mH2- r?2M i?2
/2T2M/2M+B2b ?p2 #22M HQ/2/X h?i Bb r?i i?2 bvM+?`QMQmb JQ/mH2
.2}MBiBQM UJ.V KQ/mH2 bvbi2K /Q2bX
Pm` i`BpBH T`Q;`K rBi? /2T2M/2M+B2b rQmH/ HQQF HBF2 i?Bb BM J.,
define ([" weekDay " , " today "] , function ( weekDay , today ) {
console . log ( weekDay . name ( today . dayNumber () ) ) ;
}) ;

RNd
h?2 define 7mM+iBQM Bb +2Mi`H iQ i?Bb TT`Q+?X Ai iF2b }`bi M ``v
Q7 KQ/mH2 MK2b M/ i?2M  7mM+iBQM i?i iF2b QM2 `;mK2Mi 7Q` 2+?
/2T2M/2M+vX Ai rBHH HQ/ i?2 /2T2M/2M+B2b UB7 i?2v ?p2MǶi H`2/v #22M
HQ/2/V BM i?2 #+F;`QmM/- HHQrBM; i?2 T;2 iQ +QMiBMm2 rQ`FBM; r?BH2
i?2 }H2b `2 #2BM; 72i+?2/X PM+2 HH /2T2M/2M+B2b `2 HQ/2/- define rBHH
+HH i?2 7mM+iBQM Bi rb ;Bp2M- rBi? i?2 BMi2`7+2b Q7 i?Qb2 /2T2M/2M+B2b
b `;mK2MibX
h?2 KQ/mH2b i?i `2 HQ/2/ i?Bb rv Kmbi i?2Kb2Hp2b +QMiBM  +HH
iQ defineX h?2 pHm2 mb2/ b i?2B` BMi2`7+2 Bb r?i2p2` rb `2im`M2/ #v
i?2 7mM+iBQM Tbb2/ iQ defineX >2`2 Bb i?2 weekDay KQ/mH2 ;BM,
define ([] , function () {
var names = [" Sunday " , " Monday ", " Tuesday " , " Wednesday " ,
" Thursday " , " Friday " , " Saturday "];
return {
name : function ( number ) { return names [ number ]; },
number : function ( name ) { return names . indexOf ( name ) ; }
};
}) ;

hQ #2 #H2 iQ b?Qr  KBMBKH BKTH2K2MiiBQM Q7 define- r2 rBHH T`2i2M/


r2 ?p2  backgroundReadFile 7mM+iBQM i?i iF2b  }H2MK2 M/  7mM+iBQM
M/ +HHb i?2 7mM+iBQM rBi? i?2 +QMi2Mi Q7 i?2 }H2 b bQQM b Bi ?b }MBb?2/
HQ/BM; BiX U*?Ti2` Rd rBHH 2tTHBM ?Qr iQ r`Bi2 i?i 7mM+iBQMXV
6Q` i?2 Tm`TQb2 Q7 F22TBM; i`+F Q7 KQ/mH2b r?BH2 i?2v `2 #2BM;
HQ/2/- i?2 BKTH2K2MiiBQM Q7 define rBHH mb2 Q#D2+ib i?i /2b+`B#2 i?2
bii2 Q7 KQ/mH2b- i2HHBM; mb r?2i?2` i?2v `2 pBH#H2 v2i M/ T`QpB/BM;
i?2B` BMi2`7+2 r?2M i?2v `2X
h?2 getModule 7mM+iBQM- r?2M ;Bp2M  MK2- rBHH `2im`M bm+? M Q#D2+i
M/ 2Mbm`2 i?i i?2 KQ/mH2 Bb b+?2/mH2/ iQ #2 HQ/2/X Ai mb2b  ++?2
Q#D2+i iQ pQB/ HQ/BM; i?2 bK2 KQ/mH2 irB+2X
var defineCache = Object . create ( null );
var currentMod = null ;

function getModule ( name ) {


if ( name in defineCache )
return defineCache [ name ];

var module = { exports : null ,

RN3
loaded : false ,
onLoad : []};
defineCache [ name ] = module ;
backgroundReadFile ( name , function ( code ) {
currentMod = module ;
new Function ("" , code ) () ;
}) ;
return module ;
}

q2 bbmK2 i?2 HQ/2/ }H2 HbQ +QMiBMb  UbBM;H2V +HH iQ defineX h?2
currentMod p`B#H2 Bb mb2/ iQ i2HH i?Bb +HH #Qmi i?2 KQ/mH2 Q#D2+i i?i
Bb +m``2MiHv #2BM; HQ/2/ bQ i?i Bi +M mT/i2 i?Bb Q#D2+i r?2M Bi }MBb?2b
HQ/BM;X q2 rBHH +QK2 #+F iQ i?Bb K2+?MBbK BM  KQK2MiX
h?2 define 7mM+iBQM Bib2H7 mb2b getModule iQ 72i+? Q` +`2i2 i?2 KQ/mH2
Q#D2+ib 7Q` i?2 +m``2Mi KQ/mH2Ƕb /2T2M/2M+B2bX Aib ibF Bb iQ b+?2/mH2
i?2 moduleFunction Ui?2 7mM+iBQM i?i +QMiBMb i?2 KQ/mH2Ƕb +imH +Q/2V
iQ #2 `mM r?2M2p2` i?Qb2 /2T2M/2M+B2b `2 HQ/2/X 6Q` i?Bb Tm`TQb2- Bi
/2}M2b  7mM+iBQM whenDepsLoaded i?i Bb //2/ iQ i?2 onLoad ``v Q7 HH
/2T2M/2M+B2b i?i `2 MQi v2i HQ/2/X h?Bb 7mM+iBQM BKK2/Bi2Hv `2im`Mb
B7 i?2`2 `2 biBHH mMHQ/2/ /2T2M/2M+B2b- bQ Bi rBHH /Q +imH rQ`F QMHv
QM+2- r?2M i?2 Hbi /2T2M/2M+v ?b }MBb?2/ HQ/BM;X Ai Bb HbQ +HH2/
BKK2/Bi2Hv- 7`QK define Bib2H7- BM +b2 i?2`2 `2 MQ /2T2M/2M+B2b i?i
M22/ iQ #2 HQ/2/X
function define ( depNames , moduleFunction ) {
var myMod = currentMod ;
var deps = depNames . map ( getModule ) ;

deps . forEach ( function ( mod ) {


if (! mod . loaded )
mod . onLoad . push ( whenDepsLoaded );
}) ;

function whenDepsLoaded () {
if (! deps . every ( function ( m ) { return m . loaded ; }) )
return ;

var args = deps . map ( function ( m ) { return m. exports ; }) ;


var exports = moduleFunction . apply ( null , args );
if ( myMod ) {

RNN
myMod . exports = exports ;
myMod . loaded = true ;
myMod . onLoad . forEach ( function (f) { f () ; }) ;
}
}
whenDepsLoaded () ;
}

q?2M HH /2T2M/2M+B2b `2 pBH#H2- whenDepsLoaded +HHb i?2 7mM+iBQM i?i
?QH/b i?2 KQ/mH2- ;BpBM; Bi i?2 /2T2M/2M+B2bǶ BMi2`7+2b b `;mK2MibX
h?2 }`bi i?BM; define /Q2b Bb biQ`2 i?2 pHm2 i?i currentMod ?/ r?2M
Bi rb +HH2/ BM  p`B#H2 myModX _2K2K#2` i?i getModule- Dmbi #27Q`2
2pHmiBM; i?2 +Q/2 7Q`  KQ/mH2- biQ`2/ i?2 +Q``2bTQM/BM; KQ/mH2 Q#D2+i
BM currentModX h?Bb HHQrb whenDepsLoaded iQ biQ`2 i?2 `2im`M pHm2 Q7 i?2
KQ/mH2 7mM+iBQM BM i?i KQ/mH2Ƕb exports T`QT2`iv- b2i i?2 KQ/mH2Ƕb loaded
T`QT2`iv iQ i`m2- M/ +HH HH i?2 7mM+iBQMb i?i `2 rBiBM; 7Q` i?2 KQ/mH2
iQ HQ/X
h?Bb +Q/2 Bb  HQi ?`/2` iQ 7QHHQr i?M i?2 require 7mM+iBQMX Aib 2t@
2+miBQM /Q2b MQi 7QHHQr  bBKTH2- T`2/B+i#H2 Ti?X AMbi2/- KmHiBTH2
QT2`iBQMb `2 b2i mT iQ ?TT2M i bQK2 mMbT2+B}2/ iBK2 BM i?2 7mim`2-
r?B+? Q#b+m`2b i?2 rv i?2 +Q/2 2t2+mi2bX
 `2H J. BKTH2K2MiiBQM Bb- ;BM- [mBi2  HQi KQ`2 +H2p2` #Qmi
`2bQHpBM; KQ/mH2 MK2b iQ +imH l_Gb M/ ;2M2`HHv KQ`2 `Q#mbi i?M
i?2 QM2 b?QrM T`2pBQmbHvX h?2 _2[mB`2Ca U`2[mB`2DbXQ`;V T`QD2+i T`QpB/2b
 TQTmH` BKTH2K2MiiBQM Q7 i?Bb bivH2 Q7 KQ/mH2 HQ/2`X

AMi2`7+2 /2bB;M
.2bB;MBM; BMi2`7+2b 7Q` KQ/mH2b M/ Q#D2+i ivT2b Bb QM2 Q7 i?2 bm#iH2`
bT2+ib Q7 T`Q;`KKBM;X Mv MQMi`BpBH TB2+2 Q7 7mM+iBQMHBiv +M #2
KQ/2H2/ BM p`BQmb rvbX 6BM/BM;  rv i?i rQ`Fb r2HH `2[mB`2b BMbB;?i
M/ 7Q`2bB;?iX
h?2 #2bi rv iQ H2`M i?2 pHm2 Q7 ;QQ/ BMi2`7+2 /2bB;M Bb iQ mb2 HQib
Q7 BMi2`7+2běbQK2 ;QQ/- bQK2 #/X 1tT2`B2M+2 rBHH i2+? vQm r?i
rQ`Fb M/ r?i /Q2bMǶiX L2p2` bbmK2 i?i  TBM7mH BMi2`7+2 Bb dzDmbi
i?2 rv Bi BbǴX 6Bt Bi- Q` r`T Bi BM  M2r BMi2`7+2 i?i rQ`Fb #2ii2` 7Q`
vQmX

kyy
S`2/B+i#BHBiv
A7 T`Q;`KK2`b +M T`2/B+i i?2 rv vQm` BMi2`7+2 rQ`Fb- i?2v UQ` vQmV
rQMǶi ;2i bB/2i`+F2/ b Q7i2M #v i?2 M22/ iQ HQQF mT ?Qr iQ mb2 BiX h?mb-
i`v iQ 7QHHQr +QMp2MiBQMbX q?2M i?2`2 Bb MQi?2` KQ/mH2 Q` T`i Q7 i?2
biM/`/ Cpa+`BTi 2MpB`QMK2Mi i?i /Q2b bQK2i?BM; bBKBH` iQ r?i
vQm `2 BKTH2K2MiBM;- Bi KB;?i #2  ;QQ/ B/2 iQ KF2 vQm` BMi2`7+2
`2b2K#H2 i?2 2tBbiBM; BMi2`7+2X h?i rv- BiǶHH 722H 7KBHB` iQ T2QTH2
r?Q FMQr i?2 2tBbiBM; BMi2`7+2X
MQi?2` `2 r?2`2 T`2/B+i#BHBiv Bb BKTQ`iMi Bb i?2 +imH #2?pBQ` Q7
vQm` +Q/2X Ai +M #2 i2KTiBM; iQ KF2 M mMM2+2bb`BHv +H2p2` BMi2`7+2
rBi? i?2 DmbiB}+iBQM i?i BiǶb KQ`2 +QMp2MB2Mi iQ mb2X 6Q` 2tKTH2- vQm
+QmH/ ++2Ti HH FBM/b Q7 /Bz2`2Mi ivT2b M/ +QK#BMiBQMb Q7 `;mK2Mib
M/ /Q i?2 dz`B;?i i?BM;Ǵ 7Q` HH Q7 i?2KX P` vQm +QmH/ T`QpB/2 /Qx2Mb Q7
bT2+BHBx2/ +QMp2MB2M+2 7mM+iBQMb i?i T`QpB/2 bHB;?iHv /Bz2`2Mi ~pQ`b
Q7 vQm` KQ/mH2Ƕb 7mM+iBQMHBivX h?2b2 KB;?i KF2 +Q/2 i?i #mBH/b QM
vQm` BMi2`7+2 bHB;?iHv b?Q`i2`- #mi i?2v rBHH HbQ KF2 Bi Km+? ?`/2`
7Q` T2QTH2 iQ #mBH/  +H2` K2MiH KQ/2H Q7 i?2 KQ/mH2Ƕb #2?pBQ`X

*QKTQb#BHBiv
AM vQm` BMi2`7+2b- i`v iQ mb2 i?2 bBKTH2bi /i bi`m+im`2b TQbbB#H2 M/
KF2 7mM+iBQMb /Q  bBM;H2- +H2` i?BM;X q?2M2p2` T`+iB+H- KF2 i?2K
Tm`2 7mM+iBQMb Ub22 *?Ti2` jVX
6Q` 2tKTH2- Bi Bb MQi mM+QKKQM 7Q` KQ/mH2b iQ T`QpB/2 i?2B` QrM
``v@HBF2 +QHH2+iBQM Q#D2+ib- rBi? i?2B` QrM BMi2`7+2 7Q` +QmMiBM; M/
2ti`+iBM; 2H2K2MibX am+? Q#D2+ib rQMǶi ?p2 map Q` forEach K2i?Q/b-
M/ Mv 2tBbiBM; 7mM+iBQM i?i 2tT2+ib  `2H ``v rQMǶi #2 #H2 iQ
rQ`F rBi? i?2KX h?Bb Bb M 2tKTH2 Q7 TQQ` +QKTQb#BHBivěi?2 KQ/mH2
+MMQi #2 2bBHv +QKTQb2/ rBi? Qi?2` +Q/2X
PM2 2tKTH2 rQmH/ #2  KQ/mH2 7Q` bT2HH@+?2+FBM; i2ti- r?B+? r2
KB;?i M22/ r?2M r2 rMi iQ r`Bi2  i2ti 2/BiQ`X h?2 bT2HH@+?2+F2` +QmH/
#2 K/2 iQ QT2`i2 /B`2+iHv QM r?B+?2p2` +QKTHB+i2/ /i bi`m+im`2b
i?2 2/BiQ` mb2b M/ /B`2+iHv +HH BMi2`MH 7mM+iBQMb BM i?2 2/BiQ` iQ ?p2
i?2 mb2` +?QQb2 #2ir22M bT2HHBM; bm;;2biBQMbX A7 r2 ;Q i?i rv- i?2
KQ/mH2 +MMQi #2 mb2/ rBi? Mv Qi?2` T`Q;`KbX PM i?2 Qi?2` ?M/-
B7 r2 /2}M2 i?2 bT2HH@+?2+FBM; BMi2`7+2 bQ i?i vQm +M Tbb Bi  bBKTH2

kyR
bi`BM; M/ Bi rBHH `2im`M i?2 TQbBiBQM BM i?2 bi`BM; r?2`2 Bi 7QmM/ 
TQbbB#H2 KBbbT2HHBM;- HQM; rBi? M ``v Q7 bm;;2bi2/ +Q``2+iBQMb- i?2M
r2 ?p2 M BMi2`7+2 i?i +QmH/ HbQ #2 +QKTQb2/ rBi? Qi?2` bvbi2Kb
#2+mb2 bi`BM;b M/ ``vb `2 Hrvb pBH#H2 BM Cpa+`BTiX

Gv2`2/ BMi2`7+2b
q?2M /2bB;MBM; M BMi2`7+2 7Q`  +QKTH2t TB2+2 Q7 7mM+iBQMHBivěb2M/BM;
2KBH- 7Q` 2tKTH2ěvQm Q7i2M `mM BMiQ  /BH2KKX PM i?2 QM2 ?M/-
vQm /Q MQi rMi iQ Qp2`HQ/ i?2 mb2` Q7 vQm` BMi2`7+2 rBi? /2iBHbX h?2v
b?QmH/MǶi ?p2 iQ bim/v vQm` BMi2`7+2 7Q` ky KBMmi2b #27Q`2 i?2v +M
b2M/ M 2KBHX PM i?2 Qi?2` ?M/- vQm /Q MQi rMi iQ ?B/2 HH i?2 /2iBHb
2Bi?2`ěr?2M T2QTH2 M22/ iQ /Q +QKTHB+i2/ i?BM;b rBi? vQm` KQ/mH2-
i?2v b?QmH/ #2 #H2 iQX
P7i2M i?2 bQHmiBQM Bb iQ T`QpB/2 irQ BMi2`7+2b,  /2iBH2/ HQr@H2p2H QM2
7Q` +QKTH2t bBimiBQMb M/  bBKTH2 ?B;?@H2p2H QM2 7Q` `QmiBM2 mb2X h?2
b2+QM/ +M mbmHHv #2 #mBHi 2bBHv mbBM; i?2 iQQHb T`QpB/2/ #v i?2 }`biX
AM i?2 2KBH KQ/mH2- i?2 ?B;?@H2p2H BMi2`7+2 +QmH/ Dmbi #2  7mM+iBQM
i?i iF2b  K2bb;2-  b2M/2` //`2bb- M/  `2+2Bp2` //`2bb M/ i?2M
b2M/b i?2 2KBHX h?2 HQr@H2p2H BMi2`7+2 rQmH/ HHQr 7mHH +QMi`QH Qp2`
2KBH ?2/2`b- ii+?K2Mib- >hJG KBH- M/ bQ QMX

amKK`v
JQ/mH2b T`QpB/2 bi`m+im`2 iQ #B;;2` T`Q;`Kb #v b2T`iBM; i?2 +Q/2
BMiQ /Bz2`2Mi }H2b M/ MK2bT+2bX :BpBM; i?2b2 KQ/mH2b r2HH@/2}M2/
BMi2`7+2b KF2b i?2K 2bB2` iQ mb2 M/ `2mb2 M/ KF2b Bi TQbbB#H2 iQ
+QMiBMm2 mbBM; i?2K b i?2 KQ/mH2 Bib2H7 2pQHp2bX
h?Qm;? i?2 Cpa+`BTi HM;m;2 Bb +?`+i2`BbiB+HHv mM?2HT7mH r?2M
Bi +QK2b iQ KQ/mH2b- i?2 ~2tB#H2 7mM+iBQMb M/ Q#D2+ib Bi T`QpB/2b KF2
Bi TQbbB#H2 iQ /2}M2 `i?2` MB+2 KQ/mH2 bvbi2KbX 6mM+iBQM b+QT2b +M #2
mb2/ b BMi2`MH MK2bT+2b 7Q` i?2 KQ/mH2- M/ Q#D2+ib +M #2 mb2/ iQ
biQ`2 b2ib Q7 2tTQ`i2/ pHm2bX
h?2`2 `2 irQ TQTmH`- r2HH@/2}M2/ TT`Q+?2b iQ bm+? KQ/mH2bX PM2
Bb +HH2/ *QKKQMCa JQ/mH2b M/ `2pQHp2b `QmM/  require 7mM+iBQM i?i
72i+?2b  KQ/mH2 #v MK2 M/ `2im`Mb Bib BMi2`7+2X h?2 Qi?2` Bb +HH2/

kyk
J. M/ mb2b  define 7mM+iBQM i?i iF2b M ``v Q7 KQ/mH2 MK2b
M/  7mM+iBQM M/- 7i2` HQ/BM; i?2 KQ/mH2b- `mMb i?2 7mM+iBQM rBi?
i?2B` BMi2`7+2b b `;mK2MibX

1t2`+Bb2b
JQMi? MK2b
q`Bi2  bBKTH2 KQ/mH2 bBKBH` iQ i?2 weekDay KQ/mH2 i?i +M +QMp2`i
KQMi? MmK#2`b Ux2`Q@#b2/- b BM i?2 Date ivT2V iQ MK2b M/ +M +QM@
p2`i MK2b #+F iQ MmK#2`bX :Bp2 Bi Bib QrM MK2bT+2 bBM+2 Bi rBHH M22/
M BMi2`MH ``v Q7 KQMi? MK2b- M/ mb2 THBM Cpa+`BTi- rBi?Qmi Mv
KQ/mH2 HQ/2` bvbi2KX

 `2im`M iQ 2H2+i`QMB+ HB72


>QTBM; i?i *?Ti2` d Bb biBHH bQK2r?i 7`2b? BM vQm` KBM/- i?BMF #+F iQ
i?2 bvbi2K /2bB;M2/ BM i?i +?Ti2` M/ +QK2 mT rBi?  rv iQ b2T`i2
i?2 +Q/2 BMiQ KQ/mH2bX hQ `27`2b? vQm` K2KQ`v- i?2b2 `2 i?2 7mM+iBQMb
M/ ivT2b /2}M2/ BM i?i +?Ti2`- BM Q`/2` Q7 TT2`M+2,
Vector
Grid
directions
directionNames
randomElement
BouncingCritter
elementFromChar
World
charFromElement
Wall
View
WallFollower
dirPlus
LifelikeWorld
Plant
PlantEater
SmartPlantEater
Tiger

kyj
.QMǶi 2t;;2`i2 M/ +`2i2 iQQ KMv KQ/mH2bX  #QQF i?i bi`ib 
M2r +?Ti2` 7Q` 2p2`v T;2 rQmH/ T`Q##Hv ;2i QM vQm` M2`p2b- B7 QMHv
#2+mb2 Q7 HH i?2 bT+2 rbi2/ QM iBiH2bX aBKBH`Hv- ?pBM; iQ QT2M Ry
}H2b iQ `2/  iBMv T`QD2+i BbMǶi ?2HT7mHX BK 7Q` i?`22 iQ }p2 KQ/mH2bX
uQm +M +?QQb2 iQ ?p2 bQK2 7mM+iBQMb #2+QK2 BMi2`MH iQ i?2B` KQ/mH2
M/ i?mb BM++2bbB#H2 iQ Qi?2` KQ/mH2bX
h?2`2 Bb MQ bBM;H2 +Q``2+i bQHmiBQM ?2`2X JQ/mH2 Q`;MBxiBQM Bb H`;2Hv
 Kii2` Q7 ibi2X

*B`+mH` /2T2M/2M+B2b
 i`B+Fv bm#D2+i BM /2T2M/2M+v KM;2K2Mi Bb +B`+mH` /2T2M/2M+B2b-
r?2`2 KQ/mH2  /2T2M/b QM "- M/ " HbQ /2T2M/b QM X JMv KQ/mH2
bvbi2Kb bBKTHv 7Q`#B/ i?BbX *QKKQMCa KQ/mH2b HHQr  HBKBi2/ 7Q`K, Bi
rQ`Fb b HQM; b i?2 KQ/mH2b /Q MQi `2TH+2 i?2B` /27mHi exports Q#D2+i
rBi? MQi?2` pHm2 M/ bi`i ++2bbBM; 2+? Qi?2`Ƕb BMi2`7+2 QMHv 7i2`
i?2v }MBb? HQ/BM;X
*M vQm i?BMF Q7  rv BM r?B+? bmTTQ`i 7Q` i?Bb 72im`2 +QmH/ #2
BKTH2K2Mi2/\ GQQF #+F iQ i?2 /2}MBiBQM Q7 require M/ +QMbB/2` r?i
i?2 7mM+iBQM rQmH/ ?p2 iQ /Q iQ HHQr i?BbX

ky9
dzh?2 2pHmiQ`- r?B+? /2i2`KBM2b i?2 K2MBM; Q7 2tT`2bbBQMb
BM  T`Q;`KKBM; HM;m;2- Bb Dmbi MQi?2` T`Q;`KXǴ
ě>H #2HbQM M/ :2`H/ ambbKM- ai`m+im`2 M/
AMi2`T`2iiBQM Q7 *QKTmi2` S`Q;`Kb

RR S`QD2+i,  S`Q;`KKBM;
GM;m;2
"mBH/BM; vQm` QrM T`Q;`KKBM; HM;m;2 Bb bm`T`BbBM;Hv 2bv Ub HQM;
b vQm /Q MQi BK iQQ ?B;?V M/ p2`v 2MHB;?i2MBM;X
h?2 KBM i?BM; A rMi iQ b?Qr BM i?Bb +?Ti2` Bb i?i i?2`2 Bb MQ K;B+
BMpQHp2/ BM #mBH/BM; vQm` QrM HM;m;2X AǶp2 Q7i2M 72Hi i?i bQK2 ?mKM
BMp2MiBQMb r2`2 bQ BKK2Mb2Hv +H2p2` M/ +QKTHB+i2/ i?i AǶ/ M2p2` #2
#H2 iQ mM/2`biM/ i?2KX "mi rBi?  HBiiH2 `2/BM; M/ iBMF2`BM;- bm+?
i?BM;b Q7i2M im`M Qmi iQ #2 [mBi2 KmM/M2X
q2 rBHH #mBH/  T`Q;`KKBM; HM;m;2 +HH2/ 1;;X Ai rBHH #2  iBMv-
bBKTH2 HM;m;2 #mi QM2 i?i Bb TQr2`7mH 2MQm;? iQ 2tT`2bb Mv +QKTm@
iiBQM vQm +M i?BMF Q7X Ai rBHH HbQ HHQr bBKTH2 #bi`+iBQM #b2/ QM
7mM+iBQMbX

S`bBM;
h?2 KQbi BKK2/Bi2Hv pBbB#H2 T`i Q7  T`Q;`KKBM; HM;m;2 Bb Bib
bvMit- Q` MQiiBQMX  T`b2` Bb  T`Q;`K i?i `2/b  TB2+2 Q7 i2ti
M/ T`Q/m+2b  /i bi`m+im`2 i?i `2~2+ib i?2 bi`m+im`2 Q7 i?2 T`Q;`K
+QMiBM2/ BM i?i i2tiX A7 i?2 i2ti /Q2b MQi 7Q`K  pHB/ T`Q;`K- i?2
T`b2` b?QmH/ +QKTHBM M/ TQBMi Qmi i?2 2``Q`X
Pm` HM;m;2 rBHH ?p2  bBKTH2 M/ mMB7Q`K bvMitX 1p2`vi?BM; BM
1;; Bb M 2tT`2bbBQMX M 2tT`2bbBQM +M #2  p`B#H2-  MmK#2`- 
bi`BM;- Q` M TTHB+iBQMX TTHB+iBQMb `2 mb2/ 7Q` 7mM+iBQM +HHb #mi
HbQ 7Q` +QMbi`m+ib bm+? b if Q` whileX
hQ F22T i?2 T`b2` bBKTH2- bi`BM;b BM 1;; /Q MQi bmTTQ`i Mvi?BM; HBF2
#+FbHb? 2b+T2bX  bi`BM; Bb bBKTHv  b2[m2M+2 Q7 +?`+i2`b i?i `2
MQi /Qm#H2 [mQi2b- r`TT2/ BM /Qm#H2 [mQi2bX  MmK#2` Bb  b2[m2M+2 Q7
/B;BibX o`B#H2 MK2b +M +QMbBbi Q7 Mv +?`+i2` i?i Bb MQi r?Bi2bT+2

ky8
M/ /Q2b MQi ?p2  bT2+BH K2MBM; BM i?2 bvMitX
TTHB+iBQMb `2 r`Bii2M i?2 rv i?2v `2 BM Cpa+`BTi- #v TmiiBM;
T`2Mi?2b2b 7i2` M 2tT`2bbBQM M/ ?pBM; Mv MmK#2` Q7 `;mK2Mib
#2ir22M i?Qb2 T`2Mi?2b2b- b2T`i2/ #v +QKKbX
do ( define (x , 10) ,
if ( >(x , 5) ,
print (" large ") ,
print (" small ") ) )

h?2 mMB7Q`KBiv Q7 i?2 1;; HM;m;2 K2Mb i?i i?BM;b i?i `2 QT2`iQ`b
BM Cpa+`BTi Ubm+? b >V `2 MQ`KH p`B#H2b BM i?Bb HM;m;2- TTHB2/
Dmbi HBF2 Qi?2` 7mM+iBQMbX M/ bBM+2 i?2 bvMit ?b MQ +QM+2Ti Q7  #HQ+F-
r2 M22/  do +QMbi`m+i iQ `2T`2b2Mi /QBM; KmHiBTH2 i?BM;b BM b2[m2M+2X
h?2 /i bi`m+im`2 i?i i?2 T`b2` rBHH mb2 iQ /2b+`B#2  T`Q;`K rBHH
+QMbBbi Q7 2tT`2bbBQM Q#D2+ib- 2+? Q7 r?B+? ?b  type T`QT2`iv BM/B+iBM;
i?2 FBM/ Q7 2tT`2bbBQM Bi Bb M/ Qi?2` T`QT2`iB2b iQ /2b+`B#2 Bib +QMi2MiX
1tT`2bbBQMb Q7 ivT2 "value" `2T`2b2Mi HBi2`H bi`BM;b Q` MmK#2`bX h?2B`
value T`QT2`iv +QMiBMb i?2 bi`BM; Q` MmK#2` pHm2 i?i i?2v `2T`2b2MiX
1tT`2bbBQMb Q7 ivT2 "word" `2 mb2/ 7Q` B/2MiB}2`b UMK2bVX am+? Q#D2+ib
?p2  name T`QT2`iv i?i ?QH/b i?2 B/2MiB}2`Ƕb MK2 b  bi`BM;X 6BMHHv- "
apply" 2tT`2bbBQMb `2T`2b2Mi TTHB+iBQMbX h?2v ?p2 M operator T`QT2`iv
i?i `272`b iQ i?2 2tT`2bbBQM i?i Bb #2BM; TTHB2/- M/ i?2v ?p2 M args
T`QT2`iv i?i `272`b iQ M ``v Q7 `;mK2Mi 2tT`2bbBQMbX
h?2 >(x, 5) T`i Q7 i?2 T`2pBQmb T`Q;`K rQmH/ #2 `2T`2b2Mi2/ HBF2
i?Bb,
{
type : " apply " ,
operator : { type : " word " , name : " >"} ,
args : [
{ type : " word " , name : " x "} ,
{ type : " value " , value : 5}
]
}

am+?  /i bi`m+im`2 Bb +HH2/  bvMit i`22X A7 vQm BK;BM2 i?2 Q#D2+ib
b /Qib M/ i?2 HBMFb #2ir22M i?2K b HBM2b #2ir22M i?Qb2 /Qib- Bi ?b
 i`22HBF2 b?T2X h?2 7+i i?i 2tT`2bbBQMb +QMiBM Qi?2` 2tT`2bbBQMb-
r?B+? BM im`M KB;?i +QMiBM KQ`2 2tT`2bbBQMb- Bb bBKBH` iQ i?2 rv

kye
#`M+?2b bTHBi M/ bTHBi ;BMX

do
define
x
10
if
>
x
5
print
"large"
print
"small"

*QMi`bi i?Bb iQ i?2 T`b2` r2 r`Qi2 7Q` i?2 +QM};m`iBQM }H2 7Q`Ki BM
*?Ti2` N- r?B+? ?/  bBKTH2 bi`m+im`2, Bi bTHBi i?2 BMTmi BMiQ HBM2b M/
?M/H2/ i?Qb2 HBM2b QM2 i  iBK2X h?2`2 r2`2 QMHv  72r bBKTH2 7Q`Kb
i?i  HBM2 rb HHQr2/ iQ ?p2X
>2`2 r2 Kmbi }M/  /Bz2`2Mi TT`Q+?X 1tT`2bbBQMb `2 MQi b2T`i2/
BMiQ HBM2b- M/ i?2v ?p2  `2+m`bBp2 bi`m+im`2X TTHB+iBQM 2tT`2bbBQMb
+QMiBM Qi?2` 2tT`2bbBQMbX
6Q`imMi2Hv- i?Bb T`Q#H2K +M #2 bQHp2/ 2H2;MiHv #v r`BiBM;  T`b2`
7mM+iBQM i?i Bb `2+m`bBp2 BM  rv i?i `2~2+ib i?2 `2+m`bBp2 Mim`2 Q7
i?2 HM;m;2X
q2 /2}M2  7mM+iBQM parseExpression- r?B+? iF2b  bi`BM; b BMTmi M/
`2im`Mb M Q#D2+i +QMiBMBM; i?2 /i bi`m+im`2 7Q` i?2 2tT`2bbBQM i i?2
bi`i Q7 i?2 bi`BM;- HQM; rBi? i?2 T`i Q7 i?2 bi`BM; H27i 7i2` T`bBM;
i?Bb 2tT`2bbBQMX q?2M T`bBM; bm#2tT`2bbBQMb Ui?2 `;mK2Mi iQ M T@
THB+iBQM- 7Q` 2tKTH2V- i?Bb 7mM+iBQM +M #2 +HH2/ ;BM- vB2H/BM; i?2
`;mK2Mi 2tT`2bbBQM b r2HH b i?2 i2ti i?i `2KBMbX h?Bb i2ti Kv
BM im`M +QMiBM KQ`2 `;mK2Mib Q` Kv #2 i?2 +HQbBM; T`2Mi?2bBb i?i
2M/b i?2 HBbi Q7 `;mK2MibX

kyd
h?Bb Bb i?2 }`bi T`i Q7 i?2 T`b2`,
function parseExpression ( program ) {
program = skipSpace ( program ) ;
var match , expr ;
if ( match = /^"([^"]*) "/. exec ( program ) )
expr = { type : " value " , value : match [1]};
else if ( match = /^\ d +\ b /. exec ( program ) )
expr = { type : " value " , value : Number ( match [0]) };
else if ( match = /^[^\ s () ,"]+/. exec ( program ) )
expr = { type : " word ", name : match [0]};
else
throw new SyntaxError (" Unexpected syntax : " + program );

return parseApply ( expr , program . slice ( match [0]. length ) ) ;


}

function skipSpace ( string ) {


var first = string . search (/\ S /) ;
if ( first == -1) return "";
return string . slice ( first ) ;
}

"2+mb2 1;; HHQrb Mv KQmMi Q7 r?Bi2bT+2 #2ir22M Bib 2H2K2Mib- r2


?p2 iQ `2T2i2/Hv +mi i?2 r?Bi2bT+2 Qz i?2 bi`i Q7 i?2 T`Q;`K bi`BM;X
h?Bb Bb r?i i?2 skipSpace 7mM+iBQM ?2HTb rBi?X
7i2` bFBTTBM; Mv H2/BM; bT+2- parseExpression mb2b i?`22 `2;mH` 2t@
T`2bbBQMb iQ bTQi i?2 i?`22 bBKTH2 UiQKB+V 2H2K2Mib i?i 1;; bmTTQ`ib,
bi`BM;b- MmK#2`b- M/ rQ`/bX h?2 T`b2` +QMbi`m+ib  /Bz2`2Mi FBM/ Q7
/i bi`m+im`2 /2T2M/BM; QM r?B+? QM2 Ki+?2bX A7 i?2 BMTmi /Q2b MQi
Ki+? QM2 Q7 i?2b2 i?`22 7Q`Kb- Bi Bb MQi  pHB/ 2tT`2bbBQM- M/ i?2
T`b2` i?`Qrb M 2``Q`X SyntaxError Bb  biM/`/ 2``Q` Q#D2+i ivT2- r?B+?
Bb `Bb2/ r?2M M ii2KTi Bb K/2 iQ `mM M BMpHB/ Cpa+`BTi T`Q;`KX
q2 +M i?2M +mi Qz i?2 T`i i?i r2 Ki+?2/ 7`QK i?2 T`Q;`K bi`BM;
M/ Tbb i?i- HQM; rBi? i?2 Q#D2+i 7Q` i?2 2tT`2bbBQM- iQ parseApply-
r?B+? +?2+Fb r?2i?2` i?2 2tT`2bbBQM Bb M TTHB+iBQMX A7 bQ- Bi T`b2b 
T`2Mi?2bBx2/ HBbi Q7 `;mK2MibX
function parseApply ( expr , program ) {
program = skipSpace ( program ) ;
if ( program [0] != "(")

ky3
return { expr : expr , rest : program };

program = skipSpace ( program . slice (1) ) ;


expr = { type : " apply " , operator : expr , args : []};
while ( program [0] != ") ") {
var arg = parseExpression ( program );
expr . args . push ( arg . expr );
program = skipSpace ( arg . rest ) ;
if ( program [0] == " ,")
program = skipSpace ( program . slice (1) ) ;
else if ( program [0] != ") ")
throw new SyntaxError (" Expected , or ) ") ;
}
return parseApply ( expr , program . slice (1) ) ;
}

A7 i?2 M2ti +?`+i2` BM i?2 T`Q;`K Bb MQi M QT2MBM; T`2Mi?2bBb- i?Bb


Bb MQi M TTHB+iBQM- M/ parseApply bBKTHv `2im`Mb i?2 2tT`2bbBQM Bi rb
;Bp2MX
Pi?2`rBb2- Bi bFBTb i?2 QT2MBM; T`2Mi?2bBb M/ +`2i2b i?2 bvMit
i`22 Q#D2+i 7Q` i?Bb TTHB+iBQM 2tT`2bbBQMX Ai i?2M `2+m`bBp2Hv +HHb
parseExpression iQ T`b2 2+? `;mK2Mi mMiBH  +HQbBM; T`2Mi?2bBb Bb
7QmM/X h?2 `2+m`bBQM Bb BM/B`2+i- i?`Qm;? parseApply M/ parseExpression
+HHBM; 2+? Qi?2`X
"2+mb2 M TTHB+iBQM 2tT`2bbBQM +M Bib2H7 #2 TTHB2/ Ubm+? b BM
multiplier(2)(1)V- parseApply Kmbi- 7i2` Bi ?b T`b2/ M TTHB+iBQM- +HH
Bib2H7 ;BM iQ +?2+F r?2i?2` MQi?2` TB` Q7 T`2Mi?2b2b 7QHHQrbX
h?Bb Bb HH r2 M22/ iQ T`b2 1;;X q2 r`T Bi BM  +QMp2MB2Mi parse
7mM+iBQM i?i p2`B}2b i?i Bi ?b `2+?2/ i?2 2M/ Q7 i?2 BMTmi bi`BM; 7i2`
T`bBM; i?2 2tT`2bbBQM UM 1;; T`Q;`K Bb  bBM;H2 2tT`2bbBQMV- M/ i?i
;Bp2b mb i?2 T`Q;`KǶb /i bi`m+im`2X
function parse ( program ) {
var result = parseExpression ( program ) ;
if ( skipSpace ( result . rest ). length > 0)
throw new SyntaxError (" Unexpected text after program ") ;
return result . expr ;
}

console . log ( parse ("+( a , 10) ") ) ;

kyN
// → { type : " apply " ,
// operator : { type : " word " , name : "+"} ,
// args : [{ type : " word " , name : "a "} ,
// { type : " value " , value : 10}]}

Ai rQ`Fb5 Ai /Q2bMǶi ;Bp2 mb p2`v ?2HT7mH BM7Q`KiBQM r?2M Bi 7BHb M/


/Q2bMǶi biQ`2 i?2 HBM2 M/ +QHmKM QM r?B+? 2+? 2tT`2bbBQM bi`ib- r?B+?
KB;?i #2 ?2HT7mH r?2M `2TQ`iBM; 2``Q`b Hi2`- #mi BiǶb ;QQ/ 2MQm;? 7Q`
Qm` Tm`TQb2bX

h?2 2pHmiQ`
q?i +M r2 /Q rBi? i?2 bvMit i`22 7Q`  T`Q;`K\ _mM Bi- Q7 +Qm`b25
M/ i?i Bb r?i i?2 2pHmiQ` /Q2bX uQm ;Bp2 Bi  bvMit i`22 M/
M 2MpB`QMK2Mi Q#D2+i i?i bbQ+Bi2b MK2b rBi? pHm2b- M/ Bi rBHH
2pHmi2 i?2 2tT`2bbBQM i?i i?2 i`22 `2T`2b2Mib M/ `2im`M i?2 pHm2
i?i i?Bb T`Q/m+2bX
function evaluate ( expr , env ) {
switch ( expr . type ) {
case " value ":
return expr . value ;

case " word ":


if ( expr . name in env )
return env [ expr . name ];
else
throw new ReferenceError (" Undefined variable : " +
expr . name ) ;
case " apply ":
if ( expr . operator . type == " word " &&
expr . operator . name in specialForms )
return specialForms [ expr . operator . name ]( expr . args ,
env ) ;
var op = evaluate ( expr . operator , env );
if ( typeof op != " function ")
throw new TypeError (" Applying a non - function .") ;
return op . apply ( null , expr . args . map ( function ( arg ) {
return evaluate ( arg , env );
}) ) ;

kRy
}
}

var specialForms = Object . create ( null );

h?2 2pHmiQ` ?b +Q/2 7Q` 2+? Q7 i?2 2tT`2bbBQM ivT2bX  HBi2`H pHm2
2tT`2bbBQM bBKTHv T`Q/m+2b Bib pHm2X U6Q` 2tKTH2- i?2 2tT`2bbBQM 100
Dmbi 2pHmi2b iQ i?2 MmK#2` RyyXV 6Q`  p`B#H2- r2 Kmbi +?2+F r?2i?2`
Bi Bb +imHHv /2}M2/ BM i?2 2MpB`QMK2Mi M/- B7 Bi Bb- 72i+? i?2 p`B#H2Ƕb
pHm2X
TTHB+iBQMb `2 KQ`2 BMpQHp2/X A7 i?2v `2  bT2+BH 7Q`K- HBF2 if-
r2 /Q MQi 2pHmi2 Mvi?BM; M/ bBKTHv Tbb i?2 `;mK2Mi 2tT`2bbBQMb-
HQM; rBi? i?2 2MpB`QMK2Mi- iQ i?2 7mM+iBQM i?i ?M/H2b i?Bb 7Q`KX A7
Bi Bb  MQ`KH +HH- r2 2pHmi2 i?2 QT2`iQ`- p2`B7v i?i Bi Bb  7mM+iBQM-
M/ +HH Bi rBi? i?2 `2bmHi Q7 2pHmiBM; i?2 `;mK2MibX
q2 rBHH mb2 THBM Cpa+`BTi 7mM+iBQM pHm2b iQ `2T`2b2Mi 1;;Ƕb 7mM+iBQM
pHm2bX q2 rBHH +QK2 #+F iQ i?Bb Hi2`- r?2M i?2 bT2+BH 7Q`K +HH2/ fun
Bb /2}M2/X
h?2 `2+m`bBp2 bi`m+im`2 Q7 evaluate `2b2K#H2b i?2 bBKBH` bi`m+im`2 Q7
i?2 T`b2`X "Qi? KB``Q` i?2 bi`m+im`2 Q7 i?2 HM;m;2 Bib2H7X Ai rQmH/
HbQ #2 TQbbB#H2 iQ BMi2;`i2 i?2 T`b2` rBi? i?2 2pHmiQ` M/ 2pHmi2
/m`BM; T`bBM;- #mi bTHBiiBM; i?2K mT i?Bb rv KF2b i?2 T`Q;`K KQ`2
`2/#H2X
h?Bb Bb `2HHv HH i?i Bb M22/2/ iQ BMi2`T`2i 1;;X Ai Bb i?i bBKTH2X "mi
rBi?Qmi /2}MBM;  72r bT2+BH 7Q`Kb M/ //BM; bQK2 mb27mH pHm2b iQ
i?2 2MpB`QMK2Mi- vQm +MǶi /Q Mvi?BM; rBi? i?Bb HM;m;2 v2iX

aT2+BH 7Q`Kb
h?2 specialForms Q#D2+i Bb mb2/ iQ /2}M2 bT2+BH bvMit BM 1;;X Ai b@
bQ+Bi2b rQ`/b rBi? 7mM+iBQMb i?i 2pHmi2 bm+? bT2+BH 7Q`KbX Ai Bb
+m``2MiHv 2KTivX G2iǶb // bQK2 7Q`KbX
specialForms [" if "] = function ( args , env ) {
if ( args . length != 3)
throw new SyntaxError (" Bad number of args to if ") ;

if ( evaluate ( args [0] , env ) !== false )

kRR
return evaluate ( args [1] , env );
else
return evaluate ( args [2] , env );
};

1;;Ƕb if +QMbi`m+i 2tT2+ib 2t+iHv i?`22 `;mK2MibX Ai rBHH 2pHmi2 i?2


}`bi- M/ B7 i?2 `2bmHi BbMǶi i?2 pHm2 false- Bi rBHH 2pHmi2 i?2 b2+QM/X
Pi?2`rBb2- i?2 i?B`/ ;2ib 2pHmi2/X h?Bb if 7Q`K Bb KQ`2 bBKBH` iQ
Cpa+`BTiǶb i2`M`v ?, QT2`iQ` i?M iQ Cpa+`BTiǶb ifX Ai Bb M 2tT`2b@
bBQM- MQi  bii2K2Mi- M/ Bi T`Q/m+2b  pHm2- MK2Hv- i?2 `2bmHi Q7 i?2
b2+QM/ Q` i?B`/ `;mK2MiX
1;; /Bz2`b 7`QK Cpa+`BTi BM ?Qr Bi ?M/H2b i?2 +QM/BiBQM pHm2 iQ ifX
Ai rBHH MQi i`2i i?BM;b HBF2 x2`Q Q` i?2 2KTiv bi`BM; b 7Hb2- #mi QMHv
i?2 T`2+Bb2 pHm2 falseX
h?2 `2bQM r2 M22/ iQ `2T`2b2Mi if b  bT2+BH 7Q`K- `i?2` i?M 
`2;mH` 7mM+iBQM- Bb i?i HH `;mK2Mib iQ 7mM+iBQMb `2 2pHmi2/ #27Q`2
i?2 7mM+iBQM Bb +HH2/- r?2`2b if b?QmH/ 2pHmi2 QMHv 2Bi?2` Bib b2+QM/
Q` Bib i?B`/ `;mK2Mi- /2T2M/BM; QM i?2 pHm2 Q7 i?2 }`biX
h?2 while 7Q`K Bb bBKBH`X
specialForms [" while "] = function ( args , env ) {
if ( args . length != 2)
throw new SyntaxError (" Bad number of args to while ") ;

while ( evaluate ( args [0] , env ) !== false )


evaluate ( args [1] , env );

// Since undefined does not exist in Egg , we return false ,


// for lack of a meaningful result .
return false ;
};

MQi?2` #bB+ #mBH/BM; #HQ+F Bb do- r?B+? 2t2+mi2b HH Bib `;mK2Mib 7`QK
iQT iQ #QiiQKX Aib pHm2 Bb i?2 pHm2 T`Q/m+2/ #v i?2 Hbi `;mK2MiX
specialForms [" do "] = function ( args , env ) {
var value = false ;
args . forEach ( function ( arg ) {
value = evaluate ( arg , env ) ;
}) ;
return value ;

kRk
};

hQ #2 #H2 iQ +`2i2 p`B#H2b M/ ;Bp2 i?2K M2r pHm2b- r2 HbQ +`2i2 
7Q`K +HH2/ defineX Ai 2tT2+ib  rQ`/ b Bib }`bi `;mK2Mi M/ M 2tT`2b@
bBQM T`Q/m+BM; i?2 pHm2 iQ bbB;M iQ i?i rQ`/ b Bib b2+QM/ `;mK2MiX
aBM+2 define- HBF2 2p2`vi?BM;- Bb M 2tT`2bbBQM- Bi Kmbi `2im`M  pHm2X
q2ǶHH KF2 Bi `2im`M i?2 pHm2 i?i rb bbB;M2/ UDmbi HBF2 Cpa+`BTiǶb
= QT2`iQ`VX

specialForms [" define "] = function ( args , env ) {


if ( args . length != 2 || args [0]. type != " word ")
throw new SyntaxError (" Bad use of define ") ;
var value = evaluate ( args [1] , env ) ;
env [ args [0]. name ] = value ;
return value ;
};

h?2 2MpB`QMK2Mi
h?2 2MpB`QMK2Mi ++2Ti2/ #v evaluate Bb M Q#D2+i rBi? T`QT2`iB2b r?Qb2
MK2b +Q``2bTQM/ iQ p`B#H2 MK2b M/ r?Qb2 pHm2b +Q``2bTQM/ iQ i?2
pHm2b i?Qb2 p`B#H2b `2 #QmM/ iQX G2iǶb /2}M2 M 2MpB`QMK2Mi Q#D2+i
iQ `2T`2b2Mi i?2 ;HQ#H b+QT2X
hQ #2 #H2 iQ mb2 i?2 if +QMbi`m+i r2 Dmbi /2}M2/- r2 Kmbi ?p2 ++2bb
iQ "QQH2M pHm2bX aBM+2 i?2`2 `2 QMHv irQ "QQH2M pHm2b- r2 /Q MQi
M22/ bT2+BH bvMit 7Q` i?2KX q2 bBKTHv #BM/ irQ p`B#H2b iQ i?2 pHm2b
true M/ false M/ mb2 i?Qb2X

var topEnv = Object . create ( null ) ;

topEnv [" true "] = true ;


topEnv [" false "] = false ;

q2 +M MQr 2pHmi2  bBKTH2 2tT`2bbBQM i?i M2;i2b  "QQH2M pHm2X


var prog = parse (" if ( true , false , true ) ") ;
console . log ( evaluate ( prog , topEnv ));
// → false

hQ bmTTHv #bB+ `Bi?K2iB+ M/ +QKT`BbQM QT2`iQ`b- r2 rBHH HbQ //

kRj
bQK2 7mM+iBQM pHm2b iQ i?2 2MpB`QMK2MiX AM i?2 BMi2`2bi Q7 F22TBM;
i?2 +Q/2 b?Q`i- r2ǶHH mb2 new Function iQ bvMi?2bBx2  #mM+? Q7 QT2`iQ`
7mM+iBQMb BM  HQQT- `i?2` i?M /2}MBM; i?2K HH BM/BpB/mHHvX
["+" , " -" , "*" , "/" , "==" , " <" , " >"]. forEach ( function ( op ) {
topEnv [ op ] = new Function ("a , b", " return a " + op + " b ;") ;
}) ;

 rv iQ QmiTmi pHm2b Bb HbQ p2`v mb27mH- bQ r2ǶHH r`T console.log BM 


7mM+iBQM M/ +HH Bi printX
topEnv [" print "] = function ( value ) {
console . log ( value ) ;
return value ;
};

h?i ;Bp2b mb 2MQm;? 2H2K2Mi`v iQQHb iQ r`Bi2 bBKTH2 T`Q;`KbX h?2


7QHHQrBM; run 7mM+iBQM T`QpB/2b  +QMp2MB2Mi rv iQ r`Bi2 M/ `mM i?2KX
Ai +`2i2b  7`2b? 2MpB`QMK2Mi M/ T`b2b M/ 2pHmi2b i?2 bi`BM;b r2
;Bp2 Bi b  bBM;H2 T`Q;`KX
function run () {
var env = Object . create ( topEnv );
var program = Array . prototype . slice
. call ( arguments , 0) . join ("\ n ") ;
return evaluate ( parse ( program ) , env ) ;
}

h?2 mb2 Q7 Array.prototype.slice.call Bb  i`B+F iQ im`M M ``v@HBF2 Q#D2+i-


bm+? b arguments- BMiQ  `2H ``v bQ i?i r2 +M +HH join QM BiX Ai iF2b
HH i?2 `;mK2Mib ;Bp2M iQ run M/ i`2ib i?2K b i?2 HBM2b Q7  T`Q;`KX
run (" do ( define ( total , 0) ," ,
" define ( count , 1) ," ,
" while ( <( count , 11) ," ,
" do ( define ( total , +( total , count ) ) ," ,
" define ( count , +( count , 1) ) ) ) ," ,
" print ( total ) ) ") ;
// → 55

h?Bb Bb i?2 T`Q;`K r2Ƕp2 b22M b2p2`H iBK2b #27Q`2- r?B+? +QKTmi2b i?2
bmK Q7 i?2 MmK#2`b R iQ Ry- 2tT`2bb2/ BM 1;;X Ai Bb +H2`Hv m;HB2` i?M i?2

kR9
2[mBpH2Mi Cpa+`BTi T`Q;`K #mi MQi #/ 7Q`  HM;m;2 BKTH2K2Mi2/
BM H2bb i?M R8y HBM2b Q7 +Q/2X

6mM+iBQMb
 T`Q;`KKBM; HM;m;2 rBi?Qmi 7mM+iBQMb Bb  TQQ` T`Q;`KKBM; HM@
;m;2 BM/22/X
6Q`imMi2Hv- Bi Bb MQi ?`/ iQ //  fun +QMbi`m+i- r?B+? i`2ib Bib Hbi
`;mK2Mi b i?2 7mM+iBQMǶb #Q/v M/ i`2ib HH i?2 `;mK2Mib #27Q`2 i?i
b i?2 MK2b Q7 i?2 7mM+iBQMǶb `;mK2MibX
specialForms [" fun "] = function ( args , env ) {
if (! args . length )
throw new SyntaxError (" Functions need a body ") ;
function name ( expr ) {
if ( expr . type != " word ")
throw new SyntaxError (" Arg names must be words ") ;
return expr . name ;
}
var argNames = args . slice (0 , args . length - 1) . map ( name ) ;
var body = args [ args . length - 1];

return function () {
if ( arguments . length != argNames . length )
throw new TypeError (" Wrong number of arguments ") ;
var localEnv = Object . create ( env );
for ( var i = 0; i < arguments . length ; i ++)
localEnv [ argNames [i ]] = arguments [i ];
return evaluate ( body , localEnv );
};
};

6mM+iBQMb BM 1;; ?p2 i?2B` QrM HQ+H 2MpB`QMK2Mi- Dmbi HBF2 BM Cpa+`BTiX
q2 mb2 Object.create iQ KF2  M2r Q#D2+i i?i ?b ++2bb iQ i?2 p`B@
#H2b BM i?2 Qmi2` 2MpB`QMK2Mi UBib T`QiQivT2V #mi i?i +M HbQ +QMiBM
M2r p`B#H2b rBi?Qmi KQ/B7vBM; i?i Qmi2` b+QT2X
h?2 7mM+iBQM +`2i2/ #v i?2 fun 7Q`K +`2i2b i?Bb HQ+H 2MpB`QMK2Mi
M/ //b i?2 `;mK2Mi p`B#H2b iQ BiX Ai i?2M 2pHmi2b i?2 7mM+iBQM
#Q/v BM i?Bb 2MpB`QMK2Mi M/ `2im`Mb i?2 `2bmHiX

kR8
run (" do ( define ( plusOne , fun (a , +(a , 1) )) ,",
" print ( plusOne (10) ) ) ") ;
// → 11

run (" do ( define ( pow , fun ( base , exp ," ,


" if (==( exp , 0) ," ,
" 1 ," ,
" *( base , pow ( base , -( exp , 1) ) ) ) ) ) ," ,
" print ( pow (2 , 10) ) ) ") ;
// → 1024

*QKTBHiBQM
q?i r2 ?p2 #mBHi Bb M BMi2`T`2i2`X .m`BM; 2pHmiBQM- Bi +ib /B`2+iHv
QM i?2 `2T`2b2MiiBQM Q7 i?2 T`Q;`K T`Q/m+2/ #v i?2 T`b2`X
*QKTBHiBQM Bb i?2 T`Q+2bb Q7 //BM; MQi?2` bi2T #2ir22M i?2 T`b@
BM; M/ i?2 `mMMBM; Q7  T`Q;`K- r?B+? i`Mb7Q`Kb i?2 T`Q;`K BMiQ
bQK2i?BM; i?i +M #2 2pHmi2/ KQ`2 2{+B2MiHv #v /QBM; b Km+? rQ`F
b TQbbB#H2 BM /pM+2X 6Q` 2tKTH2- BM r2HH@/2bB;M2/ HM;m;2b Bi Bb
Q#pBQmb- 7Q` 2+? mb2 Q7  p`B#H2- r?B+? p`B#H2 Bb #2BM; `272``2/ iQ-
rBi?Qmi +imHHv `mMMBM; i?2 T`Q;`KX h?Bb +M #2 mb2/ iQ pQB/ HQQFBM;
mT i?2 p`B#H2 #v MK2 2p2`v iBK2 Bi Bb ++2bb2/ M/ iQ /B`2+iHv 72i+?
Bi 7`QK bQK2 T`2/2i2`KBM2/ K2KQ`v HQ+iBQMX
h`/BiBQMHHv- +QKTBHiBQM BMpQHp2b +QMp2`iBM; i?2 T`Q;`K iQ K+?BM2
+Q/2- i?2 `r 7Q`Ki i?i  +QKTmi2`Ƕb T`Q+2bbQ` +M 2t2+mi2X "mi Mv
T`Q+2bb i?i +QMp2`ib  T`Q;`K iQ  /Bz2`2Mi `2T`2b2MiiBQM +M #2
i?Qm;?i Q7 b +QKTBHiBQMX
Ai rQmH/ #2 TQbbB#H2 iQ r`Bi2 M Hi2`MiBp2 2pHmiBQM bi`i2;v 7Q`
1;;- QM2 i?i }`bi +QMp2`ib i?2 T`Q;`K iQ  Cpa+`BTi T`Q;`K- mb2b
new Function iQ BMpQF2 i?2 Cpa+`BTi +QKTBH2` QM Bi- M/ i?2M `mMb i?2
`2bmHiX q?2M /QM2 `B;?i- i?Bb rQmH/ KF2 1;; `mM p2`v 7bi r?BH2 biBHH
#2BM; [mBi2 bBKTH2 iQ BKTH2K2MiX
A7 vQm `2 BMi2`2bi2/ BM i?Bb iQTB+ M/ rBHHBM; iQ bT2M/ bQK2 iBK2 QM
Bi- A 2M+Qm`;2 vQm iQ i`v iQ BKTH2K2Mi bm+?  +QKTBH2` b M 2t2`+Bb2X

kRe
*?2iBM;
q?2M r2 /2}M2/ if M/ while- vQm T`Q##Hv MQiB+2/ i?i i?2v r2`2 KQ`2
Q` H2bb i`BpBH r`TT2`b `QmM/ Cpa+`BTiǶb QrM if M/ whileX aBKBH`Hv-
i?2 pHm2b BM 1;; `2 Dmbi `2;mH` QH/ Cpa+`BTi pHm2bX
A7 vQm +QKT`2 i?2 BKTH2K2MiiBQM Q7 1;;- #mBHi QM iQT Q7 Cpa+`BTi-
rBi? i?2 KQmMi Q7 rQ`F M/ +QKTH2tBiv `2[mB`2/ iQ #mBH/  T`Q;`K@
KBM; HM;m;2 /B`2+iHv QM i?2 `r 7mM+iBQMHBiv T`QpB/2/ #v  K+?BM2-
i?2 /Bz2`2M+2 Bb ?m;2X _2;`/H2bb- i?Bb 2tKTH2 ?QT27mHHv ;p2 vQm M
BKT`2bbBQM Q7 i?2 rv T`Q;`KKBM; HM;m;2b rQ`FX
M/ r?2M Bi +QK2b iQ ;2iiBM; bQK2i?BM; /QM2- +?2iBM; Bb KQ`2 2z2+@
iBp2 i?M /QBM; 2p2`vi?BM; vQm`b2H7X h?Qm;? i?2 iQv HM;m;2 BM i?Bb
+?Ti2` /Q2bMǶi /Q Mvi?BM; i?i +QmH/MǶi #2 /QM2 #2ii2` BM Cpa+`BTi-
i?2`2 `2 bBimiBQMb r?2`2 r`BiBM; bKHH HM;m;2b ?2HTb ;2i `2H rQ`F
/QM2X
am+?  HM;m;2 /Q2b MQi ?p2 iQ `2b2K#H2  ivTB+H T`Q;`KKBM;
HM;m;2X A7 Cpa+`BTi /B/MǶi +QK2 2[mBTT2/ rBi? `2;mH` 2tT`2bbBQMb-
vQm +QmH/ r`Bi2 vQm` QrM T`b2` M/ 2pHmiQ` 7Q` bm+?  bm#HM;m;2X
P` BK;BM2 vQm `2 #mBH/BM;  ;BMi `Q#QiB+ /BMQbm` M/ M22/ iQ
T`Q;`K Bib #2?pBQ`X Cpa+`BTi KB;?i MQi #2 i?2 KQbi 2z2+iBp2 rv iQ
/Q i?BbX uQm KB;?i BMbi2/ QTi 7Q`  HM;m;2 i?i HQQFb HBF2 i?Bb,
behavior walk
perform when
destination ahead
actions
move left - foot
move right - foot

behavior attack
perform when
Godzilla in - view
actions
fire laser - eyes
launch arm - rockets

h?Bb Bb r?i Bb mbmHHv +HH2/  /QKBM@bT2+B}+ HM;m;2-  HM;m;2


iBHQ`2/ iQ 2tT`2bb  M``Qr /QKBM Q7 FMQrH2/;2X am+?  HM;m;2
+M #2 KQ`2 2tT`2bbBp2 i?M  ;2M2`H@Tm`TQb2 HM;m;2 #2+mb2 Bi Bb

kRd
/2bB;M2/ iQ 2tT`2bb 2t+iHv i?2 i?BM;b i?i M22/ 2tT`2bbBM; BM Bib /QKBM
M/ MQi?BM; 2Hb2X

1t2`+Bb2b
``vb
// bmTTQ`i 7Q` ``vb iQ 1;; #v //BM; i?2 7QHHQrBM; i?`22 7mM+iBQMb iQ
i?2 iQT b+QT2, array(...) iQ +QMbi`m+i M ``v +QMiBMBM; i?2 `;mK2Mi
pHm2b- length(array) iQ ;2i M ``vǶb H2M;i?- M/ element(array, n) iQ
72i+? i?2 Mi? 2H2K2Mi 7`QK M ``vX

*HQbm`2
h?2 rv r2 ?p2 /2}M2/ fun HHQrb 7mM+iBQMb BM 1;; iQ dz+HQb2 Qp2`Ǵ
i?2 bm``QmM/BM; 2MpB`QMK2Mi- HHQrBM; i?2 7mM+iBQMǶb #Q/v iQ mb2 HQ+H
pHm2b i?i r2`2 pBbB#H2 i i?2 iBK2 i?2 7mM+iBQM rb /2}M2/- Dmbi HBF2
Cpa+`BTi 7mM+iBQMb /QX
h?2 7QHHQrBM; T`Q;`K BHHmbi`i2b i?Bb, 7mM+iBQM f `2im`Mb  7mM+iBQM
i?i //b Bib `;mK2Mi iQ fǶb `;mK2Mi- K2MBM; i?i Bi M22/b ++2bb iQ
i?2 HQ+H b+QT2 BMbB/2 f iQ #2 #H2 iQ mb2 p`B#H2 aX
run (" do ( define (f , fun (a , fun (b , +( a , b)))) ,",
" print ( f (4) (5) ) ) ") ;
// → 9

:Q #+F iQ i?2 /2}MBiBQM Q7 i?2 fun 7Q`K M/ 2tTHBM r?B+? K2+?MBbK
+mb2b i?Bb iQ rQ`FX

*QKK2Mib
Ai rQmH/ #2 MB+2 B7 r2 +QmH/ r`Bi2 +QKK2Mib BM 1;;X 6Q` 2tKTH2- r?2M@
2p2` r2 }M/  ?b? bB;M U\#V- r2 +QmH/ i`2i i?2 `2bi Q7 i?2 HBM2 b 
+QKK2Mi M/ B;MQ`2 Bi- bBKBH` iQ // BM Cpa+`BTiX
q2 /Q MQi ?p2 iQ KF2 Mv #B; +?M;2b iQ i?2 T`b2` iQ bmTTQ`i
i?BbX q2 +M bBKTHv +?M;2 skipSpace iQ bFBT +QKK2Mib HBF2 i?2v `2
r?Bi2bT+2 bQ i?i HH i?2 TQBMib r?2`2 skipSpace Bb +HH2/ rBHH MQr HbQ
bFBT +QKK2MibX JF2 i?Bb +?M;2X

kR3
6BtBM; b+QT2
*m``2MiHv- i?2 QMHv rv iQ bbB;M  p`B#H2  pHm2 Bb defineX h?Bb
+QMbi`m+i +ib b  rv #Qi? iQ /2}M2 M2r p`B#H2b M/ iQ ;Bp2 2tBbiBM;
QM2b  M2r pHm2X
h?Bb K#B;mBiv +mb2b  T`Q#H2KX q?2M vQm i`v iQ ;Bp2  MQMHQ+H
p`B#H2  M2r pHm2- vQm rBHH 2M/ mT /2}MBM;  HQ+H QM2 rBi? i?2 bK2
MK2 BMbi2/X UaQK2 HM;m;2b rQ`F HBF2 i?Bb #v /2bB;M- #mi AǶp2 Hrvb
7QmM/ Bi  bBHHv rv iQ ?M/H2 b+QT2XV
//  bT2+BH 7Q`K set- bBKBH` iQ define- r?B+? ;Bp2b  p`B#H2  M2r
pHm2- mT/iBM; i?2 p`B#H2 BM M Qmi2` b+QT2 B7 Bi /Q2bMǶi H`2/v 2tBbi BM
i?2 BMM2` b+QT2X A7 i?2 p`B#H2 Bb MQi /2}M2/ i HH- i?`Qr  ReferenceError
Ur?B+? Bb MQi?2` biM/`/ 2``Q` ivT2VX
h?2 i2+?MB[m2 Q7 `2T`2b2MiBM; b+QT2b b bBKTH2 Q#D2+ib- r?B+? ?b K/2
i?BM;b +QMp2MB2Mi bQ 7`- rBHH ;2i BM vQm` rv  HBiiH2 i i?Bb TQBMiX uQm
KB;?i rMi iQ mb2 i?2 Object.getPrototypeOf 7mM+iBQM- r?B+? `2im`Mb i?2
T`QiQivT2 Q7 M Q#D2+iX HbQ `2K2K#2` i?i b+QT2b /Q MQi /2`Bp2 7`QK
Object.prototype- bQ B7 vQm rMi iQ +HH hasOwnProperty QM i?2K- vQm ?p2
iQ mb2 i?Bb +HmKbv 2tT`2bbBQM,
Object . prototype . hasOwnProperty . call ( scope , name ) ;

h?Bb 72i+?2b i?2 hasOwnProperty K2i?Q/ 7`QK i?2 Object T`QiQivT2 M/
i?2M +HHb Bi QM  b+QT2 Q#D2+iX

kRN
dzh?2 #`Qrb2` Bb  `2HHv ?QbiBH2 T`Q;`KKBM; 2MpB`QMK2MiXǴ
ě.Qm;Hb *`Q+F7Q`/- h?2 Cpa+`BTi S`Q;`KKBM; GM;m;2
UpB/2Q H2+im`2V

Rk Cpa+`BTi M/ i?2 "`Qrb2`


h?2 M2ti T`i Q7 i?Bb #QQF rBHH iHF #Qmi r2# #`Qrb2`bX qBi?Qmi r2#
#`Qrb2`b- i?2`2 rQmH/ #2 MQ Cpa+`BTiX M/ 2p2M B7 i?2`2 r2`2- MQ QM2
rQmH/ 2p2` ?p2 TB/ Mv ii2MiBQM iQ BiX
q2# i2+?MQHQ;v ?b- 7`QK i?2 bi`i- #22M /2+2Mi`HBx2/- MQi Dmbi i2+?@
MB+HHv #mi HbQ BM i?2 rv Bi ?b 2pQHp2/X o`BQmb #`Qrb2` p2M/Q`b
?p2 //2/ M2r 7mM+iBQMHBiv BM / ?Q+ M/ bQK2iBK2b TQQ`Hv i?Qm;?i
Qmi rvb- r?B+? i?2M bQK2iBK2b 2M/2/ mT #2BM; /QTi2/ #v Qi?2`b M/
}MHHv b2i /QrM b  biM/`/X
h?Bb Bb #Qi?  #H2bbBM; M/  +m`b2X PM i?2 QM2 ?M/- Bi Bb 2KTQr2`BM;
iQ MQi ?p2  +2Mi`H T`iv +QMi`QH  bvbi2K #mi ?p2 Bi #2 BKT`Qp2/
#v p`BQmb T`iB2b rQ`FBM; BM HQQb2 +QHH#Q`iBQM UQ`- Q++bBQMHHv- QT2M
?QbiBHBivVX PM i?2 Qi?2` ?M/- i?2 ?T?x`/ rv BM r?B+? i?2 q2#
rb /2p2HQT2/ K2Mb i?i i?2 `2bmHiBM; bvbi2K Bb MQi 2t+iHv  b?BMBM;
2tKTH2 Q7 BMi2`MH +QMbBbi2M+vX AM 7+i- bQK2 T`ib Q7 Bi `2 /QrM`B;?i
K2bbv M/ +QM7mbBM;X

L2irQ`Fb M/ i?2 AMi2`M2i


*QKTmi2` M2irQ`Fb ?p2 #22M `QmM/ bBM+2 i?2 RN8ybX A7 vQm Tmi +#H2b
#2ir22M irQ Q` KQ`2 +QKTmi2`b M/ HHQr i?2K iQ b2M/ /i #+F M/
7Q`i? i?`Qm;? i?2b2 +#H2b- vQm +M /Q HH FBM/b Q7 rQM/2`7mH i?BM;bX
A7 +QMM2+iBM; irQ K+?BM2b BM i?2 bK2 #mBH/BM; HHQrb mb iQ /Q rQM@
/2`7mH i?BM;b- +QMM2+iBM; K+?BM2b HH Qp2` i?2 THM2i b?QmH/ #2 2p2M
#2ii2`X h?2 i2+?MQHQ;v iQ bi`i BKTH2K2MiBM; i?Bb pBbBQM rb /2p2HQT2/
BM i?2 RN3yb- M/ i?2 `2bmHiBM; M2irQ`F Bb +HH2/ i?2 AMi2`M2iX Ai ?b
HBp2/ mT iQ Bib T`QKBb2X
 +QKTmi2` +M mb2 i?Bb M2irQ`F iQ bT2r #Bib i MQi?2` +QKTmi2`X
6Q` Mv 2z2+iBp2 +QKKmMB+iBQM iQ `Bb2 Qmi Q7 i?Bb #Bi@bT2rBM;- i?2
+QKTmi2`b i #Qi? 2M/b Kmbi FMQr r?i i?2 #Bib `2 bmTTQb2/ iQ `2T`2@

kky
b2MiX h?2 K2MBM; Q7 Mv ;Bp2M b2[m2M+2 Q7 #Bib /2T2M/b 2MiB`2Hv QM i?2
FBM/ Q7 i?BM; i?i Bi Bb i`vBM; iQ 2tT`2bb M/ QM i?2 2M+Q/BM; K2+?MBbK
mb2/X
 M2irQ`F T`QiQ+QH /2b+`B#2b  bivH2 Q7 +QKKmMB+iBQM Qp2`  M2irQ`FX
h?2`2 `2 T`QiQ+QHb 7Q` b2M/BM; 2KBH- 7Q` 72i+?BM; 2KBH- 7Q` b?`BM;
}H2b- Q` 2p2M 7Q` +QMi`QHHBM; +QKTmi2`b i?i ?TT2M iQ #2 BM72+i2/ #v
KHB+BQmb bQ7ir`2X
6Q` 2tKTH2-  bBKTH2 +?i T`QiQ+QH KB;?i +QMbBbi Q7 QM2 +QKTmi2`
b2M/BM; i?2 #Bib i?i `2T`2b2Mi i?2 i2ti dz*>h\Ǵ iQ MQi?2` K+?BM2
M/ i?2 Qi?2` `2bTQM/BM; rBi? dzPE5Ǵ iQ +QM}`K i?i Bi mM/2`biM/b i?2
T`QiQ+QHX h?2v +M i?2M T`Q+22/ iQ b2M/ 2+? Qi?2` bi`BM;b Q7 i2ti- `2/
i?2 i2ti b2Mi #v i?2 Qi?2` 7`QK i?2 M2irQ`F- M/ /BbTHv r?i2p2` i?2v
`2+2Bp2 QM i?2B` b+`22MbX
JQbi T`QiQ+QHb `2 #mBHi QM iQT Q7 Qi?2` T`QiQ+QHbX Pm` 2tKTH2 +?i
T`QiQ+QH i`2ib i?2 M2irQ`F b  bi`2KHBF2 /2pB+2 BMiQ r?B+? vQm +M Tmi
#Bib M/ ?p2 i?2K ``Bp2 i i?2 +Q``2+i /2biBMiBQM BM i?2 +Q``2+i Q`/2`X
1Mbm`BM; i?Qb2 i?BM;b Bb H`2/v  `i?2` /B{+mHi i2+?MB+H T`Q#H2KX
h?2 h`MbKBbbBQM *QMi`QH S`QiQ+QH Uh*SV Bb  T`QiQ+QH i?i bQHp2b
i?Bb T`Q#H2KX HH AMi2`M2i@+QMM2+i2/ /2pB+2b dzbT2FǴ Bi- M/ KQbi +QK@
KmMB+iBQM QM i?2 AMi2`M2i Bb #mBHi QM iQT Q7 BiX
 h*S +QMM2+iBQM rQ`Fb b 7QHHQrb, QM2 +QKTmi2` Kmbi #2 rBiBM;-
Q` HBbi2MBM;- 7Q` Qi?2` +QKTmi2`b iQ bi`i iHFBM; iQ BiX hQ #2 #H2 iQ
HBbi2M 7Q` /Bz2`2Mi FBM/b Q7 +QKKmMB+iBQM i i?2 bK2 iBK2 QM  bBM;H2
K+?BM2- 2+? HBbi2M2` ?b  MmK#2` U+HH2/  TQ`iV bbQ+Bi2/ rBi? BiX
JQbi T`QiQ+QHb bT2+B7v r?B+? TQ`i b?QmH/ #2 mb2/ #v /27mHiX 6Q` 2t@
KTH2- r?2M r2 rMi iQ b2M/ M 2KBH mbBM; i?2 aJhS T`QiQ+QH- i?2
K+?BM2 i?`Qm;? r?B+? r2 b2M/ Bi Bb 2tT2+i2/ iQ #2 HBbi2MBM; QM TQ`i k8X
MQi?2` +QKTmi2` +M i?2M 2bi#HBb?  +QMM2+iBQM #v +QMM2+iBM; iQ i?2
i`;2i K+?BM2 mbBM; i?2 +Q``2+i TQ`i MmK#2`X A7 i?2 i`;2i K+?BM2 +M
#2 `2+?2/ M/ Bb HBbi2MBM; QM i?i TQ`i- i?2 +QMM2+iBQM Bb bm++2bb7mHHv
+`2i2/X h?2 HBbi2MBM; +QKTmi2` Bb +HH2/ i?2 b2`p2`- M/ i?2 +QMM2+iBM;
+QKTmi2` Bb +HH2/ i?2 +HB2MiX
am+?  +QMM2+iBQM +ib b  irQ@rv TBT2 i?`Qm;? r?B+? #Bib +M ~Qrě
i?2 K+?BM2b QM #Qi? 2M/b +M Tmi /i BMiQ BiX PM+2 i?2 #Bib `2
bm++2bb7mHHv i`MbKBii2/- i?2v +M #2 `2/ Qmi ;BM #v i?2 K+?BM2 QM
i?2 Qi?2` bB/2X h?Bb Bb  +QMp2MB2Mi KQ/2HX uQm +QmH/ bv i?i h*S
T`QpB/2b M #bi`+iBQM Q7 i?2 M2irQ`FX

kkR
h?2 q2#
h?2 qQ`H/ qB/2 q2# UMQi iQ #2 +QM7mb2/ rBi? i?2 AMi2`M2i b  r?QH2V
Bb  b2i Q7 T`QiQ+QHb M/ 7Q`Kib i?i HHQr mb iQ pBbBi r2# T;2b BM 
#`Qrb2`X h?2 dzq2#Ǵ T`i BM i?2 MK2 `272`b iQ i?2 7+i i?i bm+? T;2b
+M 2bBHv HBMF iQ 2+? Qi?2`- i?mb +QMM2+iBM; BMiQ  ?m;2 K2b? i?i mb2`b
+M KQp2 i?`Qm;?X
hQ // +QMi2Mi iQ i?2 q2#- HH vQm M22/ iQ /Q Bb +QMM2+i  K+?BM2 iQ
i?2 AMi2`M2i- M/ ?p2 Bi HBbi2M QM TQ`i 3y- mbBM; i?2 >vT2`i2ti h`Mb@
72` S`QiQ+QH U>hhSVX h?Bb T`QiQ+QH HHQrb Qi?2` +QKTmi2`b iQ `2[m2bi
/Q+mK2Mib Qp2` i?2 M2irQ`FX
1+? /Q+mK2Mi QM i?2 q2# Bb MK2/ #v  lMB7Q`K _2bQm`+2 GQ+iQ`
Ul_GV- r?B+? HQQFb bQK2i?BM; HBF2 i?Bb,
http :// eloquentjavascript . net /12 _browser . html
| | | |
protocol server path

h?2 }`bi T`i i2HHb mb i?i i?Bb l_G mb2b i?2 >hhS T`QiQ+QH Ub QTTQb2/
iQ- 7Q` 2tKTH2- 2M+`vTi2/ >hhS- r?B+? rQmH/ #2 ?iiTb,ff VX h?2M +QK2b
i?2 T`i i?i B/2MiB}2b r?B+? b2`p2` r2 `2 `2[m2biBM; i?2 /Q+mK2Mi
7`QKX Gbi Bb  Ti? bi`BM; i?i B/2MiB}2b i?2 bT2+B}+ /Q+mK2Mi UQ`
`2bQm`+2V r2 `2 BMi2`2bi2/ BMX
1+? K+?BM2 +QMM2+i2/ iQ i?2 AMi2`M2i ;2ib  mMB[m2 AS //`2bb-
r?B+? HQQFb bQK2i?BM; HBF2 37.187.37.82X uQm +M mb2 i?2b2 /B`2+iHv b
i?2 b2`p2` T`i Q7  l_GX "mi HBbib Q7 KQ`2 Q` H2bb `M/QK MmK#2`b `2
?`/ iQ `2K2K#2` M/ rFr`/ iQ ivT2- bQ vQm +M BMbi2/ `2;Bbi2` 
/QKBM MK2 iQ TQBMi iQr`/  bT2+B}+ K+?BM2 Q` b2i Q7 K+?BM2bX A
`2;Bbi2`2/ 2HQ[m2MiDpb+`BTiXM2i iQ TQBMi i i?2 AS //`2bb Q7  K+?BM2
A +QMi`QH M/ +M i?mb mb2 i?i /QKBM MK2 iQ b2`p2 r2# T;2bX
A7 vQm ivT2 i?2 T`2pBQmb l_G BMiQ vQm` #`Qrb2`Ƕb //`2bb #`- Bi rBHH i`v
iQ `2i`B2p2 M/ /BbTHv i?2 /Q+mK2Mi i i?i l_GX 6B`bi- vQm` #`Qrb2`
?b iQ }M/ Qmi r?i //`2bb 2HQ[m2MiDpb+`BTiXM2i `272`b iQX h?2M- mbBM;
i?2 >hhS T`QiQ+QH- Bi KF2b  +QMM2+iBQM iQ i?2 b2`p2` i i?i //`2bb
M/ bFb 7Q` i?2 `2bQm`+2 fRkn#`Qrb2`X?iKHX
q2 rBHH iF2  +HQb2` HQQF i i?2 >hhS T`QiQ+QH BM *?Ti2` RdX

kkk
>hJG
>hJG- r?B+? biM/b 7Q` >vT2`i2ti J`FmT GM;m;2- Bb i?2 /Q+mK2Mi
7Q`Ki mb2/ 7Q` r2# T;2bX M >hJG /Q+mK2Mi +QMiBMb i2ti- b r2HH
b i;b i?i ;Bp2 bi`m+im`2 iQ i?2 i2ti- /2b+`B#BM; i?BM;b bm+? b HBMFb-
T`;`T?b- M/ ?2/BM;bX
 bBKTH2 >hJG /Q+mK2Mi HQQFb HBF2 i?Bb,
<! doctype html >
< html >
<head >
< title > My home page </ title >
</ head >
<body >
<h1 > My home page </ h1 >
<p > Hello , I am Marijn and this is my home page . </p >
<p > I also wrote a book ! Read it
<a href =" http :// eloquentjavascript . net "> here </a >. </p >
</ body >
</ html >

h?Bb Bb r?i bm+?  /Q+mK2Mi rQmH/ HQQF HBF2 BM i?2 #`Qrb2`,

h?2 i;b- r`TT2/ BM M;H2 #`+F2ib U< M/ >V- T`QpB/2 BM7Q`KiBQM #Qmi
i?2 bi`m+im`2 Q7 i?2 /Q+mK2MiX h?2 Qi?2` i2ti Bb Dmbi THBM i2tiX
h?2 /Q+mK2Mi bi`ib rBi? <!doctype html>- r?B+? i2HHb i?2 #`Qrb2` iQ
BMi2`T`2i Bi b KQ/2`M >hJG- b QTTQb2/ iQ p`BQmb /BH2+ib i?i r2`2
BM mb2 BM i?2 TbiX
>hJG /Q+mK2Mib ?p2  ?2/ M/  #Q/vX h?2 ?2/ +QMiBMb BM@
7Q`KiBQM #Qmi i?2 /Q+mK2Mi- M/ i?2 #Q/v +QMiBMb i?2 /Q+mK2Mi
Bib2H7X AM i?Bb +b2- r2 }`bi /2+H`2/ i?i i?2 iBiH2 Q7 i?Bb /Q+mK2Mi Bb
dzJv ?QK2 T;2Ǵ M/ i?2M ;p2  /Q+mK2Mi +QMiBMBM;  ?2/BM; U<h1>-
K2MBM; dz?2/BM; RǴě<h2> iQ <h6> T`Q/m+2 KQ`2 KBMQ` ?2/BM;bV M/

kkj
irQ T`;`T?b U<p>VX
h;b +QK2 BM b2p2`H 7Q`KbX M 2H2K2Mi- bm+? b i?2 #Q/v-  T`;`T?-
Q`  HBMF- Bb bi`i2/ #v M QT2MBM; i; HBF2 <p> M/ 2M/2/ #v  +HQbBM;
i; HBF2 </p>X aQK2 QT2MBM; i;b- bm+? b i?2 QM2 7Q` i?2 HBMF U<a>V-
+QMiBM 2ti` BM7Q`KiBQM BM i?2 7Q`K Q7 name="value" TB`bX h?2b2 `2
+HH2/ ii`B#mi2bX AM i?Bb +b2- i?2 /2biBMiBQM Q7 i?2 HBMF Bb BM/B+i2/
rBi? href="http://eloquentjavascript.net"- r?2`2 href biM/b 7Q` dz?vT2`i2ti
`272`2M+2ǴX
aQK2 FBM/b Q7 i;b /Q MQi 2M+HQb2 Mvi?BM; M/ i?mb /Q MQi M22/ iQ
#2 +HQb2/X M 2tKTH2 Q7 i?Bb rQmH/ #2 <img src="http://example.com/image
.jpg">- r?B+? rBHH /BbTHv i?2 BK;2 7QmM/ i i?2 ;Bp2M bQm`+2 l_GX
hQ #2 #H2 iQ BM+Hm/2 M;H2 #`+F2ib BM i?2 i2ti Q7  /Q+mK2Mi- 2p2M
i?Qm;? i?2v ?p2  bT2+BH K2MBM; BM >hJG- v2i MQi?2` 7Q`K Q7 bT2+BH
MQiiBQM ?b iQ #2 BMi`Q/m+2/X  THBM QT2MBM; M;H2 #`+F2i Bb r`Bii2M
b &lt; UdzH2bb i?MǴV- M/  +HQbBM; #`+F2i Bb r`Bii2M b &gt; Udz;`2i2`
i?MǴVX AM >hJG- M KT2`bM/ U&V +?`+i2` 7QHHQr2/ #v  rQ`/ M/
 b2KB+QHQM U;V Bb +HH2/ M 2MiBiv- M/ rBHH #2 `2TH+2/ #v i?2 +?`+i2`
Bi 2M+Q/2bX
h?Bb Bb MHQ;Qmb iQ i?2 rv #+FbHb?2b `2 mb2/ BM Cpa+`BTi bi`BM;bX
aBM+2 i?Bb K2+?MBbK ;Bp2b KT2`bM/ +?`+i2`b  bT2+BH K2MBM;- iQQ-
i?Qb2 M22/ iQ #2 2b+T2/ b &amp;X AMbB/2 M ii`B#mi2- r?B+? Bb r`TT2/
BM /Qm#H2 [mQi2b- &quot; +M #2 mb2/ iQ BMb2`i M +imH [mQi2 +?`+i2`X
>hJG Bb T`b2/ BM  `2K`F#Hv 2``Q`@iQH2`Mi rvX q?2M i;b i?i
b?QmH/ #2 i?2`2 `2 KBbbBM;- i?2 #`Qrb2` `2+QMbi`m+ib i?2KX h?2 rv BM
r?B+? i?Bb Bb /QM2 ?b #22M biM/`/Bx2/- M/ vQm +M `2Hv QM HH KQ/2`M
#`Qrb2`b iQ /Q Bi BM i?2 bK2 rvX
h?2 7QHHQrBM; /Q+mK2Mi rBHH #2 i`2i2/ Dmbi HBF2 i?2 QM2 b?QrM T`2pB@
QmbHv,
<! doctype html >

< title > My home page </ title >

<h1 > My home page </ h1 >


<p > Hello , I am Marijn and this is my home page .
<p > I also wrote a book ! Read it
<a href = http :// eloquentjavascript . net > here </a >.

kk9
h?2 <html>- <head>- M/ <body> i;b `2 ;QM2 +QKTH2i2HvX h?2 #`Qrb2`
FMQrb i?i <title> #2HQM;b BM  ?2/- M/ i?i <h1> BM  #Q/vX 6m`i?2`@
KQ`2- A K MQ HQM;2` 2tTHB+BiHv +HQbBM; i?2 T`;`T?b bBM+2 QT2MBM; 
M2r T`;`T? Q` 2M/BM; i?2 /Q+mK2Mi rBHH +HQb2 i?2K BKTHB+BiHvX h?2
[mQi2b `QmM/ i?2 HBMF i`;2i `2 HbQ ;QM2X
h?Bb #QQF rBHH mbmHHv QKBi i?2 <html>- <head>- M/ <body> i;b 7`QK
2tKTH2b iQ F22T i?2K b?Q`i M/ 7`22 Q7 +Hmii2`X "mi A rBHH +HQb2 i;b
M/ BM+Hm/2 [mQi2b `QmM/ ii`B#mi2bX
A rBHH HbQ mbmHHv QKBi i?2 /Q+ivT2X h?Bb Bb MQi iQ #2 iF2M b M
2M+Qm`;2K2Mi iQ QKBi /Q+ivT2 /2+H`iBQMbX "`Qrb2`b rBHH Q7i2M /Q
`B/B+mHQmb i?BM;b r?2M vQm 7Q`;2i i?2KX uQm b?QmH/ +QMbB/2` /Q+ivT2b
BKTHB+BiHv T`2b2Mi BM 2tKTH2b- 2p2M r?2M i?2v `2 MQi +imHHv b?QrM
BM i?2 i2tiX

>hJG M/ Cpa+`BTi


AM i?2 +QMi2ti Q7 i?Bb #QQF- i?2 KQbi BKTQ`iMi >hJG i; Bb <script>X
h?Bb i; HHQrb mb iQ BM+Hm/2  TB2+2 Q7 Cpa+`BTi BM  /Q+mK2MiX
<h1 > Testing alert </ h1 >
< script > alert (" hello !") ; </ script >

am+?  b+`BTi rBHH `mM b bQQM b Bib <script> i; Bb 2M+QmMi2`2/ b i?2
#`Qrb2` `2/b i?2 >hJGX h?2 T;2 b?QrM 2`HB2` rBHH TQT mT M alert
/BHQ; r?2M QT2M2/X
AM+Hm/BM; H`;2 T`Q;`Kb /B`2+iHv BM >hJG /Q+mK2Mib Bb Q7i2M BK@
T`+iB+HX h?2 <script> i; +M #2 ;Bp2M M src ii`B#mi2 BM Q`/2` iQ 72i+?
 b+`BTi }H2 U i2ti }H2 +QMiBMBM;  Cpa+`BTi T`Q;`KV 7`QK  l_GX
<h1 > Testing alert </ h1 >
< script src =" code / hello . js " > </ script >

h?2 +Q/2f?2HHQXDb }H2 BM+Hm/2/ ?2`2 +QMiBMb i?2 bK2 bBKTH2 T`Q;`K-
alert("hello!")X q?2M M >hJG T;2 `272`2M+2b Qi?2` l_Gb b T`i Q7
Bib2H7- 7Q` 2tKTH2 M BK;2 }H2 Q`  b+`BTiěr2# #`Qrb2`b rBHH `2i`B2p2
i?2K BKK2/Bi2Hv M/ BM+Hm/2 i?2K BM i?2 T;2X
 b+`BTi i; Kmbi Hrvb #2 +HQb2/ rBi? </script>- 2p2M B7 Bi `272`b iQ
 b+`BTi }H2 M/ /Q2bMǶi +QMiBM Mv +Q/2X A7 vQm 7Q`;2i i?Bb- i?2 `2bi Q7

kk8
i?2 T;2 rBHH #2 BMi2`T`2i2/ b T`i Q7 i?2 b+`BTiX
aQK2 ii`B#mi2b +M HbQ +QMiBM  Cpa+`BTi T`Q;`KX h?2 <button>
i; b?QrM M2ti Ur?B+? b?Qrb mT b  #miiQMV ?b M onclick ii`B#mi2-
r?Qb2 +QMi2Mi rBHH #2 `mM r?2M2p2` i?2 #miiQM Bb +HB+F2/X
< button onclick =" alert ( Boom ! ) ;" > DO NOT PRESS </ button >

LQi2 i?i A ?/ iQ mb2 bBM;H2 [mQi2b 7Q` i?2 bi`BM; BM i?2 onclick ii`B#mi2
#2+mb2 /Qm#H2 [mQi2b `2 H`2/v mb2/ iQ [mQi2 i?2 r?QH2 ii`B#mi2X A
+QmH/ HbQ ?p2 mb2/ &quot;- #mi i?iǶ/ KF2 i?2 T`Q;`K ?`/2` iQ `2/X

AM i?2 bM/#Qt
_mMMBM; T`Q;`Kb /QrMHQ/2/ 7`QK i?2 AMi2`M2i Bb TQi2MiBHHv /M;2`@
QmbX uQm /Q MQi FMQr Km+? #Qmi i?2 T2QTH2 #2?BM/ KQbi bBi2b vQm
pBbBi- M/ i?2v /Q MQi M2+2bb`BHv K2M r2HHX _mMMBM; T`Q;`Kb #v T2Q@
TH2 r?Q /Q MQi K2M r2HH Bb ?Qr vQm ;2i vQm` +QKTmi2` BM72+i2/ #v
pB`mb2b- vQm` /i biQH2M- M/ vQm` ++QmMib ?+F2/X
u2i i?2 ii`+iBQM Q7 i?2 q2# Bb i?i vQm +M bm`7 Bi rBi?Qmi M2+2bb`BHv
i`mbiBM; HH i?2 T;2b vQm pBbBiX h?Bb Bb r?v #`Qrb2`b b2p2`2Hv HBKBi
i?2 i?BM;b  Cpa+`BTi T`Q;`K Kv /Q, Bi +MǶi HQQF i i?2 }H2b QM
vQm` +QKTmi2` Q` KQ/B7v Mvi?BM; MQi `2Hi2/ iQ i?2 r2# T;2 Bi rb
2K#2//2/ BMX
AbQHiBM;  T`Q;`KKBM; 2MpB`QMK2Mi BM i?Bb rv Bb +HH2/ bM/#QtBM;-
i?2 B/2 #2BM; i?i i?2 T`Q;`K Bb ?`KH2bbHv THvBM; BM  bM/#QtX "mi
vQm b?QmH/ BK;BM2 i?Bb T`iB+mH` FBM/ Q7 bM/#Qt b ?pBM;  +;2 Q7
i?B+F bi22H #`b Qp2` Bi- r?B+? KF2b Bi bQK2r?i /Bz2`2Mi 7`QK vQm`
ivTB+H THv;`QmM/ bM/#QtX
h?2 ?`/ T`i Q7 bM/#QtBM; Bb HHQrBM; i?2 T`Q;`Kb 2MQm;? `QQK
iQ #2 mb27mH v2i i i?2 bK2 iBK2 `2bi`B+iBM; i?2K 7`QK /QBM; Mvi?BM;
/M;2`QmbX GQib Q7 mb27mH 7mM+iBQMHBiv- bm+? b +QKKmMB+iBM; rBi?
Qi?2` b2`p2`b Q` `2/BM; i?2 +QMi2Mi Q7 i?2 +QTv@Tbi2 +HBT#Q`/- +M
HbQ #2 mb2/ iQ /Q T`Q#H2KiB+- T`Bp+v@BMp/BM; i?BM;bX
1p2`v MQr M/ i?2M- bQK2QM2 +QK2b mT rBi?  M2r rv iQ +B`+mKp2Mi
i?2 HBKBiiBQMb Q7  #`Qrb2` M/ /Q bQK2i?BM; ?`K7mH- `M;BM; 7`QK
H2FBM; KBMQ` T`Bpi2 BM7Q`KiBQM iQ iFBM; Qp2` i?2 r?QH2 K+?BM2 i?i
i?2 #`Qrb2` `mMb QMX h?2 #`Qrb2` /2p2HQT2`b `2bTQM/ #v }tBM; i?2 ?QH2-

kke
M/ HH Bb r2HH ;BMěi?i Bb- mMiBH i?2 M2ti T`Q#H2K Bb /Bb+Qp2`2/- M/
?QT27mHHv Tm#HB+Bx2/- `i?2` i?M b2+`2iHv 2tTHQBi2/ #v bQK2 ;Qp2`MK2Mi
Q` K}X

*QKTiB#BHBiv M/ i?2 #`Qrb2` r`b


AM i?2 2`Hv bi;2b Q7 i?2 q2#-  #`Qrb2` +HH2/ JQbB+ /QKBMi2/ i?2
K`F2iX 7i2`  72r v2`b- i?2 #HM+2 ?/ b?B7i2/ iQ L2ib+T2- r?B+?
rb i?2M- BM im`M- H`;2Hv bmTTHMi2/ #v JB+`QbQ7iǶb AMi2`M2i 1tTHQ`2`X
i Mv TQBMi r?2`2  bBM;H2 #`Qrb2` rb /QKBMMi- i?i #`Qrb2`Ƕb p2M/Q`
rQmH/ 722H 2MiBiH2/ iQ mMBHi2`HHv BMp2Mi M2r 72im`2b 7Q` i?2 q2#X aBM+2
KQbi mb2`b mb2/ i?2 bK2 #`Qrb2`- r2#bBi2b rQmH/ bBKTHv bi`i mbBM;
i?Qb2 72im`2běM2p2` KBM/ i?2 Qi?2` #`Qrb2`bX
h?Bb rb i?2 /`F ;2 Q7 +QKTiB#BHBiv- Q7i2M +HH2/ i?2 #`Qrb2` r`bX
q2# /2p2HQT2`b r2`2 H27i rBi? MQi QM2 mMB}2/ q2# #mi irQ Q` i?`22 BM@
+QKTiB#H2 THi7Q`KbX hQ KF2 i?BM;b rQ`b2- i?2 #`Qrb2`b BM mb2 `QmM/
kyyj r2`2 HH 7mHH Q7 #m;b- M/ Q7 +Qm`b2 i?2 #m;b r2`2 /Bz2`2Mi 7Q` 2+?
#`Qrb2`X GB72 rb ?`/ 7Q` T2QTH2 r`BiBM; r2# T;2bX
JQxBHH 6B`27Qt-  MQi@7Q`@T`Q}i Qzb?QQi Q7 L2ib+T2- +?HH2M;2/ AM@
i2`M2i 1tTHQ`2`Ƕb ?2;2KQMv BM i?2 Hi2 kyyybX "2+mb2 JB+`QbQ7i rb
MQi T`iB+mH`Hv BMi2`2bi2/ BM bivBM; +QKT2iBiBp2 i i?2 iBK2- 6B`27Qt
iQQF [mBi2  +?mMF Q7 K`F2i b?`2 rv 7`QK BiX `QmM/ i?2 bK2
iBK2- :QQ;H2 BMi`Q/m+2/ Bib *?`QK2 #`Qrb2`- M/ TTH2Ƕb a7`B #`Qrb2`
;BM2/ TQTmH`Biv- H2/BM; iQ  bBimiBQM r?2`2 i?2`2 r2`2 7Qm` KDQ`
THv2`b- `i?2` i?M QM2X
h?2 M2r THv2`b ?/  KQ`2 b2`BQmb iiBim/2 iQr`/ biM/`/b M/
#2ii2` 2M;BM22`BM; T`+iB+2b- H2/BM; iQ H2bb BM+QKTiB#BHBiv M/ 72r2`
#m;bX JB+`QbQ7i- b22BM; Bib K`F2i b?`2 +`mK#H2- +K2 `QmM/ M/
/QTi2/ i?2b2 iiBim/2bX A7 vQm `2 bi`iBM; iQ H2`M r2# /2p2HQTK2Mi
iQ/v- +QMbB/2` vQm`b2H7 Hm+FvX h?2 Hi2bi p2`bBQMb Q7 i?2 KDQ` #`Qrb2`b
#2?p2 [mBi2 mMB7Q`KHv M/ ?p2 `2HiBp2Hv 72r #m;bX
h?i Bb MQi iQ bv i?i i?2 bBimiBQM Bb T2`72+i Dmbi v2iX aQK2 Q7 i?2
T2QTH2 mbBM; i?2 q2# `2- 7Q` `2bQMb Q7 BM2`iB Q` +Q`TQ`i2 TQHB+v- bim+F
rBi? p2`v QH/ #`Qrb2`bX lMiBH i?Qb2 #`Qrb2`b /B2 Qmi 2MiB`2Hv- r`BiBM;
r2#bBi2b i?i rQ`F 7Q` i?2K rBHH `2[mB`2  HQi Q7 `+M2 FMQrH2/;2 #Qmi
i?2B` b?Q`i+QKBM;b M/ [mB`FbX h?Bb #QQF Bb MQi #Qmi i?Qb2 [mB`FbX

kkd
_i?2`- Bi BKb iQ T`2b2Mi i?2 KQ/2`M- bM2 bivH2 Q7 r2# T`Q;`KKBM;X

kk3
Rj h?2 .Q+mK2Mi P#D2+i
JQ/2H
q?2M vQm QT2M  r2# T;2 BM vQm` #`Qrb2`- i?2 #`Qrb2` `2i`B2p2b i?2
T;2Ƕb >hJG i2ti M/ T`b2b Bi- Km+? HBF2 i?2 rv Qm` T`b2` 7`QK
*?Ti2` RR T`b2/ T`Q;`KbX h?2 #`Qrb2` #mBH/b mT  KQ/2H Q7 i?2
/Q+mK2MiǶb bi`m+im`2 M/ i?2M mb2b i?Bb KQ/2H iQ /`r i?2 T;2 QM i?2
b+`22MX
h?Bb `2T`2b2MiiBQM Q7 i?2 /Q+mK2Mi Bb QM2 Q7 i?2 iQvb i?i  Cpa+`BTi
T`Q;`K ?b pBH#H2 BM Bib bM/#QtX uQm +M `2/ 7`QK i?2 KQ/2H M/
HbQ +?M;2 BiX Ai +ib b  HBp2 /i bi`m+im`2, r?2M Bi Bb KQ/B}2/- i?2
T;2 QM i?2 b+`22M Bb mT/i2/ iQ `2~2+i i?2 +?M;2bX

.Q+mK2Mi bi`m+im`2
uQm +M BK;BM2 M >hJG /Q+mK2Mi b  M2bi2/ b2i Q7 #Qt2bX h;b
bm+? b <body> M/ </body> 2M+HQb2 Qi?2` i;b- r?B+? BM im`M +QMiBM Qi?2`
i;b Q` i2tiX >2`2Ƕb i?2 2tKTH2 /Q+mK2Mi 7`QK i?2 T`2pBQmb +?Ti2`,
<! doctype html >
< html >
<head >
< title > My home page </ title >
</ head >
<body >
<h1 > My home page </ h1 >
<p > Hello , I am Marijn and this is my home page . </p >
<p > I also wrote a book ! Read it
<a href =" http :// eloquentjavascript . net "> here </a >. </p >
</ body >
</ html >

h?Bb T;2 ?b i?2 7QHHQrBM; bi`m+im`2,

kkN
html

head

title
My home page

body

h1
My home page

p
Hello, I am Marijn and this is...

p
a
I also wrote a book! Read ithere .

h?2 /i bi`m+im`2 i?2 #`Qrb2` mb2b iQ `2T`2b2Mi i?2 /Q+mK2Mi 7QHHQrb
i?Bb b?T2X 6Q` 2+? #Qt- i?2`2 Bb M Q#D2+i- r?B+? r2 +M BMi2`+i rBi?
iQ }M/ Qmi i?BM;b bm+? b r?i >hJG i; Bi `2T`2b2Mib M/ r?B+? #Qt2b
M/ i2ti Bi +QMiBMbX h?Bb `2T`2b2MiiBQM Bb +HH2/ i?2 .Q+mK2Mi P#D2+i
JQ/2H- Q` .PJ 7Q` b?Q`iX
h?2 ;HQ#H p`B#H2 document ;Bp2b mb ++2bb iQ i?2b2 Q#D2+ibX Aib documentElement
T`QT2`iv `272`b iQ i?2 Q#D2+i `2T`2b2MiBM; i?2 <html> i;X Ai HbQ T`QpB/2b
i?2 T`QT2`iB2b head M/ body- r?B+? ?QH/ i?2 Q#D2+ib 7Q` i?Qb2 2H2K2MibX

h`22b
h?BMF #+F iQ i?2 bvMit i`22b 7`QK *?Ti2` RR 7Q`  KQK2MiX h?2B`
bi`m+im`2b `2 bi`BFBM;Hv bBKBH` iQ i?2 bi`m+im`2 Q7  #`Qrb2`Ƕb /Q+mK2MiX
1+? MQ/2 Kv `272` iQ Qi?2` MQ/2b- +?BH/`2M- r?B+? BM im`M Kv ?p2
i?2B` QrM +?BH/`2MX h?Bb b?T2 Bb ivTB+H Q7 M2bi2/ bi`m+im`2b r?2`2
2H2K2Mib +M +QMiBM bm#@2H2K2Mib i?i `2 bBKBH` iQ i?2Kb2Hp2bX

kjy
q2 +HH  /i bi`m+im`2  i`22 r?2M Bi ?b  #`M+?BM; bi`m+im`2-
?b MQ +v+H2b U MQ/2 Kv MQi +QMiBM Bib2H7- /B`2+iHv Q` BM/B`2+iHvV-
M/ ?b  bBM;H2- r2HH@/2}M2/ dz`QQiǴX AM i?2 +b2 Q7 i?2 .PJ- document.
documentElement b2`p2b b i?2 `QQiX
h`22b +QK2 mT  HQi BM +QKTmi2` b+B2M+2X AM //BiBQM iQ `2T`2b2MiBM;
`2+m`bBp2 bi`m+im`2b bm+? b >hJG /Q+mK2Mib Q` T`Q;`Kb- i?2v `2
Q7i2M mb2/ iQ KBMiBM bQ`i2/ b2ib Q7 /i #2+mb2 2H2K2Mib +M mbmHHv
#2 7QmM/ Q` BMb2`i2/ KQ`2 2{+B2MiHv BM  bQ`i2/ i`22 i?M BM  bQ`i2/ ~i
``vX
 ivTB+H i`22 ?b /Bz2`2Mi FBM/b Q7 MQ/2bX h?2 bvMit i`22 7Q` i?2
1;; HM;m;2 ?/ p`B#H2b- pHm2b- M/ TTHB+iBQM MQ/2bX TTHB+iBQM
MQ/2b Hrvb ?p2 +?BH/`2M- r?2`2b p`B#H2b M/ pHm2b `2 H2p2b- Q`
MQ/2b rBi?Qmi +?BH/`2MX
h?2 bK2 ;Q2b 7Q` i?2 .PJX LQ/2b 7Q` `2;mH` 2H2K2Mib- r?B+? `2T`2@
b2Mi >hJG i;b- /2i2`KBM2 i?2 bi`m+im`2 Q7 i?2 /Q+mK2MiX h?2b2 +M
?p2 +?BH/ MQ/2bX M 2tKTH2 Q7 bm+?  MQ/2 Bb document.bodyX aQK2
Q7 i?2b2 +?BH/`2M +M #2 H27 MQ/2b- bm+? b TB2+2b Q7 i2ti Q` +QKK2Mib
U+QKK2Mib `2 r`Bii2M #2ir22M <!-- M/ --> BM >hJGVX
1+? .PJ MQ/2 Q#D2+i ?b  nodeType T`QT2`iv- r?B+? +QMiBMb  Mm@
K2`B+ +Q/2 i?i B/2MiB}2b i?2 ivT2 Q7 MQ/2X _2;mH` 2H2K2Mib ?p2
i?2 pHm2 R- r?B+? Bb HbQ /2}M2/ b i?2 +QMbiMi T`QT2`iv document.
ELEMENT_NODEX h2ti MQ/2b- `2T`2b2MiBM;  b2+iBQM Q7 i2ti BM i?2 /Q+m@
K2Mi- ?p2 i?2 pHm2 j Udocument.TEXT_NODEVX *QKK2Mib ?p2 i?2 pHm2 3
Udocument.COMMENT_NODEVX
aQ MQi?2` rv iQ pBbmHBx2 Qm` /Q+mK2Mi i`22 Bb b 7QHHQrb,

html head title My home page

body h1 My home page

p Hello! I am...

p I also wrote...

a here

kjR
h?2 H2p2b `2 i2ti MQ/2b- M/ i?2 ``Qrb BM/B+i2 T`2Mi@+?BH/ `2HiBQM@
b?BTb #2ir22M MQ/2bX

h?2 biM/`/
lbBM; +`vTiB+ MmK2`B+ +Q/2b iQ `2T`2b2Mi MQ/2 ivT2b Bb MQi  p2`v Cpa+`BTi@
HBF2 i?BM; iQ /QX Gi2` BM i?Bb +?Ti2`- r2ǶHH b22 i?i Qi?2` T`ib Q7 i?2
.PJ BMi2`7+2 HbQ 722H +mK#2`bQK2 M/ HB2MX h?2 `2bQM 7Q` i?Bb Bb
i?i i?2 .PJ rbMǶi /2bB;M2/ 7Q` Dmbi Cpa+`BTiX _i?2`- Bi i`B2b iQ
/2}M2  HM;m;2@M2mi`H BMi2`7+2 i?i +M #2 mb2/ BM Qi?2` bvbi2Kb b
r2HHěMQi Dmbi >hJG #mi HbQ sJG- r?B+? Bb  ;2M2`B+ /i 7Q`Ki rBi?
M >hJG@HBF2 bvMitX
h?Bb Bb mM7Q`imMi2X aiM/`/b `2 Q7i2M mb27mHX "mi BM i?Bb +b2- i?2
/pMi;2 U+`Qbb@HM;m;2 +QMbBbi2M+vV BbMǶi HH i?i +QKT2HHBM;X >pBM;
M BMi2`7+2 i?i Bb T`QT2`Hv BMi2;`i2/ rBi? i?2 HM;m;2 vQm `2 mbBM;
rBHH bp2 vQm KQ`2 iBK2 i?M ?pBM;  7KBHB` BMi2`7+2 +`Qbb HM;m;2bX
b M 2tKTH2 Q7 bm+? TQQ` BMi2;`iBQM- +QMbB/2` i?2 childNodes T`QT@
2`iv i?i 2H2K2Mi MQ/2b BM i?2 .PJ ?p2X h?Bb T`QT2`iv ?QH/b M ``v@
HBF2 Q#D2+i- rBi?  length T`QT2`iv M/ T`QT2`iB2b H#2H2/ #v MmK#2`b iQ
++2bb i?2 +?BH/ MQ/2bX "mi Bi Bb M BMbiM+2 Q7 i?2 NodeList ivT2- MQi 
`2H ``v- bQ Bi /Q2b MQi ?p2 K2i?Q/b bm+? b slice M/ forEachX
h?2M i?2`2 `2 Bbbm2b i?i `2 bBKTHv TQQ` /2bB;MX 6Q` 2tKTH2- i?2`2 Bb
MQ rv iQ +`2i2  M2r MQ/2 M/ BKK2/Bi2Hv // +?BH/`2M Q` ii`B#mi2b
iQ BiX AMbi2/- vQm ?p2 iQ }`bi +`2i2 Bi- i?2M // i?2 +?BH/`2M QM2 #v
QM2- M/ }MHHv b2i i?2 ii`B#mi2b QM2 #v QM2- mbBM; bB/2 2z2+ibX *Q/2
i?i BMi2`+ib ?2pBHv rBi? i?2 .PJ i2M/b iQ ;2i HQM;- `2T2iBiBp2- M/
m;HvX
"mi i?2b2 ~rb `2MǶi 7iHX aBM+2 Cpa+`BTi HHQrb mb iQ +`2i2 Qm`
QrM #bi`+iBQMb- Bi Bb 2bv iQ r`Bi2 bQK2 ?2HT2` 7mM+iBQMb i?i HHQr vQm
iQ 2tT`2bb i?2 QT2`iBQMb vQm `2 T2`7Q`KBM; BM  +H2`2` M/ b?Q`i2`
rvX AM 7+i- KMv HB#``B2b BMi2M/2/ 7Q` #`Qrb2` T`Q;`KKBM; +QK2
rBi? bm+? iQQHbX

kjk
JQpBM; i?`Qm;? i?2 i`22
.PJ MQ/2b +QMiBM  r2Hi? Q7 HBMFb iQ Qi?2` M2`#v MQ/2bX h?2 7QH@
HQrBM; /B;`K BHHmbi`i2b i?2b2,
childNodes firstChild
body

0 h1
My home page
previousSibling
1 p
Hello, I am Marijn... parentNode

nextSibling
2 p
I also wrote a book! ...

lastChild

Hi?Qm;? i?2 /B;`K b?Qrb QMHv QM2 HBMF Q7 2+? ivT2- 2p2`v MQ/2 ?b
 parentNode T`QT2`iv i?i TQBMib iQ Bib +QMiBMBM; MQ/2X GBF2rBb2- 2p2`v
2H2K2Mi MQ/2 UMQ/2 ivT2 RV ?b  childNodes T`QT2`iv i?i TQBMib iQ M
``v@HBF2 Q#D2+i ?QH/BM; Bib +?BH/`2MX
AM i?2Q`v- vQm +QmH/ KQp2 Mvr?2`2 BM i?2 i`22 mbBM; Dmbi i?2b2 T`2Mi
M/ +?BH/ HBMFbX "mi Cpa+`BTi HbQ ;Bp2b vQm ++2bb iQ  MmK#2` Q7 /@
/BiBQMH +QMp2MB2M+2 HBMFbX h?2 firstChild M/ lastChild T`QT2`iB2b TQBMi
iQ i?2 }`bi M/ Hbi +?BH/ 2H2K2Mib Q` ?p2 i?2 pHm2 null 7Q` MQ/2b rBi?@
Qmi +?BH/`2MX aBKBH`Hv- previousSibling M/ nextSibling TQBMi iQ /D+2Mi
MQ/2b- r?B+? `2 MQ/2b rBi? i?2 bK2 T`2Mi i?i TT2` BKK2/Bi2Hv
#27Q`2 Q` 7i2` i?2 MQ/2 Bib2H7X 6Q`  }`bi +?BH/- previousSibling rBHH #2
MmHH- M/ 7Q`  Hbi +?BH/- nextSibling rBHH #2 MmHHX
q?2M /2HBM; rBi?  M2bi2/ /i bi`m+im`2 HBF2 i?Bb QM2- `2+m`bBp2
7mM+iBQMb `2 Q7i2M mb27mHX h?2 7QHHQrBM; `2+m`bBp2 7mM+iBQM b+Mb  /Q+@
mK2Mi 7Q` i2ti MQ/2b +QMiBMBM;  ;Bp2M bi`BM; M/ `2im`Mb true r?2M Bi
?b 7QmM/ QM2,
function talksAbout ( node , string ) {
if ( node . nodeType == document . ELEMENT_NODE ) {
for ( var i = 0; i < node . childNodes . length ; i ++) {

kjj
if ( talksAbout ( node . childNodes [ i ] , string ) )
return true ;
}
return false ;
} else if ( node . nodeType == document . TEXT_NODE ) {
return node . nodeValue . indexOf ( string ) > -1;
}
}

console . log ( talksAbout ( document . body , " book ") ) ;


// → true

h?2 nodeValue T`QT2`iv Q7  i2ti MQ/2 `272`b iQ i?2 bi`BM; Q7 i2ti i?i Bi
`2T`2b2MibX

6BM/BM; 2H2K2Mib
LpB;iBM; i?2b2 HBMFb KQM; T`2Mib- +?BH/`2M- M/ bB#HBM;b Bb Q7i2M mb2@
7mH- b BM i?2 T`2pBQmb 7mM+iBQM- r?B+? `mMb i?`Qm;? i?2 r?QH2 /Q+mK2MiX
"mi B7 r2 rMi iQ }M/  bT2+B}+ MQ/2 BM i?2 /Q+mK2Mi- `2+?BM; Bi #v
bi`iBM; i document.body M/ #HBM/Hv 7QHHQrBM;  ?`/@+Q/2/ Ti? Q7 HBMFb
Bb  #/ B/2X .QBM; bQ #F2b bbmKTiBQMb BMiQ Qm` T`Q;`K #Qmi i?2
T`2+Bb2 bi`m+im`2 Q7 i?2 /Q+mK2Miě bi`m+im`2 r2 KB;?i rMi iQ +?M;2
Hi2`X MQi?2` +QKTHB+iBM; 7+iQ` Bb i?i i2ti MQ/2b `2 +`2i2/ 2p2M 7Q`
i?2 r?Bi2bT+2 #2ir22M MQ/2bX h?2 2tKTH2 /Q+mK2MiǶb #Q/v i; /Q2b
MQi ?p2 Dmbi i?`22 +?BH/`2M U<h1> M/ irQ <p> 2H2K2MibV #mi +imHHv ?b
b2p2M, i?Qb2 i?`22- THmb i?2 bT+2b #27Q`2- 7i2`- M/ #2ir22M i?2KX
aQ B7 r2 rMi iQ ;2i i?2 href ii`B#mi2 Q7 i?2 HBMF BM i?i /Q+mK2Mi- r2
/QMǶi rMi iQ bv bQK2i?BM; HBF2 dz:2i i?2 b2+QM/ +?BH/ Q7 i?2 bBti? +?BH/
Q7 i?2 /Q+mK2Mi #Q/vǴX AiǶ/ #2 #2ii2` B7 r2 +QmH/ bv dz:2i i?2 }`bi HBMF
BM i?2 /Q+mK2MiǴX M/ r2 +MX
var link = document . body . getElementsByTagName (" a ") [0];
console . log ( link . href ) ;

HH 2H2K2Mi MQ/2b ?p2  getElementsByTagName K2i?Q/- r?B+? +QHH2+ib HH


2H2K2Mib rBi? i?2 ;Bp2M i; MK2 i?i `2 /2b+2M/Mib U/B`2+i Q` BM/B`2+i
+?BH/`2MV Q7 i?2 ;Bp2M MQ/2 M/ `2im`Mb i?2K b M ``v@HBF2 Q#D2+iX
hQ }M/  bT2+B}+ bBM;H2 MQ/2- vQm +M ;Bp2 Bi M id ii`B#mi2 M/ mb2

kj9
document.getElementById BMbi2/X
<p > My ostrich Gertrude : </p >
<p > < img id =" gertrude " src =" img / ostrich . png " > </p >

< script >


var ostrich = document . getElementById (" gertrude ") ;
console . log ( ostrich . src );
</ script >

 i?B`/- bBKBH` K2i?Q/ Bb getElementsByClassName- r?B+?- HBF2 getElementsByTagName


- b2`+?2b i?`Qm;? i?2 +QMi2Mib Q7 M 2H2K2Mi MQ/2 M/ `2i`B2p2b HH
2H2K2Mib i?i ?p2 i?2 ;Bp2M bi`BM; BM i?2B` class ii`B#mi2X

*?M;BM; i?2 /Q+mK2Mi


HKQbi 2p2`vi?BM; #Qmi i?2 .PJ /i bi`m+im`2 +M #2 +?M;2/X 1H2@
K2Mi MQ/2b ?p2  MmK#2` Q7 K2i?Q/b i?i +M #2 mb2/ iQ +?M;2 i?2B`
+QMi2MiX h?2 removeChild K2i?Q/ `2KQp2b i?2 ;Bp2M +?BH/ MQ/2 7`QK i?2
/Q+mK2MiX hQ //  +?BH/- r2 +M mb2 appendChild- r?B+? Tmib Bi i i?2
2M/ Q7 i?2 HBbi Q7 +?BH/`2M- Q` insertBefore- r?B+? BMb2`ib i?2 MQ/2 ;Bp2M
b i?2 }`bi `;mK2Mi #27Q`2 i?2 MQ/2 ;Bp2M b i?2 b2+QM/ `;mK2MiX
<p > One </ p >
<p > Two </ p >
<p > Three </ p >

< script >


var paragraphs = document . body . getElementsByTagName (" p ") ;
document . body . insertBefore ( paragraphs [2] , paragraphs [0]) ;
</ script >

 MQ/2 +M 2tBbi BM i?2 /Q+mK2Mi BM QMHv QM2 TH+2X h?mb- BMb2`iBM;
T`;`T? dzh?`22Ǵ BM 7`QMi Q7 T`;`T? dzPM2Ǵ rBHH }`bi `2KQp2 Bi 7`QK
i?2 2M/ Q7 i?2 /Q+mK2Mi M/ i?2M BMb2`i Bi i i?2 7`QMi- `2bmHiBM; BM
dzh?`22fPM2fhrQǴX HH QT2`iBQMb i?i BMb2`i  MQ/2 bQK2r?2`2 rBHH- b
 bB/2 2z2+i- +mb2 Bi iQ #2 `2KQp2/ 7`QK Bib +m``2Mi TQbBiBQM UB7 Bi ?b
QM2VX
h?2 replaceChild K2i?Q/ Bb mb2/ iQ `2TH+2  +?BH/ MQ/2 rBi? MQi?2`
QM2X Ai iF2b b `;mK2Mib irQ MQ/2b,  M2r MQ/2 M/ i?2 MQ/2 iQ #2

kj8
`2TH+2/X h?2 `2TH+2/ MQ/2 Kmbi #2  +?BH/ Q7 i?2 2H2K2Mi i?2 K2i?Q/
Bb +HH2/ QMX LQi2 i?i #Qi? replaceChild M/ insertBefore 2tT2+i i?2 M2r
MQ/2 b i?2B` }`bi `;mK2MiX

*`2iBM; MQ/2b
AM i?2 7QHHQrBM; 2tKTH2- r2 rMi iQ r`Bi2  b+`BTi i?i `2TH+2b HH
BK;2b U<img> i;bV BM i?2 /Q+mK2Mi rBi? i?2 i2ti ?2H/ BM i?2B` alt i@
i`B#mi2b- r?B+? bT2+B}2b M Hi2`MiBp2 i2timH `2T`2b2MiiBQM Q7 i?2 BK@
;2X
h?Bb BMpQHp2b MQi QMHv `2KQpBM; i?2 BK;2b #mi //BM;  M2r i2ti MQ/2
iQ `2TH+2 i?2KX 6Q` i?Bb- r2 mb2 i?2 document.createTextNode K2i?Q/X
<p > The < img src =" img / cat . png " alt =" Cat " > in the
< img src =" img / hat . png " alt =" Hat " >. </p >

<p > < button onclick =" replaceImages () " > Replace </ button > </p >

< script >


function replaceImages () {
var images = document . body . getElementsByTagName (" img ") ;
for ( var i = images . length - 1; i >= 0; i - -) {
var image = images [ i ];
if ( image . alt ) {
var text = document . createTextNode ( image . alt ) ;
image . parentNode . replaceChild ( text , image );
}
}
}
</ script >

:Bp2M  bi`BM;- createTextNode ;Bp2b mb  ivT2 j .PJ MQ/2 U i2ti MQ/2V-


r?B+? r2 +M BMb2`i BMiQ i?2 /Q+mK2Mi iQ KF2 Bi b?Qr mT QM i?2 b+`22MX
h?2 HQQT i?i ;Q2b Qp2` i?2 BK;2b bi`ib i i?2 2M/ Q7 i?2 HBbi Q7
MQ/2bX h?Bb Bb M2+2bb`v #2+mb2 i?2 MQ/2 HBbi `2im`M2/ #v  K2i?Q/
HBF2 getElementsByTagName UQ`  T`QT2`iv HBF2 childNodesV Bb HBp2X h?i Bb-
Bi Bb mT/i2/ b i?2 /Q+mK2Mi +?M;2bX A7 r2 bi`i2/ 7`QK i?2 7`QMi-
`2KQpBM; i?2 }`bi BK;2 rQmH/ +mb2 i?2 HBbi iQ HQb2 Bib }`bi 2H2K2Mi bQ
i?i i?2 b2+QM/ iBK2 i?2 HQQT `2T2ib- r?2`2 i Bb R- Bi rQmH/ biQT #2+mb2

kje
i?2 H2M;i? Q7 i?2 +QHH2+iBQM Bb MQr HbQ RX
A7 vQm rMi  bQHB/ +QHH2+iBQM Q7 MQ/2b- b QTTQb2/ iQ  HBp2 QM2- vQm +M
+QMp2`i i?2 +QHH2+iBQM iQ  `2H ``v #v +HHBM; i?2 ``v slice K2i?Q/
QM BiX
var arrayish = {0: " one ", 1: " two " , length : 2};
var real = Array . prototype . slice . call ( arrayish , 0) ;
real . forEach ( function ( elt ) { console . log ( elt ) ; }) ;
// → one
// two

hQ +`2i2 `2;mH` 2H2K2Mi MQ/2b UivT2 RV- vQm +M mb2 i?2 document.
createElement K2i?Q/X h?Bb K2i?Q/ iF2b  i; MK2 M/ `2im`Mb  M2r
2KTiv MQ/2 Q7 i?2 ;Bp2M ivT2X
h?2 7QHHQrBM; 2tKTH2 /2}M2b  miBHBiv elt- r?B+? +`2i2b M 2H2K2Mi
MQ/2 M/ i`2ib i?2 `2bi Q7 Bib `;mK2Mib b +?BH/`2M iQ i?i MQ/2X h?Bb
7mM+iBQM Bb i?2M mb2/ iQ //  bBKTH2 ii`B#miBQM iQ  [mQi2X
< blockquote id =" quote " >
No book can ever be finished . While working on it we learn
just enough to find it immature the moment we turn away
from it .
</ blockquote >

< script >


function elt ( type ) {
var node = document . createElement ( type );
for ( var i = 1; i < arguments . length ; i ++) {
var child = arguments [ i ];
if ( typeof child == " string ")
child = document . createTextNode ( child );
node . appendChild ( child );
}
return node ;
}

document . getElementById (" quote ") . appendChild (


elt (" footer " , ---"" ,
elt (" strong " , " Karl Popper ") ,
" , preface to the second editon of " ,
elt (" em " , " The Open Society and Its Enemies ") ,
" , 1950") ) ;

kjd
</ script >

h?Bb Bb r?i i?2 `2bmHiBM; /Q+mK2Mi HQQFb HBF2,

ii`B#mi2b
aQK2 2H2K2Mi ii`B#mi2b- bm+? b href 7Q` HBMFb- +M #2 ++2bb2/ i?`Qm;?
 T`QT2`iv Q7 i?2 bK2 MK2 QM i?2 2H2K2MiǶb .PJ Q#D2+iX h?Bb Bb i?2
+b2 7Q`  HBKBi2/ b2i Q7 +QKKQMHv mb2/ biM/`/ ii`B#mi2bX
"mi >hJG HHQrb vQm iQ b2i Mv ii`B#mi2 vQm rMi QM MQ/2bX h?Bb +M
#2 mb27mH #2+mb2 Bi HHQrb vQm iQ biQ`2 2ti` BM7Q`KiBQM BM  /Q+mK2MiX
A7 vQm KF2 mT vQm` QrM ii`B#mi2 MK2b- i?Qm;?- bm+? ii`B#mi2b rBHH
MQi #2 T`2b2Mi b  T`QT2`iv QM i?2 2H2K2MiǶb MQ/2X AMbi2/- vQmǶHH ?p2
iQ mb2 i?2 getAttribute M/ setAttribute K2i?Q/b iQ rQ`F rBi? i?2KX
<p data - classified =" secret " > The launch code is 00000000. </ p >
<p data - classified =" unclassified ">I have two feet . </p >

< script >


var paras = document . body . getElementsByTagName (" p ") ;
Array . prototype . forEach . call ( paras , function ( para ) {
if ( para . getAttribute (" data - classified ") == " secret ")
para . parentNode . removeChild ( para ) ;
}) ;
</ script >

A `2+QKK2M/2/ T`2}tBM; i?2 MK2b Q7 bm+? K/2@mT ii`B#mi2b rBi?


data- iQ 2Mbm`2 i?2v /Q MQi +QM~B+i rBi? Mv Qi?2` ii`B#mi2bX
b  bBKTH2 2tKTH2- r2ǶHH r`Bi2  dzbvMit ?B;?HB;?i2`Ǵ i?i HQQFb 7Q`
<pre> i;b UdzT`27Q`Kii2/Ǵ- mb2/ 7Q` +Q/2 M/ bBKBH` THBMi2tiV rBi? 
data-language ii`B#mi2 M/ +`m/2Hv i`B2b iQ ?B;?HB;?i i?2 F2vrQ`/b 7Q`
i?i HM;m;2X

kj3
function highlightCode ( node , keywords ) {
var text = node . textContent ;
node . textContent = ""; // Clear the node

var match , pos = 0;


while ( match = keywords . exec ( text )) {
var before = text . slice ( pos , match . index );
node . appendChild ( document . createTextNode ( before ));
var strong = document . createElement (" strong ") ;
strong . appendChild ( document . createTextNode ( match [0]) ) ;
node . appendChild ( strong ) ;
pos = keywords . lastIndex ;
}
var after = text . slice ( pos );
node . appendChild ( document . createTextNode ( after ) ) ;
}

h?2 7mM+iBQM highlightCode iF2b  <pre> MQ/2 M/  `2;mH` 2tT`2bbBQM


UrBi? i?2 dz;HQ#HǴ QTiBQM im`M2/ QMV i?i Ki+?2b i?2 F2vrQ`/b Q7 i?2
T`Q;`KKBM; HM;m;2 i?i i?2 2H2K2Mi +QMiBMbX
h?2 textContent T`QT2`iv Bb mb2/ iQ ;2i HH i?2 i2ti BM i?2 MQ/2 M/ Bb
i?2M b2i iQ M 2KTiv bi`BM;- r?B+? ?b i?2 2z2+i Q7 2KTivBM; i?2 MQ/2X
q2 HQQT Qp2` HH Ki+?2b Q7 i?2 F2vrQ`/ 2tT`2bbBQM- TT2M/BM; i?2 i2ti
#2ir22M i?2K b `2;mH` i2ti MQ/2b- M/ i?2 i2ti Ki+?2/ Ui?2 F2vrQ`/bV
b i2ti MQ/2b r`TT2/ BM <strong> U#QH/V 2H2K2MibX
q2 +M miQKiB+HHv ?B;?HB;?i HH T`Q;`Kb QM i?2 T;2 #v HQQTBM;
Qp2` HH i?2 <pre> 2H2K2Mib i?i ?p2  data-language ii`B#mi2 M/ +HH@
BM; highlightCode QM 2+? QM2 rBi? i?2 +Q``2+i `2;mH` 2tT`2bbBQM 7Q` i?2
HM;m;2X
var languages = {
javascript : /\ b ( function | return | var )\b/g /* ... etc */
};

function highlightAllCode () {
var pres = document . body . getElementsByTagName (" pre ") ;
for ( var i = 0; i < pres . length ; i ++) {
var pre = pres [ i ];
var lang = pre . getAttribute (" data - language ") ;
if ( languages . hasOwnProperty ( lang ) )
highlightCode ( pre , languages [ lang ]) ;

kjN
}
}

>2`2 Bb M 2tKTH2,
<p > Here it is , the identity function : </p >
< pre data - language =" javascript ">
function id ( x ) { return x ; }
</ pre >

< script > highlightAllCode () ; </ script >

h?Bb T`Q/m+2b  T;2 i?i HQQFb HBF2 i?Bb,

h?2`2 Bb QM2 +QKKQMHv mb2/ ii`B#mi2- class- r?B+? Bb  `2b2`p2/ rQ`/


BM i?2 Cpa+`BTi HM;m;2X 6Q` ?BbiQ`B+H `2bQMběbQK2 QH/ Cpa+`BTi
BKTH2K2MiiBQMb +QmH/ MQi ?M/H2 T`QT2`iv MK2b i?i Ki+?2/ F2v@
rQ`/b Q` `2b2`p2/ rQ`/běi?2 T`QT2`iv mb2/ iQ ++2bb i?Bb ii`B#mi2 Bb
+HH2/ classNameX uQm +M HbQ ++2bb Bi mM/2` Bib `2H MK2- "class"- #v
mbBM; i?2 getAttribute M/ setAttribute K2i?Q/bX

GvQmi
uQm KB;?i ?p2 MQiB+2/ i?i /Bz2`2Mi ivT2b Q7 2H2K2Mib `2 HB/ Qmi
/Bz2`2MiHvX aQK2- bm+? b T`;`T?b U<p>V Q` ?2/BM;b U<h1>V- iF2 mT
i?2 r?QH2 rB/i? Q7 i?2 /Q+mK2Mi M/ `2 `2M/2`2/ QM b2T`i2 HBM2bX
h?2b2 `2 +HH2/ #HQ+F 2H2K2MibX Pi?2`b- bm+? b HBMFb U<a>V Q` i?2 <strong
> 2H2K2Mi mb2/ BM i?2 T`2pBQmb 2tKTH2- `2 `2M/2`2/ QM i?2 bK2 HBM2
rBi? i?2B` bm``QmM/BM; i2tiX am+? 2H2K2Mib `2 +HH2/ BMHBM2 2H2K2MibX
6Q` Mv ;Bp2M /Q+mK2Mi- #`Qrb2`b `2 #H2 iQ +QKTmi2  HvQmi- r?B+?
;Bp2b 2+? 2H2K2Mi  bBx2 M/ TQbBiBQM #b2/ QM Bib ivT2 M/ +QMi2MiX
h?Bb HvQmi Bb i?2M mb2/ iQ +imHHv /`r i?2 /Q+mK2MiX
h?2 bBx2 M/ TQbBiBQM Q7 M 2H2K2Mi +M #2 ++2bb2/ 7`QK Cpa+`BTiX
h?2 offsetWidth M/ offsetHeight T`QT2`iB2b ;Bp2 vQm i?2 bT+2 i?2 2H2K2Mi
iF2b mT BM TBt2HbX  TBt2H Bb i?2 #bB+ mMBi Q7 K2bm`2K2Mi BM i?2

k9y
#`Qrb2` M/ ivTB+HHv +Q``2bTQM/b iQ i?2 bKHH2bi /Qi i?i vQm` b+`22M
+M /BbTHvX aBKBH`Hv- clientWidth M/ clientHeight ;Bp2 vQm i?2 bBx2 Q7
i?2 bT+2 BMbB/2 i?2 2H2K2Mi- B;MQ`BM; #Q`/2` rB/i?X
<p style =" border : 3 px solid red ">
I m boxed in
</p >

< script >


var para = document . body . getElementsByTagName (" p ") [0];
console . log (" clientHeight :" , para . clientHeight ) ;
console . log (" offsetHeight :" , para . offsetHeight ) ;
</ script >

:BpBM;  T`;`T?  #Q`/2` +mb2b  `2+iM;H2 iQ #2 /`rM `QmM/ BiX

h?2 KQbi 2z2+iBp2 rv iQ }M/ i?2 T`2+Bb2 TQbBiBQM Q7 M 2H2K2Mi QM i?2
b+`22M Bb i?2 getBoundingClientRect K2i?Q/X Ai `2im`Mb M Q#D2+i rBi? top-
bottom- left- M/ right T`QT2`iB2b- BM/B+iBM; i?2 TBt2H TQbBiBQMb Q7 i?2
bB/2b Q7 i?2 2H2K2Mi `2HiBp2 iQ i?2 iQT H27i Q7 i?2 b+`22MX A7 vQm rMi
i?2K `2HiBp2 iQ i?2 r?QH2 /Q+mK2Mi- vQm Kmbi // i?2 +m``2Mi b+`QHH
TQbBiBQM- 7QmM/ mM/2` i?2 ;HQ#H pageXOffset M/ pageYOffset p`B#H2bX
GvBM; Qmi  /Q+mK2Mi +M #2 [mBi2  HQi Q7 rQ`FX AM i?2 BMi2`2bi Q7
bT22/- #`Qrb2` 2M;BM2b /Q MQi BKK2/Bi2Hv `2@HvQmi  /Q+mK2Mi 2p2`v
iBK2 Bi Bb +?M;2/ #mi `i?2` rBi b HQM; b i?2v +MX q?2M  Cpa+`BTi
T`Q;`K i?i +?M;2/ i?2 /Q+mK2Mi }MBb?2b `mMMBM;- i?2 #`Qrb2` rBHH
?p2 iQ +QKTmi2  M2r HvQmi BM Q`/2` iQ /BbTHv i?2 +?M;2/ /Q+mK2Mi
QM i?2 b+`22MX q?2M  T`Q;`K bFb 7Q` i?2 TQbBiBQM Q` bBx2 Q7 bQK2i?BM;
#v `2/BM; T`QT2`iB2b bm+? b offsetHeight Q` +HHBM; getBoundingClientRect-
T`QpB/BM; +Q``2+i BM7Q`KiBQM HbQ `2[mB`2b +QKTmiBM;  HvQmiX
 T`Q;`K i?i `2T2i2/Hv Hi2`Mi2b #2ir22M `2/BM; .PJ HvQmi
BM7Q`KiBQM M/ +?M;BM; i?2 .PJ 7Q`+2b  HQi Q7 HvQmib iQ ?TT2M
M/ rBHH +QMb2[m2MiHv `mM `2HHv bHQrHvX h?2 7QHHQrBM; +Q/2 b?Qrb M
2tKTH2 Q7 i?BbX Ai +QMiBMb irQ /Bz2`2Mi T`Q;`Kb i?i #mBH/ mT  HBM2
Q7 s +?`+i2`b k-yyy TBt2Hb rB/2 M/ K2bm`2b i?2 iBK2 2+? QM2 iF2bX
<p > < span id =" one " > </ span > </p >
<p > < span id =" two " > </ span > </p >

k9R
< script >
function time ( name , action ) {
var start = Date . now () ; // Current time in milliseconds
action () ;
console . log ( name , " took ", Date . now () - start , " ms ") ;
}

time (" naive " , function () {


var target = document . getElementById (" one ") ;
while ( target . offsetWidth < 2000)
target . appendChild ( document . createTextNode (" X ") ) ;
}) ;
// → naive took 32 ms

time (" clever " , function () {


var target = document . getElementById (" two ") ;
target . appendChild ( document . createTextNode (" XXXXX ") ) ;
var total = Math . ceil (2000 / ( target . offsetWidth / 5) );
for ( var i = 5; i < total ; i ++)
target . appendChild ( document . createTextNode (" X ") ) ;
}) ;
// → clever took 1 ms
</ script >

aivHBM;
q2 ?p2 b22M i?i /Bz2`2Mi >hJG 2H2K2Mib /BbTHv /Bz2`2Mi #2?pBQ`X
aQK2 `2 /BbTHv2/ b #HQ+Fb- Qi?2`b BMHBM2X aQK2 // bivHBM;- bm+? b
<strong> KFBM; Bib +QMi2Mi #QH/ M/ <a> KFBM; Bi #Hm2 M/ mM/2`HBMBM;
BiX
h?2 rv M <img> i; b?Qrb M BK;2 Q` M <a> i; +mb2b  HBMF iQ
#2 7QHHQr2/ r?2M Bi Bb +HB+F2/ Bb bi`QM;Hv iB2/ iQ i?2 2H2K2Mi ivT2X "mi
i?2 /27mHi bivHBM; bbQ+Bi2/ rBi? M 2H2K2Mi- bm+? b i?2 i2ti +QHQ` Q`
mM/2`HBM2- +M #2 +?M;2/ #v mbX >2`2 Bb M 2tKTH2 mbBM; i?2 style
T`QT2`iv,
<p > < a href ="." > Normal link </a > </p >
<p > < a href ="." style =" color : green "> Green link </ a > </p >

k9k
h?2 b2+QM/ HBMF rBHH #2 ;`22M BMbi2/ Q7 i?2 /27mHi HBMF +QHQ`X

 bivH2 ii`B#mi2 Kv +QMiBM QM2 Q` KQ`2 /2+H`iBQMb- r?B+? `2 


T`QT2`iv Ubm+? b colorV 7QHHQr2/ #v  +QHQM M/  pHm2 Ubm+? b greenVX
q?2M i?2`2 Bb KQ`2 i?M QM2 /2+H`iBQM- i?2v Kmbi #2 b2T`i2/ #v
b2KB+QHQMb- b BM "color: red; border: none"X
h?2`2 `2  HQi Q7 bT2+ib i?i +M #2 BM~m2M+2/ #v bivHBM;X 6Q` 2t@
KTH2- i?2 display T`QT2`iv +QMi`QHb r?2i?2` M 2H2K2Mi Bb /BbTHv2/ b
 #HQ+F Q` M BMHBM2 2H2K2MiX
This text is displayed < strong > inline </ strong > ,
< strong style =" display : block " > as a block </ strong >, and
< strong style =" display : none " > not at all </ strong >.

h?2 block i; rBHH 2M/ mT QM Bib QrM HBM2 bBM+2 #HQ+F 2H2K2Mib `2 MQi
/BbTHv2/ BMHBM2 rBi? i?2 i2ti `QmM/ i?2KX h?2 Hbi i; Bb MQi /BbTHv2/
i HHědisplay: none T`2p2Mib M 2H2K2Mi 7`QK b?QrBM; mT QM i?2 b+`22MX
h?Bb Bb  rv iQ ?B/2 2H2K2MibX Ai Bb Q7i2M T`272`#H2 iQ `2KQpBM; i?2K
7`QK i?2 /Q+mK2Mi 2MiB`2Hv #2+mb2 Bi KF2b Bi 2bv iQ `2p2H i?2K ;BM
i  Hi2` iBK2X

Cpa+`BTi +Q/2 +M /B`2+iHv KMBTmHi2 i?2 bivH2 Q7 M 2H2K2Mi i?`Qm;?


i?2 MQ/2Ƕb style T`QT2`ivX h?Bb T`QT2`iv ?QH/b M Q#D2+i i?i ?b T`QT@
2`iB2b 7Q` HH TQbbB#H2 bivH2 T`QT2`iB2bX h?2 pHm2b Q7 i?2b2 T`QT2`iB2b `2
bi`BM;b- r?B+? r2 +M r`Bi2 iQ BM Q`/2` iQ +?M;2  T`iB+mH` bT2+i Q7
i?2 2H2K2MiǶb bivH2X
<p id =" para " style =" color : purple ">
Pretty text
</p >

< script >

k9j
var para = document . getElementById (" para ") ;
console . log ( para . style . color );
para . style . color = " magenta ";
</ script >

aQK2 bivH2 T`QT2`iv MK2b +QMiBM /b?2b- bm+? b font-familyX "2+mb2


bm+? T`QT2`iv MK2b `2 rFr`/ iQ rQ`F rBi? BM Cpa+`BTi UvQmǶ/
?p2 iQ bv style["font-family"]V- i?2 T`QT2`iv MK2b BM i?2 style Q#D2+i
7Q` bm+? T`QT2`iB2b ?p2 i?2B` /b?2b `2KQp2/ M/ i?2 H2ii2`b i?i 7QHHQr
i?2K +TBiHBx2/ Ustyle.fontFamilyVX

*b+/BM; bivH2b
h?2 bivHBM; bvbi2K 7Q` >hJG Bb +HH2/ *aa 7Q` *b+/BM; aivH2 a?22ibX
 bivH2 b?22i Bb  b2i Q7 `mH2b 7Q` ?Qr iQ bivH2 2H2K2Mib BM  /Q+mK2MiX
Ai +M #2 ;Bp2M BMbB/2  <style> i;X
< style >
strong {
font - style : italic ;
color : gray ;
}
</ style >
<p > Now < strong > strong text </ strong > is italic and gray . </p >

h?2 +b+/BM; BM i?2 MK2 `272`b iQ i?2 7+i i?i KmHiBTH2 bm+? `mH2b
`2 +QK#BM2/ iQ T`Q/m+2 i?2 }MH bivH2 7Q` M 2H2K2MiX AM i?2 T`2pBQmb
2tKTH2- i?2 /27mHi bivHBM; 7Q` <strong> i;b- r?B+? ;Bp2b i?2K font-
weight: bold- Bb Qp2`HB/ #v i?2 `mH2 BM i?2 <style> i;- r?B+? //b font-
style M/ colorX
q?2M KmHiBTH2 `mH2b /2}M2  pHm2 7Q` i?2 bK2 T`QT2`iv- i?2 KQbi
`2+2MiHv `2/ `mH2 ;2ib  ?B;?2` T`2+2/2M+2 M/ rBMbX aQ B7 i?2 `mH2 BM
i?2 <style> i; BM+Hm/2/ font-weight: normal- +QM~B+iBM; rBi? i?2 /27mHi
font-weight `mH2- i?2 i2ti rQmH/ #2 MQ`KH- MQi #QH/X aivH2b BM  style
ii`B#mi2 TTHB2/ /B`2+iHv iQ i?2 MQ/2 ?p2 i?2 ?B;?2bi T`2+2/2M+2 M/
Hrvb rBMX
Ai Bb TQbbB#H2 iQ i`;2i i?BM;b Qi?2` i?M i; MK2b BM *aa `mH2bX 
`mH2 7Q` .abc TTHB2b iQ HH 2H2K2Mib rBi? "abc" BM i?2B` +Hbb ii`B#mi2bX 
`mH2 7Q` \#xyz TTHB2b iQ i?2 2H2K2Mi rBi? M id ii`B#mi2 Q7 "xyz" Ur?B+?

k99
b?QmH/ #2 mMB[m2 rBi?BM i?2 /Q+mK2MiVX
. subtle {
color : gray ;
font - size : 80%;
}
# header {
background : blue ;
color : white ;
}
/* p elements , with classes a and b , and id main */
p. a .b # main {
margin - bottom : 20 px ;
}

h?2 T`2+2/2M+2 `mH2 7pQ`BM; i?2 KQbi `2+2MiHv /2}M2/ `mH2 ?QH/b i`m2
QMHv r?2M i?2 `mH2b ?p2 i?2 bK2 bT2+B}+BivX  `mH2Ƕb bT2+B}+Biv Bb 
K2bm`2 Q7 ?Qr T`2+Bb2Hv Bi /2b+`B#2b Ki+?BM; 2H2K2Mib- /2i2`KBM2/ #v
i?2 MmK#2` M/ FBM/ Ui;- +Hbb- Q` A.V Q7 2H2K2Mi bT2+ib Bi `2[mB`2bX
6Q` 2tKTH2-  `mH2 i?i i`;2ib p.a Bb KQ`2 bT2+B}+ i?M `mH2b i?i i`;2i
p Q` Dmbi .a- M/ rQmH/ i?mb iF2 T`2+2/2M+2 Qp2` i?2KX
h?2 MQiiBQM p > a ...{} TTHB2b i?2 ;Bp2M bivH2b iQ HH <a> i;b i?i
`2 /B`2+i +?BH/`2M Q7 <p> i;bX aBKBH`Hv- p a ...{} TTHB2b iQ HH <a> i;b
BMbB/2 <p> i;b- r?2i?2` i?2v `2 /B`2+i Q` BM/B`2+i +?BH/`2MX

Zm2`v b2H2+iQ`b
q2 rQMǶi #2 mbBM; bivH2 b?22ib HH i?i Km+? BM i?Bb #QQFX Hi?Qm;?
mM/2`biM/BM; i?2K Bb +`m+BH iQ T`Q;`KKBM; BM i?2 #`Qrb2`- T`QT2`Hv
2tTHBMBM; HH i?2 T`QT2`iB2b i?2v bmTTQ`i M/ i?2 BMi2`+iBQM KQM;
i?Qb2 T`QT2`iB2b rQmH/ iF2 irQ Q` i?`22 #QQFbX
h?2 KBM `2bQM A BMi`Q/m+2/ b2H2+iQ` bvMitO3kRkci?2 MQiiBQM
mb2/ BM bivH2 b?22ib iQ /2i2`KBM2 r?B+? 2H2K2Mib  b2i Q7 bivH2b TTHv
iQěBb i?i r2 +M mb2 i?Bb bK2 KBMB@HM;m;2 b M 2z2+iBp2 rv iQ
}M/ .PJ 2H2K2MibX
h?2 querySelectorAll K2i?Q/- r?B+? Bb /2}M2/ #Qi? QM i?2 document Q#@
D2+i M/ QM 2H2K2Mi MQ/2b- iF2b  b2H2+iQ` bi`BM; M/ `2im`Mb M ``v@
HBF2 Q#D2+i +QMiBMBM; HH i?2 2H2K2Mib i?i Bi Ki+?2bX

k98
<p > And if you go chasing
< span class =" animal " > rabbits </ span > </p >
<p > And you know you re going to fall </ p >
<p > Tell em a < span class =" character " > hookah smoking
< span class =" animal " > caterpillar </ span > </ span > </p >
<p > Has given you the call </ p >

< script >


function count ( selector ) {
return document . querySelectorAll ( selector ) . length ;
}
console . log ( count (" p ") ) ; // All <p > elements
// → 4
console . log ( count (". animal ") ) ; // Class animal
// → 2
console . log ( count (" p . animal ") ); // Animal inside of <p >
// → 2
console . log ( count (" p > . animal ") ) ; // Direct child of <p >
// → 1
</ script >

lMHBF2 K2i?Q/b bm+? b getElementsByTagName- i?2 Q#D2+i `2im`M2/ #v querySelectorAll


Bb MQi HBp2X Ai rQMǶi +?M;2 r?2M vQm +?M;2 i?2 /Q+mK2MiX
h?2 querySelector K2i?Q/ UrBi?Qmi i?2 All T`iV rQ`Fb BM  bBKBH` rvX
h?Bb QM2 Bb mb27mH B7 vQm rMi  bT2+B}+- bBM;H2 2H2K2MiX Ai rBHH `2im`M
QMHv i?2 }`bi Ki+?BM; 2H2K2Mi Q` MmHH B7 MQ 2H2K2Mib Ki+?X

SQbBiBQMBM; M/ MBKiBM;


h?2 position bivH2 T`QT2`iv BM~m2M+2b HvQmi BM  TQr2`7mH rvX "v
/27mHi Bi ?b  pHm2 Q7 static- K2MBM; i?2 2H2K2Mi bBib BM Bib MQ`KH
TH+2 BM i?2 /Q+mK2MiX q?2M Bi Bb b2i iQ relative- i?2 2H2K2Mi biBHH iF2b
mT bT+2 BM i?2 /Q+mK2Mi- #mi MQr i?2 top M/ left bivH2 T`QT2`iB2b +M
#2 mb2/ iQ KQp2 Bi `2HiBp2 iQ Bib MQ`KH TH+2X q?2M position Bb b2i iQ
absolute- i?2 2H2K2Mi Bb `2KQp2/ 7`QK i?2 MQ`KH /Q+mK2Mi ~Qrěi?i Bb-
Bi MQ HQM;2` iF2b mT bT+2 M/ Kv Qp2`HT rBi? Qi?2` 2H2K2MibX HbQ-
Bib top M/ left T`QT2`iB2b +M #2 mb2/ iQ #bQHmi2Hv TQbBiBQM Bi `2HiBp2
iQ i?2 iQT@H27i +Q`M2` Q7 i?2 M2`2bi 2M+HQbBM; 2H2K2Mi r?Qb2 position
T`QT2`iv BbMǶi static- Q` `2HiBp2 iQ i?2 /Q+mK2Mi B7 MQ bm+? 2M+HQbBM;

k9e
2H2K2Mi 2tBbibX
q2 +M mb2 i?Bb iQ +`2i2 M MBKiBQMX h?2 7QHHQrBM; /Q+mK2Mi /Bb@
THvb  TB+im`2 Q7  +i i?i ~Qib `QmM/ BM M 2HHBTb2,
<p style =" text - align : center ">
< img src =" img / cat . png " style =" position : relative " >
</p >
< script >
var cat = document . querySelector (" img ") ;
var angle = 0 , lastTime = null ;
function animate ( time ) {
if ( lastTime != null )
angle += ( time - lastTime ) * 0.001;
lastTime = time ;
cat . style . top = ( Math . sin ( angle ) * 20) + " px ";
cat . style . left = ( Math . cos ( angle ) * 200) + " px ";
requestAnimationFrame ( animate ) ;
}
requestAnimationFrame ( animate ) ;
</ script >

h?2 ;`v ``Qr b?Qrb i?2 Ti? HQM; r?B+? i?2 BK;2 KQp2bX

h?2 TB+im`2 Bb +2Mi2`2/ QM i?2 T;2 M/ ;Bp2M  position Q7 relativeX q2ǶHH
`2T2i2/Hv mT/i2 i?i TB+im`2Ƕb top M/ left bivH2b BM Q`/2` iQ KQp2 BiX
h?2 b+`BTi mb2b requestAnimationFrame iQ b+?2/mH2 i?2 animate 7mM+iBQM iQ
`mM r?2M2p2` i?2 #`Qrb2` Bb `2/v iQ `2TBMi i?2 b+`22MX h?2 animate
7mM+iBQM Bib2H7 ;BM +HHb requestAnimationFrame iQ b+?2/mH2 i?2 M2ti mT@
/i2X q?2M i?2 #`Qrb2` rBM/Qr UQ` i#V Bb +iBp2- i?Bb rBHH +mb2 mT/i2b
iQ ?TT2M i  `i2 Q7 #Qmi ey T2` b2+QM/- r?B+? i2M/b iQ T`Q/m+2 
;QQ/@HQQFBM; MBKiBQMX
A7 r2 Dmbi mT/i2/ i?2 .PJ BM  HQQT- i?2 T;2 rQmH/ 7`22x2 M/
MQi?BM; rQmH/ b?Qr mT QM i?2 b+`22MX "`Qrb2`b /Q MQi mT/i2 i?2B`

k9d
/BbTHv r?BH2  Cpa+`BTi T`Q;`K Bb `mMMBM;- MQ` /Q i?2v HHQr Mv
BMi2`+iBQM rBi? i?2 T;2X h?Bb Bb r?v r2 M22/ requestAnimationFrameěBi
H2ib i?2 #`Qrb2` FMQr i?i r2 `2 /QM2 7Q` MQr- M/ Bi +M ;Q ?2/
M/ /Q i?2 i?BM;b i?i #`Qrb2`b /Q- bm+? b mT/iBM; i?2 b+`22M M/
`2bTQM/BM; iQ mb2` +iBQMbX
Pm` MBKiBQM 7mM+iBQM Bb Tbb2/ i?2 +m``2Mi iBK2 b M `;mK2Mi-
r?B+? Bi +QKT`2b iQ i?2 iBK2 Bi br #27Q`2 Ui?2 lastTime p`B#H2V iQ
2Mbm`2 i?2 KQiBQM Q7 i?2 +i T2` KBHHBb2+QM/ Bb bi#H2- M/ i?2 MBKiBQM
KQp2b bKQQi?HvX A7 Bi Dmbi KQp2/  }t2/ KQmMi T2` bi2T- i?2 KQiBQM
rQmH/ bimii2` B7- 7Q` 2tKTH2- MQi?2` ?2pv ibF `mMMBM; QM i?2 bK2
+QKTmi2` r2`2 iQ T`2p2Mi i?2 7mM+iBQM 7`QK `mMMBM; 7Q`  7`+iBQM Q7 
b2+QM/X
JQpBM; BM +B`+H2b Bb /QM2 mbBM; i?2 i`B;QMQK2i`v 7mM+iBQMb Math.cos M/
Math.sinX 6Q` i?Qb2 Q7 vQm r?Q `2MǶi 7KBHB` rBi? i?2b2- AǶHH #`B2~v
BMi`Q/m+2 i?2K bBM+2 r2 rBHH Q++bBQMHHv M22/ i?2K BM i?Bb #QQFX
Math.cos M/ Math.sin `2 mb27mH 7Q` }M/BM; TQBMib i?i HB2 QM  +B`+H2
`QmM/ TQBMi Uy-yV rBi?  `/Bmb Q7 QM2 mMBiX "Qi? 7mM+iBQMb BMi2`T`2i
i?2B` `;mK2Mi b i?2 TQbBiBQM QM i?Bb +B`+H2- rBi? x2`Q /2MQiBM; i?2 TQBMi
QM i?2 7` `B;?i Q7 i?2 +B`+H2- ;QBM; +HQ+FrBb2 mMiBH kπ U#Qmi eXk3V ?b
iF2M mb `QmM/ i?2 r?QH2 +B`+H2X Math.cos i2HHb vQm i?2 t@+QQ`/BMi2 Q7
i?2 TQBMi i?i +Q``2bTQM/b iQ i?2 ;Bp2M TQbBiBQM `QmM/ i?2 +B`+H2- r?BH2
Math.sin vB2H/b i?2 v@+QQ`/BMi2X SQbBiBQMb UQ` M;H2bV ;`2i2` i?M kπ
Q` H2bb i?M y `2 pHB/ěi?2 `QiiBQM `2T2ib bQ i?i Ykπ `272`b iQ i?2
bK2 M;H2 b X
cos(-⅔π)

sin(-⅔π)

sin(¼π)

cos(¼π)

h?2 +i MBKiBQM +Q/2 F22Tb  +QmMi2`- angle- 7Q` i?2 +m``2Mi M;H2 Q7
i?2 MBKiBQM M/ BM+`2K2Mib Bi BM T`QTQ`iBQM iQ i?2 2HTb2/ iBK2 2p2`v

k93
iBK2 i?2 animate 7mM+iBQM Bb +HH2/X Ai +M i?2M mb2 i?Bb M;H2 iQ +QKTmi2
i?2 +m``2Mi TQbBiBQM Q7 i?2 BK;2 2H2K2MiX h?2 top bivH2 Bb +QKTmi2/
rBi? Math.sin M/ KmHiBTHB2/ #v ky- r?B+? Bb i?2 p2`iB+H `/Bmb Q7 Qm`
+B`+H2X h?2 left bivH2 Bb #b2/ QM Math.cos M/ KmHiBTHB2/ #v kyy bQ i?i
i?2 +B`+H2 Bb Km+? rB/2` i?M Bi Bb ?B;?- `2bmHiBM; BM M 2HHBTiB+ KQiBQMX
LQi2 i?i bivH2b mbmHHv M22/ mMBibX AM i?Bb +b2- r2 ?p2 iQ TT2M/ "px
" iQ i?2 MmK#2` iQ i2HH i?2 #`Qrb2` r2 `2 +QmMiBM; BM TBt2Hb Ub QTTQb2/
iQ +2MiBK2i2`b- dz2KbǴ- Q` Qi?2` mMBibVX h?Bb Bb 2bv iQ 7Q`;2iX lbBM;
MmK#2`b rBi?Qmi mMBib rBHH `2bmHi BM vQm` bivH2 #2BM; B;MQ`2/ěmMH2bb
i?2 MmK#2` Bb y- r?B+? Hrvb K2Mb i?2 bK2 i?BM;- `2;`/H2bb Q7 Bib
mMBiX

amKK`v
Cpa+`BTi T`Q;`Kb Kv BMbT2+i M/ BMi2`72`2 rBi? i?2 +m``2Mi /Q+m@
K2Mi i?i  #`Qrb2` Bb /BbTHvBM; i?`Qm;?  /i bi`m+im`2 +HH2/ i?2
.PJX h?Bb /i bi`m+im`2 `2T`2b2Mib i?2 #`Qrb2`Ƕb KQ/2H Q7 i?2 /Q+@
mK2Mi- M/  Cpa+`BTi T`Q;`K +M KQ/B7v Bi iQ +?M;2 i?2 pBbB#H2
/Q+mK2MiX
h?2 .PJ Bb Q`;MBx2/ HBF2  i`22- BM r?B+? 2H2K2Mib `2 ``M;2/
?B2``+?B+HHv ++Q`/BM; iQ i?2 bi`m+im`2 Q7 i?2 /Q+mK2MiX h?2 Q#D2+ib
`2T`2b2MiBM; 2H2K2Mib ?p2 T`QT2`iB2b bm+? b parentNode M/ childNodes-
r?B+? +M #2 mb2/ iQ MpB;i2 i?`Qm;? i?Bb i`22X
h?2 rv  /Q+mK2Mi Bb /BbTHv2/ +M #2 BM~m2M+2/ #v bivHBM;- #Qi?
#v ii+?BM; bivH2b iQ MQ/2b /B`2+iHv M/ #v /2}MBM; `mH2b i?i Ki+?
+2`iBM MQ/2bX h?2`2 `2 KMv /Bz2`2Mi bivH2 T`QT2`iB2b- bm+? b color Q`
displayX Cpa+`BTi +M KMBTmHi2 M 2H2K2MiǶb bivH2 /B`2+iHv i?`Qm;?
Bib style T`QT2`ivX

1t2`+Bb2b
"mBH/  i#H2
q2 #mBHi THBMi2ti i#H2b BM *?Ti2` eX >hJG KF2b HvBM; Qmi i@
#H2b [mBi2  #Bi 2bB2`X M >hJG i#H2 Bb #mBHi rBi? i?2 7QHHQrBM; i;
bi`m+im`2,

k9N
< table >
<tr >
<th > name </ th >
<th > height </ th >
<th > country </ th >
</ tr >
<tr >
<td > Kilimanjaro </ td >
<td >5895 </ td >
<td > Tanzania </ td >
</ tr >
</ table >

6Q` 2+? `Qr- i?2 <table> i; +QMiBMb  <tr> i;X AMbB/2 Q7 i?2b2 <tr>
i;b- r2 +M Tmi +2HH 2H2K2Mib, 2Bi?2` ?2/BM; +2HHb U<th>V Q` `2;mH` +2HHb
U<td>VX
h?2 bK2 bQm`+2 /i i?i rb mb2/ BM *?Ti2` e Bb ;BM pBH#H2 BM
i?2 MOUNTAINS p`B#H2 BM i?2 bM/#QtX Ai +M HbQ #2 /QrMHQ/2/ 7`QK
i?2 r2#bBi2U2HQ[m2MiDpb+`BTiXM2if+Q/2ORjVX
q`Bi2  7mM+iBQM buildTable i?i- ;Bp2M M ``v Q7 Q#D2+ib i?i HH
?p2 i?2 bK2 b2i Q7 T`QT2`iB2b- #mBH/b mT  .PJ bi`m+im`2 `2T`2b2MiBM;
 i#H2X h?2 i#H2 b?QmH/ ?p2  ?2/2` `Qr rBi? i?2 T`QT2`iv MK2b
r`TT2/ BM <th> 2H2K2Mib M/ b?QmH/ ?p2 QM2 bm#b2[m2Mi `Qr T2` Q#D2+i
BM i?2 ``v- rBi? Bib T`QT2`iv pHm2b BM <td> 2H2K2MibX
h?2 Object.keys 7mM+iBQM- r?B+? `2im`Mb M ``v +QMiBMBM; i?2 T`QT@
2`iv MK2b i?i M Q#D2+i ?b- rBHH T`Q##Hv #2 ?2HT7mH ?2`2X
PM+2 vQm ?p2 i?2 #bB+b rQ`FBM;- `B;?i@HB;M +2HHb +QMiBMBM; MmK#2`b
#v b2iiBM; i?2B` style.textAlign T`QT2`iv iQ "right"X

1H2K2Mib #v i; MK2


h?2 getElementsByTagName K2i?Q/ `2im`Mb HH +?BH/ 2H2K2Mib rBi?  ;Bp2M
i; MK2X AKTH2K2Mi vQm` QrM p2`bBQM Q7 Bi b  `2;mH` MQMK2i?Q/
7mM+iBQM i?i iF2b  MQ/2 M/  bi`BM; Ui?2 i; MK2V b `;mK2Mib
M/ `2im`Mb M ``v +QMiBMBM; HH /2b+2M/Mi 2H2K2Mi MQ/2b rBi? i?2
;Bp2M i; MK2X
hQ }M/ i?2 i; MK2 Q7 M 2H2K2Mi- mb2 Bib tagName T`QT2`ivX "mi MQi2
i?i i?Bb rBHH `2im`M i?2 i; MK2 BM HH mTT2`+b2X lb2 i?2 toLowerCase
Q` toUpperCase bi`BM; K2i?Q/ iQ +QKT2Mbi2 7Q` i?BbX

k8y
h?2 +iǶb ?i
1ti2M/ i?2 +i MBKiBQM /2}M2/ 2`HB2` bQ i?i #Qi? i?2 +i M/ ?Bb
?i U<img src="img/hat.png">V Q`#Bi i QTTQbBi2 bB/2b Q7 i?2 2HHBTb2X
P` KF2 i?2 ?i +B`+H2 `QmM/ i?2 +iX P` Hi2` i?2 MBKiBQM BM bQK2
Qi?2` BMi2`2biBM; rvX
hQ KF2 TQbBiBQMBM; KmHiBTH2 Q#D2+ib 2bB2`- Bi Bb T`Q##Hv  ;QQ/ B/2
iQ brBi+? iQ #bQHmi2 TQbBiBQMBM;X h?Bb K2Mb i?i top M/ left `2
+QmMi2/ `2HiBp2 iQ i?2 iQT H27i Q7 i?2 /Q+mK2MiX hQ pQB/ mbBM; M2;iBp2
+QQ`/BMi2b- vQm +M bBKTHv //  }t2/ MmK#2` Q7 TBt2Hb iQ i?2 TQbBiBQM
pHm2bX

k8R
dzuQm ?p2 TQr2` Qp2` vQm` KBM/ěMQi QmibB/2 2p2MibX _2HBx2
i?Bb- M/ vQm rBHH }M/ bi`2M;i?XǴ
ěJ`+mb m`2HBmb- J2/BiiBQMb

R9 >M/HBM; 1p2Mib
aQK2 T`Q;`Kb rQ`F rBi? /B`2+i mb2` BMTmi- bm+? b KQmb2 M/ F2v#Q`/
BMi2`+iBQMX h?2 iBKBM; M/ Q`/2` Q7 bm+? BMTmi +MǶi #2 T`2/B+i2/ BM
/pM+2X h?Bb `2[mB`2b  /Bz2`2Mi TT`Q+? iQ +QMi`QH ~Qr i?M i?2 QM2
r2 ?p2 mb2/ bQ 7`X

1p2Mi ?M/H2`b
AK;BM2 M BMi2`7+2 r?2`2 i?2 QMHv rv iQ }M/ Qmi r?2i?2`  F2v QM
i?2 F2v#Q`/ Bb #2BM; T`2bb2/ Bb iQ `2/ i?2 +m``2Mi bii2 Q7 i?i F2vX
hQ #2 #H2 iQ `2+i iQ F2vT`2bb2b- vQm rQmH/ ?p2 iQ +QMbiMiHv `2/ i?2
F2vǶb bii2 bQ i?i vQmǶ/ +i+? Bi #27Q`2 BiǶb `2H2b2/ ;BMX Ai rQmH/ #2
/M;2`Qmb iQ T2`7Q`K Qi?2` iBK2@BMi2MbBp2 +QKTmiiBQMb bBM+2 vQm KB;?i
KBbb  F2vT`2bbX
h?i Bb ?Qr bm+? BMTmi rb ?M/H2/ QM T`BKBiBp2 K+?BM2bX  bi2T mT
rQmH/ #2 7Q` i?2 ?`/r`2 Q` QT2`iBM; bvbi2K iQ MQiB+2 i?2 F2vT`2bb
M/ Tmi Bi BM  [m2m2X  T`Q;`K +M i?2M T2`BQ/B+HHv +?2+F i?2 [m2m2
7Q` M2r 2p2Mib M/ `2+i iQ r?i Bi }M/b i?2`2X
P7 +Qm`b2- Bi ?b iQ `2K2K#2` iQ HQQF i i?2 [m2m2- M/ iQ /Q Bi
Q7i2M- #2+mb2 Mv iBK2 #2ir22M i?2 F2v #2BM; T`2bb2/ M/ i?2 T`Q;`K
MQiB+BM; i?2 2p2Mi rBHH +mb2 i?2 bQ7ir`2 iQ 722H mM`2bTQMbBp2X h?Bb
TT`Q+? Bb +HH2/ TQHHBM;X JQbi T`Q;`KK2`b pQB/ Bi r?2M2p2` TQbbB#H2X
 #2ii2` K2+?MBbK Bb 7Q` i?2 mM/2`HvBM; bvbi2K iQ ;Bp2 Qm` +Q/2 
+?M+2 iQ `2+i iQ 2p2Mib b i?2v Q++m`X "`Qrb2`b /Q i?Bb #v HHQrBM; mb
iQ `2;Bbi2` 7mM+iBQMb b ?M/H2`b 7Q` bT2+B}+ 2p2MibX
<p > Click this document to activate the handler . </p >
< script >
addEventListener (" click ", function () {
console . log (" You clicked !") ;
}) ;

k8k
</ script >

h?2 addEventListener 7mM+iBQM `2;Bbi2`b Bib b2+QM/ `;mK2Mi iQ #2 +HH2/


r?2M2p2` i?2 2p2Mi /2b+`B#2/ #v Bib }`bi `;mK2Mi Q++m`bX

1p2Mib M/ .PJ MQ/2b


1+? #`Qrb2` 2p2Mi ?M/H2` Bb `2;Bbi2`2/ BM  +QMi2tiX q?2M vQm +HH
addEventListener b b?QrM T`2pBQmbHv- vQm `2 +HHBM; Bi b  K2i?Q/ QM
i?2 r?QH2 rBM/Qr #2+mb2 BM i?2 #`Qrb2` i?2 ;HQ#H b+QT2 Bb 2[mBpH2Mi
iQ i?2 window Q#D2+iX 1p2`v .PJ 2H2K2Mi ?b Bib QrM addEventListener
K2i?Q/- r?B+? HHQrb vQm iQ HBbi2M bT2+B}+HHv QM i?i 2H2K2MiX
< button > Click me </ button >
<p > No handler here . </p >
< script >
var button = document . querySelector (" button ") ;
button . addEventListener (" click ", function () {
console . log (" Button clicked .") ;
}) ;
</ script >

h?2 2tKTH2 ii+?2b  ?M/H2` iQ i?2 #miiQM MQ/2X h?mb- +HB+Fb QM


i?2 #miiQM +mb2 i?i ?M/H2` iQ `mM- r?2`2b +HB+Fb QM i?2 `2bi Q7 i?2
/Q+mK2Mi /Q MQiX
:BpBM;  MQ/2 M onclick ii`B#mi2 ?b  bBKBH` 2z2+iX "mi  MQ/2 ?b
QMHv QM2 onclick ii`B#mi2- bQ vQm +M `2;Bbi2` QMHv QM2 ?M/H2` T2` MQ/2
i?i rvX h?2 addEventListener K2i?Q/ HHQrb vQm iQ // Mv MmK#2`
Q7 ?M/H2`b- bQ vQm +MǶi ++B/2MiHHv `2TH+2  ?M/H2` i?i ?b H`2/v
#22M `2;Bbi2`2/X
h?2 removeEventListener K2i?Q/- +HH2/ rBi? `;mK2Mib bBKBH` iQ b
addEventListener- `2KQp2b  ?M/H2`X

< button > Act - once button </ button >


< script >
var button = document . querySelector (" button ") ;
function once () {
console . log (" Done .") ;
button . removeEventListener (" click " , once ) ;
}

k8j
button . addEventListener (" click ", once ) ;
</ script >

hQ #2 #H2 iQ mM`2;Bbi2`  ?M/H2` 7mM+iBQM- r2 ;Bp2 Bi  MK2 Ubm+? b


onceV bQ i?i r2 +M Tbb Bi iQ #Qi? addEventListener M/ removeEventListener
X

1p2Mi Q#D2+ib
h?Qm;? r2 ?p2 B;MQ`2/ Bi BM i?2 T`2pBQmb 2tKTH2b- 2p2Mi ?M/H2` 7mM+@
iBQMb `2 Tbb2/ M `;mK2Mi, i?2 2p2Mi Q#D2+iX h?Bb Q#D2+i ;Bp2b mb /@
/BiBQMH BM7Q`KiBQM #Qmi i?2 2p2MiX 6Q` 2tKTH2- B7 r2 rMi iQ FMQr
r?B+? KQmb2 #miiQM rb T`2bb2/- r2 +M HQQF i i?2 2p2Mi Q#D2+iǶb which
T`QT2`ivX
< button > Click me any way you want </ button >
< script >
var button = document . querySelector (" button ") ;
button . addEventListener (" mousedown " , function ( event ) {
if ( event . which == 1)
console . log (" Left button ") ;
else if ( event . which == 2)
console . log (" Middle button ") ;
else if ( event . which == 3)
console . log (" Right button ") ;
}) ;
</ script >

h?2 BM7Q`KiBQM biQ`2/ BM M 2p2Mi Q#D2+i /Bz2`b T2` ivT2 Q7 2p2MiX q2ǶHH
/Bb+mbb p`BQmb ivT2b Hi2` BM i?Bb +?Ti2`X h?2 Q#D2+iǶb type T`QT2`iv
Hrvb ?QH/b  bi`BM; B/2MiB7vBM; i?2 2p2Mi U7Q` 2tKTH2 "click" Q` "
mousedown"VX

S`QT;iBQM
1p2Mi ?M/H2`b `2;Bbi2`2/ QM MQ/2b rBi? +?BH/`2M rBHH HbQ `2+2Bp2 bQK2
2p2Mib i?i ?TT2M BM i?2 +?BH/`2MX A7  #miiQM BMbB/2  T`;`T? Bb
+HB+F2/- 2p2Mi ?M/H2`b QM i?2 T`;`T? rBHH HbQ `2+2Bp2 i?2 +HB+F 2p2MiX

k89
"mi B7 #Qi? i?2 T`;`T? M/ i?2 #miiQM ?p2  ?M/H2`- i?2 KQ`2
bT2+B}+ ?M/H2`ěi?2 QM2 QM i?2 #miiQMě;2ib iQ ;Q }`biX h?2 2p2Mi
Bb bB/ iQ T`QT;i2 Qmir`/- 7`QK i?2 MQ/2 r?2`2 Bi ?TT2M2/ iQ i?i
MQ/2Ƕb T`2Mi MQ/2 M/ QM iQ i?2 `QQi Q7 i?2 /Q+mK2MiX 6BMHHv- 7i2`
HH ?M/H2`b `2;Bbi2`2/ QM  bT2+B}+ MQ/2 ?p2 ?/ i?2B` im`M- ?M/H2`b
`2;Bbi2`2/ QM i?2 r?QH2 rBM/Qr ;2i  +?M+2 iQ `2bTQM/ iQ i?2 2p2MiX
i Mv TQBMi- M 2p2Mi ?M/H2` +M +HH i?2 stopPropagation K2i?Q/ QM
i?2 2p2Mi Q#D2+i iQ T`2p2Mi ?M/H2`b dz7m`i?2` mTǴ 7`QK `2+2BpBM; i?2
2p2MiX h?Bb +M #2 mb27mH r?2M- 7Q` 2tKTH2- vQm ?p2  #miiQM BMbB/2
MQi?2` +HB+F#H2 2H2K2Mi M/ vQm /QMǶi rMi +HB+Fb QM i?2 #miiQM iQ
+iBpi2 i?2 Qmi2` 2H2K2MiǶb +HB+F #2?pBQ`X
h?2 7QHHQrBM; 2tKTH2 `2;Bbi2`b "mousedown" ?M/H2`b QM #Qi?  #miiQM
M/ i?2 T`;`T? `QmM/ BiX q?2M +HB+F2/ rBi? i?2 `B;?i KQmb2 #miiQM-
i?2 ?M/H2` 7Q` i?2 #miiQM +HHb stopPropagation- r?B+? rBHH T`2p2Mi i?2
?M/H2` QM i?2 T`;`T? 7`QK `mMMBM;X q?2M i?2 #miiQM Bb +HB+F2/ rBi?
MQi?2` KQmb2 #miiQM- #Qi? ?M/H2`b rBHH `mMX
<p > A paragraph with a < button > button </ button >. </ p >
< script >
var para = document . querySelector (" p ") ;
var button = document . querySelector (" button ") ;
para . addEventListener (" mousedown " , function () {
console . log (" Handler for paragraph .") ;
}) ;
button . addEventListener (" mousedown " , function ( event ) {
console . log (" Handler for button .") ;
if ( event . which == 3)
event . stopPropagation () ;
}) ;
</ script >

JQbi 2p2Mi Q#D2+ib ?p2  target T`QT2`iv i?i `272`b iQ i?2 MQ/2 r?2`2
i?2v Q`B;BMi2/X uQm +M mb2 i?Bb T`QT2`iv iQ 2Mbm`2 i?i vQmǶ`2 MQi
++B/2MiHHv ?M/HBM; bQK2i?BM; i?i T`QT;i2/ mT 7`QK  MQ/2 vQm /Q
MQi rMi iQ ?M/H2X
Ai Bb HbQ TQbbB#H2 iQ mb2 i?2 target T`QT2`iv iQ +bi  rB/2 M2i 7Q`
 bT2+B}+ ivT2 Q7 2p2MiX 6Q` 2tKTH2- B7 vQm ?p2  MQ/2 +QMiBMBM;
 HQM; HBbi Q7 #miiQMb- Bi Kv #2 KQ`2 +QMp2MB2Mi iQ `2;Bbi2`  bBM;H2
+HB+F ?M/H2` QM i?2 Qmi2` MQ/2 M/ ?p2 Bi mb2 i?2 target T`QT2`iv iQ

k88
};m`2 Qmi r?2i?2`  #miiQM rb +HB+F2/- `i?2` i?M `2;Bbi2` BM/BpB/mH
?M/H2`b QM HH Q7 i?2 #miiQMbX
< button >A </ button >
< button >B </ button >
< button >C </ button >
< script >
document . body . addEventListener (" click " , function ( event ) {
if ( event . target . nodeName == " BUTTON ")
console . log (" Clicked ", event . target . textContent ) ;
}) ;
</ script >

.27mHi +iBQMb
JMv 2p2Mib ?p2  /27mHi +iBQM bbQ+Bi2/ rBi? i?2KX A7 vQm +HB+F 
HBMF- vQm rBHH #2 iF2M iQ i?2 HBMFǶb i`;2iX A7 vQm T`2bb i?2 /QrM ``Qr-
i?2 #`Qrb2` rBHH b+`QHH i?2 T;2 /QrMX A7 vQm `B;?i@+HB+F- vQmǶHH ;2i 
+QMi2ti K2MmX M/ bQ QMX
6Q` KQbi ivT2b Q7 2p2Mib- i?2 Cpa+`BTi 2p2Mi ?M/H2`b `2 +HH2/ #2@
7Q`2 i?2 /27mHi #2?pBQ` Bb T2`7Q`K2/X A7 i?2 ?M/H2` /Q2bMǶi rMi i?2
MQ`KH #2?pBQ` iQ ?TT2M- ivTB+HHv #2+mb2 Bi ?b H`2/v iF2M +`2
Q7 ?M/HBM; i?2 2p2Mi- Bi +M +HH i?2 preventDefault K2i?Q/ QM i?2 2p2Mi
Q#D2+iX
h?Bb +M #2 mb2/ iQ BKTH2K2Mi vQm` QrM F2v#Q`/ b?Q`i+mib Q` +QMi2ti
K2MmX Ai +M HbQ #2 mb2/ iQ Q#MQtBQmbHv BMi2`72`2 rBi? i?2 #2?pBQ` i?i
mb2`b 2tT2+iX 6Q` 2tKTH2- ?2`2 Bb  HBMF i?i +MMQi #2 7QHHQr2/,
<a href =" https :// developer . mozilla . org /" > MDN </a >
< script >
var link = document . querySelector (" a ") ;
link . addEventListener (" click ", function ( event ) {
console . log (" Nope .") ;
event . preventDefault () ;
}) ;
</ script >

h`v MQi iQ /Q bm+? i?BM;b mMH2bb vQm ?p2  `2HHv ;QQ/ `2bQM iQX 6Q`
T2QTH2 mbBM; vQm` T;2- Bi +M #2 mMTH2bMi r?2M i?2 #2?pBQ` i?2v

k8e
2tT2+i Bb #`QF2MX
.2T2M/BM; QM i?2 #`Qrb2`- bQK2 2p2Mib +MǶi #2 BMi2`+2Ti2/X PM
*?`QK2- 7Q` 2tKTH2- F2v#Q`/ b?Q`i+mib iQ +HQb2 i?2 +m``2Mi i# U*i`H@
q Q` *QKKM/@qV +MMQi #2 ?M/H2/ #v Cpa+`BTiX

E2v 2p2Mib
q?2M  F2v QM i?2 F2v#Q`/ Bb T`2bb2/- vQm` #`Qrb2` }`2b  "keydown"
2p2MiX q?2M Bi Bb `2H2b2/-  "keyup" 2p2Mi }`2bX
<p > This page turns violet when you hold the V key . </p >
< script >
addEventListener (" keydown ", function ( event ) {
if ( event . keyCode == 86)
document . body . style . background = " violet ";
}) ;
addEventListener (" keyup ", function ( event ) {
if ( event . keyCode == 86)
document . body . style . background = "";
}) ;
</ script >

.2bTBi2 Bib MK2- "keydown" }`2b MQi QMHv r?2M i?2 F2v Bb T?vbB+HHv
Tmb?2/ /QrMX q?2M  F2v Bb T`2bb2/ M/ ?2H/- i?2 2p2Mi }`2b ;BM 2p2`v
iBK2 i?2 F2v `2T2ibX aQK2iBK2bě7Q` 2tKTH2 B7 vQm rMi iQ BM+`2b2
i?2 ++2H2`iBQM Q7  ;K2 +?`+i2` r?2M M ``Qr F2v Bb T`2bb2/ M/
/2+`2b2 Bi ;BM r?2M i?2 F2v Bb `2H2b2/ěvQm ?p2 iQ #2 +`27mH MQi
iQ BM+`2b2 Bi ;BM 2p2`v iBK2 i?2 F2v `2T2ib Q` vQmǶ/ 2M/ mT rBi?
mMBMi2MiBQMHHv ?m;2 pHm2bX
h?2 T`2pBQmb 2tKTH2 HQQF2/ i i?2 keyCode T`QT2`iv Q7 i?2 2p2Mi Q#@
D2+iX h?Bb Bb ?Qr vQm +M B/2MiB7v r?B+? F2v Bb #2BM; T`2bb2/ Q` `2H2b2/X
lM7Q`imMi2Hv- BiǶb MQi Hrvb Q#pBQmb ?Qr iQ i`MbHi2 i?2 MmK2`B+ F2v
+Q/2 iQ M +imH F2vX
6Q` H2ii2` M/ MmK#2` F2vb- i?2 bbQ+Bi2/ F2v +Q/2 rBHH #2 i?2 lMB+Q/2
+?`+i2` +Q/2 bbQ+Bi2/ rBi? i?2 UmTT2`+b2V H2ii2` Q` MmK#2` T`BMi2/
QM i?2 F2vX h?2 charCodeAt K2i?Q/ QM bi`BM;b ;Bp2b mb  rv iQ }M/ i?Bb
+Q/2X
console . log (" Violet ". charCodeAt (0) );

k8d
// → 86
console . log ("1". charCodeAt (0) ) ;
// → 49

Pi?2` F2vb ?p2 H2bb T`2/B+i#H2 F2v +Q/2bX h?2 #2bi rv iQ }M/ i?2
+Q/2b vQm M22/ Bb mbmHHv #v 2tT2`BK2MiBM;ě`2;Bbi2`  F2v 2p2Mi ?M/H2`
i?i HQ;b i?2 F2v +Q/2b Bi ;2ib M/ T`2bb i?2 F2v vQm `2 BMi2`2bi2/ BMX
JQ/B}2` F2vb bm+? b a?B7i- *i`H- Hi- M/ J2i U*QKKM/ QM J+V
;2M2`i2 F2v 2p2Mib Dmbi HBF2 MQ`KH F2vbX "mi r?2M HQQFBM; 7Q` F2v
+QK#BMiBQMb- vQm +M HbQ }M/ Qmi r?2i?2` i?2b2 F2vb `2 ?2H/ /QrM #v
HQQFBM; i i?2 shiftKey- ctrlKey- altKey- M/ metaKey T`QT2`iB2b Q7 F2v#Q`/
M/ KQmb2 2p2MibX
<p > Press Ctrl - Space to continue . </p >
< script >
addEventListener (" keydown ", function ( event ) {
if ( event . keyCode == 32 && event . ctrlKey )
console . log (" Continuing !") ;
}) ;
</ script >

h?2 "keydown" M/ "keyup" 2p2Mib ;Bp2 vQm BM7Q`KiBQM #Qmi i?2 T?vbB+H
F2v i?i Bb #2BM; T`2bb2/X "mi r?i B7 vQm `2 BMi2`2bi2/ BM i?2 +imH
i2ti #2BM; ivT2/\ :2iiBM; i?i i2ti 7`QK F2v +Q/2b Bb rFr`/X AMbi2/-
i?2`2 2tBbib MQi?2` 2p2Mi- "keypress"- r?B+? }`2b `B;?i 7i2` "keydown"
UM/ `2T2i2/ HQM; rBi? "keydown" r?2M i?2 F2v Bb ?2H/V #mi QMHv 7Q`
F2vb i?i T`Q/m+2 +?`+i2` BMTmiX h?2 charCode T`QT2`iv BM i?2 2p2Mi
Q#D2+i +QMiBMb  +Q/2 i?i +M #2 BMi2`T`2i2/ b  lMB+Q/2 +?`+i2`
+Q/2X q2 +M mb2 i?2 String.fromCharCode 7mM+iBQM iQ im`M i?Bb +Q/2 BMiQ
M +imH bBM;H2@+?`+i2` bi`BM;X
<p > Focus this page and type something . </p >
< script >
addEventListener (" keypress " , function ( event ) {
console . log ( String . fromCharCode ( event . charCode ) ) ;
}) ;
</ script >

h?2 .PJ MQ/2 r?2`2  F2v 2p2Mi Q`B;BMi2b /2T2M/b QM i?2 2H2K2Mi
i?i ?b 7Q+mb r?2M i?2 F2v Bb T`2bb2/X LQ`KH MQ/2b +MMQi ?p2 7Q+mb
UmMH2bb vQm ;Bp2 i?2K  tabindex ii`B#mi2V- #mi i?BM;b bm+? b HBMFb-

k83
#miiQMb- M/ 7Q`K }2H/b +MX q2ǶHH +QK2 #+F iQ 7Q`K }2H/b BM *?Ti2`
R3X q?2M MQi?BM; BM T`iB+mH` ?b 7Q+mb- document.body +ib b i?2 i`;2i
MQ/2 Q7 F2v 2p2MibX

JQmb2 +HB+Fb
S`2bbBM;  KQmb2 #miiQM HbQ +mb2b  MmK#2` Q7 2p2Mib iQ }`2X h?2
"mousedown" M/ "mouseup" 2p2Mib `2 bBKBH` iQ "keydown" M/ "keyup" M/
}`2 r?2M i?2 #miiQM Bb T`2bb2/ M/ `2H2b2/X h?2b2 rBHH ?TT2M QM i?2
.PJ MQ/2b i?i `2 BKK2/Bi2Hv #2HQr i?2 KQmb2 TQBMi2` r?2M i?2
2p2Mi Q++m`bX
7i2` i?2 "mouseup" 2p2Mi-  "click" 2p2Mi }`2b QM i?2 KQbi bT2+B}+ MQ/2
i?i +QMiBM2/ #Qi? i?2 T`2bb M/ i?2 `2H2b2 Q7 i?2 #miiQMX 6Q` 2tKTH2-
B7 A T`2bb /QrM i?2 KQmb2 #miiQM QM QM2 T`;`T? M/ i?2M KQp2 i?2
TQBMi2` iQ MQi?2` T`;`T? M/ `2H2b2 i?2 #miiQM- i?2 "click" 2p2Mi
rBHH ?TT2M QM i?2 2H2K2Mi i?i +QMiBMb #Qi? i?Qb2 T`;`T?bX
A7 irQ +HB+Fb ?TT2M +HQb2 iQ;2i?2`-  "dblclick" U/Qm#H2@+HB+FV 2p2Mi
HbQ }`2b- 7i2` i?2 b2+QM/ +HB+F 2p2MiX
hQ ;2i T`2+Bb2 BM7Q`KiBQM #Qmi i?2 TH+2 r?2`2  KQmb2 2p2Mi ?T@
T2M2/- vQm +M HQQF i Bib pageX M/ pageY T`QT2`iB2b- r?B+? +QMiBM i?2
2p2MiǶb +QQ`/BMi2b UBM TBt2HbV `2HiBp2 iQ i?2 iQT@H27i +Q`M2` Q7 i?2 /Q+@
mK2MiX
h?2 7QHHQrBM; BKTH2K2Mib  T`BKBiBp2 /`rBM; T`Q;`KX 1p2`v iBK2
vQm +HB+F i?2 /Q+mK2Mi- Bi //b  /Qi mM/2` vQm` KQmb2 TQBMi2`X a22
*?Ti2` RN 7Q`  H2bb T`BKBiBp2 /`rBM; T`Q;`KX
< style >
body {
height : 200 px ;
background : beige ;
}
. dot {
height : 8 px ; width : 8 px ;
border - radius : 4 px ; /* rounds corners */
background : blue ;
position : absolute ;
}
</ style >

k8N
< script >
addEventListener (" click ", function ( event ) {
var dot = document . createElement (" div ") ;
dot . className = " dot ";
dot . style . left = ( event . pageX - 4) + " px ";
dot . style . top = ( event . pageY - 4) + " px ";
document . body . appendChild ( dot ) ;
}) ;
</ script >

h?2 clientX M/ clientY T`QT2`iB2b `2 bBKBH` iQ pageX M/ pageY #mi `2H@
iBp2 iQ i?2 T`i Q7 i?2 /Q+mK2Mi i?i Bb +m``2MiHv b+`QHH2/ BMiQ pB2rX
h?2b2 +M #2 mb27mH r?2M +QKT`BM; KQmb2 +QQ`/BMi2b rBi? i?2 +QQ`@
/BMi2b `2im`M2/ #v getBoundingClientRect- r?B+? HbQ `2im`Mb pB2rTQ`i@
`2HiBp2 +QQ`/BMi2bX

JQmb2 KQiBQM
1p2`v iBK2 i?2 KQmb2 TQBMi2` KQp2b-  "mousemove" 2p2Mi }`2bX h?Bb 2p2Mi
+M #2 mb2/ iQ i`+F i?2 TQbBiBQM Q7 i?2 KQmb2X  +QKKQM bBimiBQM BM
r?B+? i?Bb Bb mb27mH Bb r?2M BKTH2K2MiBM; bQK2 7Q`K Q7 KQmb2@/`;;BM;
7mM+iBQMHBivX
b M 2tKTH2- i?2 7QHHQrBM; T`Q;`K /BbTHvb  #` M/ b2ib mT 2p2Mi
?M/H2`b bQ i?i /`;;BM; iQ i?2 H27i Q` `B;?i QM i?Bb #` KF2b Bi M``Qr2`
Q` rB/2`,
<p > Drag the bar to change its width : </p >
< div style =" background : orange ; width : 60 px ; height : 20 px ">
</ div >
< script >
var lastX ; // Tracks the last observed mouse X position
var rect = document . querySelector (" div ") ;
rect . addEventListener (" mousedown " , function ( event ) {
if ( event . which == 1) {
lastX = event . pageX ;
addEventListener (" mousemove " , moved );
event . preventDefault () ; // Prevent selection
}
}) ;

key
function buttonPressed ( event ) {
if ( event . buttons == null )
return event . which != 0;
else
return event . buttons != 0;
}
function moved ( event ) {
if (! buttonPressed ( event ) ) {
removeEventListener (" mousemove ", moved );
} else {
var dist = event . pageX - lastX ;
var newWidth = Math . max (10 , rect . offsetWidth + dist );
rect . style . width = newWidth + " px ";
lastX = event . pageX ;
}
}
</ script >

h?2 `2bmHiBM; T;2 HQQFb HBF2 i?Bb,

LQi2 i?i i?2 "mousemove" ?M/H2` Bb `2;Bbi2`2/ QM i?2 r?QH2 rBM/QrX


1p2M B7 i?2 KQmb2 ;Q2b QmibB/2 Q7 i?2 #` /m`BM; `2bBxBM;- r2 biBHH rMi
iQ mT/i2 Bib bBx2 M/ biQT /`;;BM; r?2M i?2 KQmb2 Bb `2H2b2/X
q2 Kmbi biQT `2bBxBM; i?2 #` r?2M i?2 KQmb2 #miiQM Bb `2H2b2/X lM@
7Q`imMi2Hv- MQi HH #`Qrb2`b ;Bp2 "mousemove" 2p2Mib  K2MBM;7mH which
T`QT2`ivX h?2`2 Bb  biM/`/ T`QT2`iv +HH2/ buttons- r?B+? T`QpB/2b
bBKBH` BM7Q`KiBQM- #mi i?i Bb HbQ MQi bmTTQ`i2/ QM HH #`Qrb2`bX
6Q`imMi2Hv- HH KDQ` #`Qrb2`b bmTTQ`i 2Bi?2` buttons Q` which- bQ i?2
buttonPressed 7mM+iBQM BM i?2 2tKTH2 }`bi i`B2b buttons- M/ 7HHb #+F iQ
which r?2M i?i BbMǶi pBH#H2X
q?2M2p2` i?2 KQmb2 TQBMi2` 2Mi2`b Q` H2p2b  MQ/2-  "mouseover" Q`
"mouseout" 2p2Mi }`2bX h?2b2 irQ 2p2Mib +M #2 mb2/- KQM; Qi?2` i?BM;b-
iQ +`2i2 ?Qp2` 2z2+ib- b?QrBM; Q` bivHBM; bQK2i?BM; r?2M i?2 KQmb2 Bb
Qp2`  ;Bp2M 2H2K2MiX
lM7Q`imMi2Hv- +`2iBM; bm+? M 2z2+i Bb MQi b bBKTH2 b bi`iBM; i?2

keR
2z2+i QM "mouseover" M/ 2M/BM; Bi QM "mouseout"X q?2M i?2 KQmb2 KQp2b
7`QK  MQ/2 QMiQ QM2 Q7 Bib +?BH/`2M- "mouseout" }`2b QM i?2 T`2Mi MQ/2-
i?Qm;? i?2 KQmb2 /B/ MQi +imHHv H2p2 i?2 MQ/2Ƕb 2ti2MiX hQ KF2
i?BM;b rQ`b2- i?2b2 2p2Mib T`QT;i2 Dmbi HBF2 Qi?2` 2p2Mib- M/ i?mb vQm
rBHH HbQ `2+2Bp2 "mouseout" 2p2Mib r?2M i?2 KQmb2 H2p2b QM2 Q7 i?2 +?BH/
MQ/2b Q7 i?2 MQ/2 QM r?B+? i?2 ?M/H2` Bb `2;Bbi2`2/X
hQ rQ`F `QmM/ i?Bb T`Q#H2K- r2 +M mb2 i?2 relatedTarget T`QT2`iv
Q7 i?2 2p2Mi Q#D2+ib +`2i2/ 7Q` i?2b2 2p2MibX Ai i2HHb mb- BM i?2 +b2 Q7
"mouseover"- r?i 2H2K2Mi i?2 TQBMi2` rb Qp2` #27Q`2 M/- BM i?2 +b2
Q7 "mouseout"- r?i 2H2K2Mi Bi Bb ;QBM; iQX q2 rMi iQ +?M;2 Qm` ?Qp2`
2z2+i QMHv r?2M i?2 relatedTarget Bb QmibB/2 Q7 Qm` i`;2i MQ/2X PMHv BM
i?i +b2 /Q2b i?Bb 2p2Mi +imHHv `2T`2b2Mi  +`QbbBM; Qp2` 7`QK QmibB/2
iQ BMbB/2 i?2 MQ/2 UQ` i?2 Qi?2` rv `QmM/VX
<p > Hover over this < strong > paragraph </ strong >. </ p >
< script >
var para = document . querySelector (" p ") ;
function isInside ( node , target ) {
for (; node != null ; node = node . parentNode )
if ( node == target ) return true ;
}
para . addEventListener (" mouseover " , function ( event ) {
if (! isInside ( event . relatedTarget , para ) )
para . style . color = " red ";
}) ;
para . addEventListener (" mouseout " , function ( event ) {
if (! isInside ( event . relatedTarget , para ) )
para . style . color = "";
}) ;
</ script >

h?2 isInside 7mM+iBQM 7QHHQrb i?2 ;Bp2M MQ/2Ƕb T`2Mi HBMFb mMiBH Bi 2Bi?2`
`2+?2b i?2 iQT Q7 i?2 /Q+mK2Mi Ur?2M node #2+QK2b MmHHV Q` }M/b i?2
T`2Mi r2 `2 HQQFBM; 7Q`X
A b?QmH/ // i?i  ?Qp2` 2z2+i HBF2 i?Bb +M #2 Km+? KQ`2 2bBHv
+?B2p2/ mbBM; i?2 *aa Tb2m/Qb2H2+iQ` :hover- b i?2 M2ti 2tKTH2 b?QrbX
"mi r?2M vQm` ?Qp2` 2z2+i BMpQHp2b /QBM; bQK2i?BM; KQ`2 +QKTHB+i2/
i?M +?M;BM;  bivH2 QM i?2 i`;2i MQ/2- vQm Kmbi mb2 i?2 i`B+F rBi?
"mouseover" M/ "mouseout" 2p2MibX

kek
< style >
p : hover { color : red }
</ style >
<p > Hover over this < strong > paragraph </ strong >. </ p >

a+`QHH 2p2Mib
q?2M2p2` M 2H2K2Mi Bb b+`QHH2/-  "scroll" 2p2Mi }`2b QM BiX h?Bb ?b
p`BQmb mb2b- bm+? b FMQrBM; r?i i?2 mb2` Bb +m``2MiHv HQQFBM; i U7Q`
/Bb#HBM; Qz@b+`22M MBKiBQMb Q` b2M/BM; bTv `2TQ`ib iQ vQm` 2pBH ?2/@
[m`i2`bV Q` b?QrBM; bQK2 BM/B+iBQM Q7 T`Q;`2bb U#v ?B;?HB;?iBM; T`i
Q7  i#H2 Q7 +QMi2Mib Q` b?QrBM;  T;2 MmK#2`VX
h?2 7QHHQrBM; 2tKTH2 /`rb  T`Q;`2bb #` BM i?2 iQT@`B;?i +Q`M2` Q7
i?2 /Q+mK2Mi M/ mT/i2b Bi iQ }HH mT b vQm b+`QHH /QrM,
< style >
. progress {
border : 1 px solid blue ;
width : 100 px ;
position : fixed ;
top : 10 px ; right : 10 px ;
}
. progress > div {
height : 12 px ;
background : blue ;
width : 0%;
}
body {
height : 2000 px ;
}
</ style >
< div class =" progress " > < div > </ div > </ div >
<p > Scroll me ... </ p >
< script >
var bar = document . querySelector (". progress div ") ;
addEventListener (" scroll ", function () {
var max = document . body . scrollHeight - innerHeight ;
var percent = ( pageYOffset / max ) * 100;
bar . style . width = percent + "%";
}) ;

kej
</ script >

:BpBM; M 2H2K2Mi  position Q7 fixed +ib Km+? HBF2 M absolute TQbBiBQM


#mi HbQ T`2p2Mib Bi 7`QK b+`QHHBM; HQM; rBi? i?2 `2bi Q7 i?2 /Q+mK2MiX
h?2 2z2+i Bb iQ KF2 Qm` T`Q;`2bb #` biv BM Bib +Q`M2`X AMbB/2 Bi Bb
MQi?2` 2H2K2Mi- r?B+? Bb `2bBx2/ iQ BM/B+i2 i?2 +m``2Mi T`Q;`2bbX q2
mb2 %- `i?2` i?M px- b  mMBi r?2M b2iiBM; i?2 rB/i? bQ i?i i?2 2H2K2Mi
Bb bBx2/ `2HiBp2 iQ i?2 r?QH2 #`X
h?2 ;HQ#H innerHeight p`B#H2 ;Bp2b mb i?2 ?2B;?i Q7 i?2 rBM/Qr- r?B+?
r2 ?p2 iQ bm#i`+i 7`QK i?2 iQiH b+`QHH#H2 ?2B;?iěvQm +MǶi F22T
b+`QHHBM; r?2M vQm ?Bi i?2 #QiiQK Q7 i?2 /Q+mK2MiX Uh?2`2Ƕb HbQ M
innerWidth iQ ;Q HQM; rBi? innerHeightXV "v /BpB/BM; pageYOffset- i?2
+m``2Mi b+`QHH TQbBiBQM- #v i?2 KtBKmK b+`QHH TQbBiBQM M/ KmHiBTHvBM;
#v Ryy- r2 ;2i i?2 T2`+2Mi;2 7Q` i?2 T`Q;`2bb #`X
*HHBM; preventDefault QM  b+`QHH 2p2Mi /Q2b MQi T`2p2Mi i?2 b+`QHHBM;
7`QK ?TT2MBM;X AM 7+i- i?2 2p2Mi ?M/H2` Bb +HH2/ QMHv 7i2` i?2
b+`QHHBM; iF2b TH+2X

6Q+mb 2p2Mib
q?2M M 2H2K2Mi ;BMb 7Q+mb- i?2 #`Qrb2` }`2b  "focus" 2p2Mi QM BiX
q?2M Bi HQb2b 7Q+mb-  "blur" 2p2Mi }`2bX
lMHBF2 i?2 2p2Mib /Bb+mbb2/ 2`HB2`- i?2b2 irQ 2p2Mib /Q MQi T`QT;i2X
 ?M/H2` QM  T`2Mi 2H2K2Mi Bb MQi MQiB}2/ r?2M  +?BH/ 2H2K2Mi ;BMb
Q` HQb2b 7Q+mbX
h?2 7QHHQrBM; 2tKTH2 /BbTHvb ?2HT i2ti 7Q` i?2 i2ti }2H/ i?i +m`@
`2MiHv ?b 7Q+mb,
<p > Name : < input type =" text " data - help =" Your full name " > </p >
<p > Age : < input type =" text " data - help =" Age in years " > </p >
<p id =" help " > </p >

< script >


var help = document . querySelector ("# help ") ;
var fields = document . querySelectorAll (" input ") ;
for ( var i = 0; i < fields . length ; i ++) {
fields [ i ]. addEventListener (" focus " , function ( event ) {
var text = event . target . getAttribute (" data - help ") ;

ke9
help . textContent = text ;
}) ;
fields [ i ]. addEventListener (" blur " , function ( event ) {
help . textContent = "";
}) ;
}
</ script >

AM i?2 7QHHQrBM; b+`22Mb?Qi- i?2 ?2HT i2ti 7Q` i?2 ;2 }2H/ Bb b?QrMX

h?2 rBM/Qr Q#D2+i rBHH `2+2Bp2 "focus" M/ "blur" 2p2Mib r?2M i?2 mb2`
KQp2b 7`QK Q` iQ i?2 #`Qrb2` i# Q` rBM/Qr BM r?B+? i?2 /Q+mK2Mi Bb
b?QrMX

GQ/ 2p2Mi
q?2M  T;2 }MBb?2b HQ/BM;- i?2 "load" 2p2Mi }`2b QM i?2 rBM/Qr M/
i?2 /Q+mK2Mi #Q/v Q#D2+ibX h?Bb Bb Q7i2M mb2/ iQ b+?2/mH2 BMBiBHBxiBQM
+iBQMb i?i `2[mB`2 i?2 r?QH2 /Q+mK2Mi iQ ?p2 #22M #mBHiX _2K2K#2`
i?i i?2 +QMi2Mi Q7 <script> i;b Bb `mM BKK2/Bi2Hv r?2M i?2 i; Bb
2M+QmMi2`2/X h?Bb Bb Q7i2M iQQ bQQM- bm+? b r?2M i?2 b+`BTi M22/b iQ
/Q bQK2i?BM; rBi? T`ib Q7 i?2 /Q+mK2Mi i?i TT2` 7i2` i?2 <script>
i;X
1H2K2Mib bm+? b BK;2b M/ b+`BTi i;b i?i HQ/ M 2ti2`MH }H2 HbQ
?p2  "load" 2p2Mi i?i BM/B+i2b i?2 }H2b i?2v `272`2M+2 r2`2 HQ/2/X
GBF2 i?2 7Q+mb@`2Hi2/ 2p2Mib- HQ/BM; 2p2Mib /Q MQi T`QT;i2X
q?2M  T;2 Bb +HQb2/ Q` MpB;i2/ rv 7`QK U7Q` 2tKTH2 #v 7QHHQrBM;
 HBMFV-  "beforeunload" 2p2Mi }`2bX h?2 KBM mb2 Q7 i?Bb 2p2Mi Bb iQ
T`2p2Mi i?2 mb2` 7`QK ++B/2MiHHv HQbBM; rQ`F #v +HQbBM;  /Q+mK2MiX
S`2p2MiBM; i?2 T;2 7`QK mMHQ/BM; Bb MQi- b vQm KB;?i 2tT2+i- /QM2
rBi? i?2 preventDefault K2i?Q/X AMbi2/- Bi Bb /QM2 #v `2im`MBM;  bi`BM;
7`QK i?2 ?M/H2`X h?2 bi`BM; rBHH #2 mb2/ BM  /BHQ; i?i bFb i?2 mb2` B7

ke8
i?2v rMi iQ biv QM i?2 T;2 Q` H2p2 BiX h?Bb K2+?MBbK 2Mbm`2b i?i
 mb2` Bb #H2 iQ H2p2 i?2 T;2- 2p2M B7 Bi Bb `mMMBM;  KHB+BQmb b+`BTi
i?i rQmH/ T`272` iQ F22T i?2K i?2`2 7Q`2p2` BM Q`/2` iQ 7Q`+2 i?2K iQ
HQQF i /Q/;v r2B;?i HQbb /bX

a+`BTi 2t2+miBQM iBK2HBM2


h?2`2 `2 p`BQmb i?BM;b i?i +M +mb2  b+`BTi iQ bi`i 2t2+miBM;X _2/@
BM;  <script> i; Bb QM2 bm+? i?BM;X M 2p2Mi }`BM; Bb MQi?2`X *?Ti2`
Rj /Bb+mbb2/ i?2 requestAnimationFrame 7mM+iBQM- r?B+? b+?2/mH2b  7mM+@
iBQM iQ #2 +HH2/ #27Q`2 i?2 M2ti T;2 `2/`rX h?i Bb v2i MQi?2` rv
BM r?B+?  b+`BTi +M bi`i `mMMBM;X
Ai Bb BKTQ`iMi iQ mM/2`biM/ i?i 2p2M i?Qm;? 2p2Mib +M }`2 i Mv
iBK2- MQ irQ b+`BTib BM  bBM;H2 /Q+mK2Mi 2p2` `mM i i?2 bK2 KQK2MiX A7
 b+`BTi Bb H`2/v `mMMBM;- 2p2Mi ?M/H2`b M/ TB2+2b Q7 +Q/2 b+?2/mH2/
BM Qi?2` rvb ?p2 iQ rBi 7Q` i?2B` im`MX h?Bb Bb i?2 `2bQM r?v 
/Q+mK2Mi rBHH 7`22x2 r?2M  b+`BTi `mMb 7Q`  HQM; iBK2X h?2 #`Qrb2`
+MMQi `2+i iQ +HB+Fb M/ Qi?2` 2p2Mib BMbB/2 i?2 /Q+mK2Mi #2+mb2 Bi
+MǶi `mM 2p2Mi ?M/H2`b mMiBH i?2 +m``2Mi b+`BTi }MBb?2b `mMMBM;X
aQK2 T`Q;`KKBM; 2MpB`QMK2Mib /Q HHQr KmHiBTH2 i?`2/b Q7 2t2+m@
iBQM iQ `mM i i?2 bK2 iBK2X .QBM; KmHiBTH2 i?BM;b i i?2 bK2 iBK2 +M
#2 mb2/ iQ KF2  T`Q;`K 7bi2`X "mi r?2M vQm ?p2 KmHiBTH2 +iQ`b
iQm+?BM; i?2 bK2 T`ib Q7 i?2 bvbi2K i i?2 bK2 iBK2- i?BMFBM; #Qmi
 T`Q;`K #2+QK2b i H2bi M Q`/2` Q7 K;MBim/2 ?`/2`X
h?2 7+i i?i Cpa+`BTi T`Q;`Kb /Q QMHv QM2 i?BM; i  iBK2 KF2b
Qm` HBp2b 2bB2`X 6Q` +b2b r?2`2 vQm `2HHv /Q rMi iQ /Q bQK2 iBK2@
+QMbmKBM; i?BM; BM i?2 #+F;`QmM/ rBi?Qmi 7`22xBM; i?2 T;2- #`Qrb2`b
T`QpB/2 bQK2i?BM; +HH2/ r2# rQ`F2`bX  rQ`F2` Bb M BbQHi2/ Cpa+`BTi
2MpB`QMK2Mi i?i `mMb HQM;bB/2 i?2 KBM T`Q;`K 7Q`  /Q+mK2Mi M/
+M +QKKmMB+i2 rBi? Bi QMHv #v b2M/BM; M/ `2+2BpBM; K2bb;2bX
bbmK2 r2 ?p2 i?2 7QHHQrBM; +Q/2 BM  }H2 +HH2/ code/squareworker.js,
addEventListener (" message ", function ( event ) {
postMessage ( event . data * event . data ) ;
}) ;

AK;BM2 i?i b[m`BM;  MmK#2` Bb  ?2pv- HQM;@`mMMBM; +QKTmiiBQM

kee
i?i r2 rMi iQ T2`7Q`K BM  #+F;`QmM/ i?`2/X h?Bb +Q/2 bTrMb 
rQ`F2`- b2M/b Bi  72r K2bb;2b- M/ QmiTmib i?2 `2bTQMb2bX
var squareWorker = new Worker (" code / squareworker . js ") ;
squareWorker . addEventListener (" message " , function ( event ) {
console . log (" The worker responded :" , event . data ) ;
}) ;
squareWorker . postMessage (10) ;
squareWorker . postMessage (24) ;

h?2 postMessage 7mM+iBQM b2M/b  K2bb;2- r?B+? rBHH +mb2  "message"


2p2Mi iQ }`2 BM i?2 `2+2Bp2`X h?2 b+`BTi i?i +`2i2/ i?2 rQ`F2` b2M/b
M/ `2+2Bp2b K2bb;2b i?`Qm;? i?2 Worker Q#D2+i- r?2`2b i?2 rQ`F2`
iHFb iQ i?2 b+`BTi i?i +`2i2/ Bi #v b2M/BM; M/ HBbi2MBM; /B`2+iHv QM Bib
;HQ#H b+QT2ěr?B+? Bb  M2r ;HQ#H b+QT2- MQi b?`2/ rBi? i?2 Q`B;BMH
b+`BTiX

a2iiBM; iBK2`b
h?2 setTimeout 7mM+iBQM Bb bBKBH` iQ requestAnimationFrameX Ai b+?2/mH2b
MQi?2` 7mM+iBQM iQ #2 +HH2/ Hi2`X "mi BMbi2/ Q7 +HHBM; i?2 7mM+iBQM
i i?2 M2ti `2/`r- Bi rBib 7Q`  ;Bp2M KQmMi Q7 KBHHBb2+QM/bX h?Bb
T;2 im`Mb 7`QK #Hm2 iQ v2HHQr 7i2` irQ b2+QM/b,
< script >
document . body . style . background = " blue ";
setTimeout ( function () {
document . body . style . background = " yellow ";
} , 2000) ;
</ script >

aQK2iBK2b vQm M22/ iQ +M+2H  7mM+iBQM vQm ?p2 b+?2/mH2/X h?Bb Bb


/QM2 #v biQ`BM; i?2 pHm2 `2im`M2/ #v setTimeout M/ +HHBM; clearTimeout
QM BiX
var bombTimer = setTimeout ( function () {
console . log (" BOOM !") ;
}, 500) ;

if ( Math . random () < 0.5) { // 50% chance

ked
console . log (" Defused .") ;
clearTimeout ( bombTimer );
}

h?2 cancelAnimationFrame 7mM+iBQM rQ`Fb BM i?2 bK2 rv b clearTimeout


ě+HHBM; Bi QM  pHm2 `2im`M2/ #v requestAnimationFrame rBHH +M+2H i?i
7`K2 UbbmKBM; Bi ?bMǶi H`2/v #22M +HH2/VX
 bBKBH` b2i Q7 7mM+iBQMb- setInterval M/ clearInterval `2 mb2/ iQ b2i
iBK2`b i?i b?QmH/ `2T2i 2p2`v s KBHHBb2+QM/bX
var ticks = 0;
var clock = setInterval ( function () {
console . log (" tick " , ticks ++) ;
if ( ticks == 10) {
clearInterval ( clock );
console . log (" stop .") ;
}
}, 200) ;

.2#QmM+BM;
aQK2 ivT2b Q7 2p2Mib ?p2 i?2 TQi2MiBH iQ }`2 `TB/Hv- KMv iBK2b BM 
`Qr Ui?2 "mousemove" M/ "scroll" 2p2Mib- 7Q` 2tKTH2VX q?2M ?M/HBM;
bm+? 2p2Mib- vQm Kmbi #2 +`27mH MQi iQ /Q Mvi?BM; iQQ iBK2@+QMbmKBM;
Q` vQm` ?M/H2` rBHH iF2 mT bQ Km+? iBK2 i?i BMi2`+iBQM rBi? i?2
/Q+mK2Mi bi`ib iQ 722H bHQr M/ +?QTTvX
A7 vQm /Q M22/ iQ /Q bQK2i?BM; MQMi`BpBH BM bm+?  ?M/H2`- vQm +M
mb2 setTimeout iQ KF2 bm`2 vQm `2 MQi /QBM; Bi iQQ Q7i2MX h?Bb Bb mbm@
HHv +HH2/ /2#QmM+BM; i?2 2p2MiX h?2`2 `2 b2p2`H bHB;?iHv /Bz2`2Mi
TT`Q+?2b iQ i?BbX
AM i?2 }`bi 2tKTH2- r2 rMi iQ /Q bQK2i?BM; r?2M i?2 mb2` ?b ivT2/
bQK2i?BM;- #mi r2 /QMǶi rMi iQ /Q Bi BKK2/Bi2Hv 7Q` 2p2`v F2v 2p2MiX
q?2M i?2v `2 ivTBM; [mB+FHv- r2 Dmbi rMi iQ rBi mMiBH  Tmb2 Q++m`bX
AMbi2/ Q7 BKK2/Bi2Hv T2`7Q`KBM; M +iBQM BM i?2 2p2Mi ?M/H2`- r2
b2i  iBK2Qmi BMbi2/X q2 HbQ +H2` i?2 T`2pBQmb iBK2Qmi UB7 MvV bQ
i?i r?2M 2p2Mib Q++m` +HQb2 iQ;2i?2` U+HQb2` i?M Qm` iBK2Qmi /2HvV-
i?2 iBK2Qmi 7`QK i?2 T`2pBQmb 2p2Mi rBHH #2 +M+2H2/X

ke3
< textarea > Type something here ... </ textarea >
< script >
var textarea = document . querySelector (" textarea ") ;
var timeout ;
textarea . addEventListener (" keydown ", function () {
clearTimeout ( timeout ) ;
timeout = setTimeout ( function () {
console . log (" You stopped typing .") ;
}, 500) ;
}) ;
</ script >

:BpBM; M mM/2}M2/ pHm2 iQ clearTimeout Q` +HHBM; Bi QM  iBK2Qmi i?i


?b H`2/v }`2/ ?b MQ 2z2+iX h?mb- r2 /QMǶi ?p2 iQ #2 +`27mH #Qmi
r?2M iQ +HH Bi- M/ r2 bBKTHv /Q bQ 7Q` 2p2`v 2p2MiX
q2 +M mb2  bHB;?iHv /Bz2`2Mi Tii2`M B7 r2 rMi iQ bT+2 `2bTQMb2b
bQ i?i i?2vǶ`2 b2T`i2/ #v i H2bi  +2`iBM H2M;i? Q7 iBK2 #mi rMi
iQ }`2 i?2K /m`BM;  b2`B2b Q7 2p2Mib- MQi Dmbi 7i2`r`/X 6Q` 2tKTH2-
r2 KB;?i rMi iQ `2bTQM/ iQ "mousemove" 2p2Mib #v b?QrBM; i?2 +m``2Mi
+QQ`/BMi2b Q7 i?2 KQmb2- #mi QMHv 2p2`v k8y KBHHBb2+QM/bX
< script >
function displayCoords ( event ) {
document . body . textContent =
" Mouse at " + event . pageX + ", " + event . pageY ;
}

var scheduled = false , lastEvent ;


addEventListener (" mousemove ", function ( event ) {
lastEvent = event ;
if (! scheduled ) {
scheduled = true ;
setTimeout ( function () {
scheduled = false ;
displayCoords ( lastEvent );
} , 250) ;
}
}) ;
</ script >

keN
amKK`v
1p2Mi ?M/H2`b KF2 Bi TQbbB#H2 iQ /2i2+i M/ `2+i iQ 2p2Mib r2 ?p2
MQ /B`2+i +QMi`QH Qp2`X h?2 addEventListener K2i?Q/ Bb mb2/ iQ `2;Bbi2`
bm+?  ?M/H2`X
1+? 2p2Mi ?b  ivT2 U"keydown"- "focus"- M/ bQ QMV i?i B/2MiB}2b
BiX JQbi 2p2Mib `2 +HH2/ QM  bT2+B}+ .PJ 2H2K2Mi M/ i?2M T`QT@
;i2 iQ i?i 2H2K2MiǶb M+2biQ`b- HHQrBM; ?M/H2`b bbQ+Bi2/ rBi? i?Qb2
2H2K2Mib iQ ?M/H2 i?2KX
q?2M M 2p2Mi ?M/H2` Bb +HH2/- Bi Bb Tbb2/ M 2p2Mi Q#D2+i rBi?
//BiBQMH BM7Q`KiBQM #Qmi i?2 2p2MiX h?Bb Q#D2+i HbQ ?b K2i?Q/b
i?i HHQr mb iQ biQT 7m`i?2` T`QT;iBQM UstopPropagationV M/ T`2p2Mi
i?2 #`Qrb2`Ƕb /27mHi ?M/HBM; Q7 i?2 2p2Mi UpreventDefaultVX
S`2bbBM;  F2v }`2b "keydown"- "keypress"- M/ "keyup" 2p2MibX S`2bbBM; 
KQmb2 #miiQM }`2b "mousedown"- "mouseup"- M/ "click" 2p2MibX JQpBM; i?2
KQmb2 }`2b "mousemove" M/ TQbbB#Hv "mouseenter" M/ "mouseout" 2p2MibX
a+`QHHBM; +M #2 /2i2+i2/ rBi? i?2 "scroll" 2p2Mi- M/ 7Q+mb +?M;2b
+M #2 /2i2+i2/ rBi? i?2 "focus" M/ "blur" 2p2MibX q?2M i?2 /Q+mK2Mi
}MBb?2b HQ/BM;-  "load" 2p2Mi }`2b QM i?2 rBM/QrX
PMHv QM2 TB2+2 Q7 Cpa+`BTi T`Q;`K +M `mM i  iBK2X h?mb- 2p2Mi
?M/H2`b M/ Qi?2` b+?2/mH2/ b+`BTib ?p2 iQ rBi mMiBH Qi?2` b+`BTib
}MBb? #27Q`2 i?2v ;2i i?2B` im`MX

1t2`+Bb2b
*2MbQ`2/ F2v#Q`/
"2ir22M RNk3 M/ kyRj- hm`FBb? Hr 7Q`#/2 i?2 mb2 Q7 i?2 H2ii2`b Z- q-
M/ s BM Q{+BH /Q+mK2MibX h?Bb rb T`i Q7  rB/2` BMBiBiBp2 iQ biB~2
Em`/Bb? +mHim`2ěi?Qb2 H2ii2`b Q++m` BM i?2 HM;m;2 mb2/ #v Em`/Bb?
T2QTH2 #mi MQi BM AbiM#mH hm`FBb?X
b M 2t2`+Bb2 BM /QBM; `B/B+mHQmb i?BM;b rBi? i2+?MQHQ;v- AǶK bFBM;
vQm iQ T`Q;`K  i2ti }2H/ UM <input type="text"> i;V i?i i?2b2 H2ii2`b
+MMQi #2 ivT2/ BMiQX
U.Q MQi rQ``v #Qmi +QTv M/ Tbi2 M/ Qi?2` bm+? HQQT?QH2bXV

kdy
JQmb2 i`BH
AM Cpa+`BTiǶb 2`Hv /vb- r?B+? rb i?2 ?B;? iBK2 Q7 ;m/v ?QK2 T;2b
rBi? HQib Q7 MBKi2/ BK;2b- T2QTH2 +K2 mT rBi? bQK2 i`mHv BMbTB`BM;
rvb iQ mb2 i?2 HM;m;2X
PM2 Q7 i?2b2 rb i?2 dzKQmb2 i`BHǴě b2`B2b Q7 BK;2b i?i rQmH/
7QHHQr i?2 KQmb2 TQBMi2` b vQm KQp2/ Bi +`Qbb i?2 T;2X
AM i?Bb 2t2`+Bb2- A rMi vQm iQ BKTH2K2Mi  KQmb2 i`BHX lb2 #bQHmi2Hv
TQbBiBQM2/ <div> 2H2K2Mib rBi?  }t2/ bBx2 M/ #+F;`QmM/ +QHQ` U`272` iQ
i?2 +Q/2 BM i?2 dzJQmb2 *HB+FbǴ b2+iBQM 7Q` M 2tKTH2VX *`2i2  #mM+?
Q7 bm+? 2H2K2Mib M/- r?2M i?2 KQmb2 KQp2b- /BbTHv i?2K BM i?2 rF2
Q7 i?2 KQmb2 TQBMi2`X
h?2`2 `2 p`BQmb TQbbB#H2 TT`Q+?2b ?2`2X uQm +M KF2 vQm` bQHm@
iBQM b bBKTH2 Q` b +QKTH2t b vQm rMiX  bBKTH2 bQHmiBQM iQ bi`i rBi?
Bb iQ F22T  }t2/ MmK#2` Q7 i`BH 2H2K2Mib M/ +v+H2 i?`Qm;? i?2K- KQp@
BM; i?2 M2ti QM2 iQ i?2 KQmb2Ƕb +m``2Mi TQbBiBQM 2p2`v iBK2  "mousemove"
2p2Mi Q++m`bX

h#b
 i##2/ BMi2`7+2 Bb  +QKKQM /2bB;M Tii2`MX Ai HHQrb vQm iQ b2H2+i M
BMi2`7+2 TM2H #v +?QQbBM; 7`QK  MmK#2` Q7 i#b dzbiB+FBM; QmiǴ #Qp2
M 2H2K2MiX
AM i?Bb 2t2`+Bb2 vQmǶHH BKTH2K2Mi  bBKTH2 i##2/ BMi2`7+2X q`Bi2 
7mM+iBQM- asTabs- i?i iF2b  .PJ MQ/2 M/ +`2i2b  i##2/ BMi2`7+2
b?QrBM; i?2 +?BH/ 2H2K2Mib Q7 i?i MQ/2X Ai b?QmH/ BMb2`i  HBbi Q7 <button>
2H2K2Mib i i?2 iQT Q7 i?2 MQ/2- QM2 7Q` 2+? +?BH/ 2H2K2Mi- +QMiBMBM;
i2ti `2i`B2p2/ 7`QK i?2 data-tabname ii`B#mi2 Q7 i?2 +?BH/X HH #mi QM2 Q7
i?2 Q`B;BMH +?BH/`2M b?QmH/ #2 ?B//2M U;Bp2M  display bivH2 Q7 noneV- M/
i?2 +m``2MiHv pBbB#H2 MQ/2 +M #2 b2H2+i2/ #v +HB+FBM; i?2 #miiQMbX
q?2M Bi rQ`Fb- 2ti2M/ Bi iQ HbQ bivH2 i?2 +m``2MiHv +iBp2 #miiQM
/Bz2`2MiHvX

kdR
R8 S`QD2+i,  SHi7Q`K :K2
HH `2HBiv Bb  ;K2X
ěABM "MFb- h?2 SHv2` Q7 :K2b

Jv BMBiBH 7b+BMiBQM rBi? +QKTmi2`b- HBF2 i?i Q7 KMv FB/b- Q`B;@


BMi2/ rBi? +QKTmi2` ;K2bX A rb /`rM BMiQ i?2 iBMv +QKTmi2`@
bBKmHi2/ rQ`H/b i?i A +QmH/ KMBTmHi2 M/ BM r?B+? biQ`B2b UbQ`i Q7V
mM7QH/2/ěKQ`2- A bmTTQb2- #2+mb2 Q7 i?2 rv A +QmH/ T`QD2+i Kv BK;@
BMiBQM BMiQ i?2K i?M #2+mb2 Q7 i?2 TQbbB#BHBiB2b i?2v +imHHv Qz2`2/X
A rQmH/MǶi rBb?  +`22` BM ;K2 T`Q;`KKBM; QM MvQM2X Jm+? HBF2
i?2 KmbB+ BM/mbi`v- i?2 /Bb+`2TM+v #2ir22M i?2 KMv 2;2` vQmM; T2Q@
TH2 rMiBM; iQ rQ`F BM Bi M/ i?2 +imH /2KM/ 7Q` bm+? T2QTH2 +`2i2b
 `i?2` mM?2Hi?v 2MpB`QMK2MiX "mi r`BiBM; ;K2b 7Q` 7mM Bb KmbBM;X
h?Bb +?Ti2` rBHH rHF i?`Qm;? i?2 BKTH2K2MiiBQM Q7  bBKTH2 THi@
7Q`K ;K2X SHi7Q`K ;K2b UQ` dzDmKT M/ `mMǴ ;K2bV `2 ;K2b i?i
2tT2+i i?2 THv2` iQ KQp2  };m`2 i?`Qm;?  rQ`H/- r?B+? Bb Q7i2M irQ@
/BK2MbBQMH M/ pB2r2/ 7`QK i?2 bB/2- M/ /Q HQib Q7 DmKTBM; QMiQ M/
Qp2` i?BM;bX

h?2 ;K2
Pm` ;K2 rBHH #2 `Qm;?Hv #b2/ QM .`F "Hm2 UrrrXH2bbKBHFX+QKf;K2bfRyV
#v h?QKb SH27X A +?Qb2 i?Bb ;K2 #2+mb2 Bi Bb #Qi? 2Mi2`iBMBM; M/
KBMBKHBbi- M/ #2+mb2 Bi +M #2 #mBHi rBi?Qmi iQQ Km+? +Q/2X Ai HQQFb
HBF2 i?Bb,

kdk
h?2 /`F #Qt `2T`2b2Mib i?2 THv2`- r?Qb2 ibF Bb iQ +QHH2+i i?2 v2HHQr
#Qt2b U+QBMbV r?BH2 pQB/BM; i?2 `2/ bimz UHp\VX  H2p2H Bb +QKTH2i2/
r?2M HH +QBMb ?p2 #22M +QHH2+i2/X
h?2 THv2` +M rHF `QmM/ rBi? i?2 H27i M/ `B;?i ``Qr F2vb M/
DmKT rBi? i?2 mT ``QrX CmKTBM; Bb  bT2+BHiv Q7 i?Bb ;K2 +?`+i2`X
Ai +M `2+? b2p2`H iBK2b Bib QrM ?2B;?i M/ Bb #H2 iQ +?M;2 /B`2+iBQM
BM KB/B`X h?Bb Kv MQi #2 2MiB`2Hv `2HBbiB+- #mi Bi ?2HTb ;Bp2 i?2 THv2`
i?2 722HBM; Q7 #2BM; BM /B`2+i +QMi`QH Q7 i?2 QMb+`22M pi`X
h?2 ;K2 +QMbBbib Q7  }t2/ #+F;`QmM/- HB/ Qmi HBF2  ;`B/- rBi?
i?2 KQpBM; 2H2K2Mib Qp2`HB/ QM i?i #+F;`QmM/X 1+? }2H/ QM i?2
;`B/ Bb 2Bi?2` 2KTiv- bQHB/- Q` HpX h?2 KQpBM; 2H2K2Mib `2 i?2 THv2`-
+QBMb- M/ +2`iBM TB2+2b Q7 HpX lMHBF2 i?2 `iB}+BH HB72 bBKmHiBQM
7`QK *?Ti2` d- i?2 TQbBiBQMb Q7 i?2b2 2H2K2Mib `2 MQi +QMbi`BM2/ iQ
i?2 ;`B/ěi?2B` +QQ`/BMi2b Kv #2 7`+iBQMH- HHQrBM; bKQQi? KQiBQMX

h?2 i2+?MQHQ;v
q2 rBHH mb2 i?2 #`Qrb2` .PJ iQ /BbTHv i?2 ;K2- M/ r2ǶHH `2/ mb2`
BMTmi #v ?M/HBM; F2v 2p2MibX
h?2 b+`22M@ M/ F2v#Q`/@`2Hi2/ +Q/2 Bb QMHv  iBMv T`i Q7 i?2 rQ`F
r2 M22/ iQ /Q iQ #mBH/ i?Bb ;K2X aBM+2 2p2`vi?BM; HQQFb HBF2 +QHQ`2/
#Qt2b- /`rBM; Bb mM+QKTHB+i2/, r2 +`2i2 .PJ 2H2K2Mib M/ mb2
bivHBM; iQ ;Bp2 i?2K  #+F;`QmM/ +QHQ`- bBx2- M/ TQbBiBQMX

kdj
q2 +M `2T`2b2Mi i?2 #+F;`QmM/ b  i#H2 bBM+2 Bi Bb M mM+?M;BM;
;`B/ Q7 b[m`2bX h?2 7`22@KQpBM; 2H2K2Mib +M #2 Qp2`HB/ QM iQT Q7 i?i-
mbBM; #bQHmi2Hv TQbBiBQM2/ 2H2K2MibX
AM ;K2b M/ Qi?2` T`Q;`Kb i?i ?p2 iQ MBKi2 ;`T?B+b M/ `2@
bTQM/ iQ mb2` BMTmi rBi?Qmi MQiB+2#H2 /2Hv- 2{+B2M+v Bb BKTQ`iMiX
Hi?Qm;? i?2 .PJ rb MQi Q`B;BMHHv /2bB;M2/ 7Q` ?B;?@T2`7Q`KM+2
;`T?B+b- Bi Bb +imHHv #2ii2` i i?Bb i?M vQm rQmH/ 2tT2+iX uQm br
bQK2 MBKiBQMb BM *?Ti2` RjX PM  KQ/2`M K+?BM2-  bBKTH2 ;K2
HBF2 i?Bb T2`7Q`Kb r2HH- 2p2M B7 r2 /QMǶi i?BMF #Qmi QTiBKBxiBQM Km+?X
AM i?2 M2ti +?Ti2`- r2 rBHH 2tTHQ`2 MQi?2` #`Qrb2` i2+?MQHQ;v- i?2
<canvas> i;- r?B+? T`QpB/2b  KQ`2 i`/BiBQMH rv iQ /`r ;`T?B+b-
rQ`FBM; BM i2`Kb Q7 b?T2b M/ TBt2Hb `i?2` i?M .PJ 2H2K2MibX

G2p2Hb
AM *?Ti2` d r2 mb2/ ``vb Q7 bi`BM;b iQ /2b+`B#2  irQ@/BK2MbBQMH
;`B/X q2 +M /Q i?2 bK2 ?2`2X Ai rBHH HHQr mb iQ /2bB;M H2p2Hb rBi?Qmi
}`bi #mBH/BM;  H2p2H 2/BiQ`X
 bBKTH2 H2p2H rQmH/ HQQF HBF2 i?Bb,
var simpleLevelPlan = [
" ",
" ",
" x = x ",
" x o o x ",
" x @ xxxxx x ",
" xxxxx x ",
" x !!!!!!!!!!!! x ",
" xxxxxxxxxxxxxx ",
" "
];

"Qi? i?2 }t2/ ;`B/ M/ i?2 KQpBM; 2H2K2Mib `2 BM+Hm/2/ BM i?2 THMX
h?2 x +?`+i2`b biM/ 7Q` rHHb- i?2 bT+2 +?`+i2`b 7Q` 2KTiv bT+2-
M/ i?2 2t+HKiBQM K`Fb `2T`2b2Mi }t2/- MQMKQpBM; Hp iBH2bX
h?2 @ /2}M2b i?2 TH+2 r?2`2 i?2 THv2` bi`ibX 1p2`v o Bb  +QBM- M/
i?2 2[mH bB;M U=V biM/b 7Q`  #HQ+F Q7 Hp i?i KQp2b #+F M/ 7Q`i?
?Q`BxQMiHHvX LQi2 i?i i?2 ;`B/ 7Q` i?2b2 TQbBiBQMb rBHH #2 b2i iQ +QMiBM

kd9
2KTiv bT+2- M/ MQi?2` /i bi`m+im`2 Bb mb2/ iQ i`+F i?2 TQbBiBQM Q7
bm+? KQpBM; 2H2K2MibX
q2ǶHH bmTTQ`i irQ Qi?2` FBM/b Q7 KQpBM; Hp, i?2 TBT2 +?`+i2` U|V
7Q` p2`iB+HHv KQpBM; #HQ#b- M/ v 7Q` /`BTTBM; Hpěp2`iB+HHv KQpBM;
Hp i?i /Q2bMǶi #QmM+2 #+F M/ 7Q`i? #mi QMHv KQp2b /QrM- DmKTBM;
#+F iQ Bib bi`i TQbBiBQM r?2M Bi ?Bib i?2 ~QQ`X
 r?QH2 ;K2 +QMbBbib Q7 KmHiBTH2 H2p2Hb i?i i?2 THv2` Kmbi +QKTH2i2X
 H2p2H Bb +QKTH2i2/ r?2M HH +QBMb ?p2 #22M +QHH2+i2/X A7 i?2 THv2`
iQm+?2b Hp- i?2 +m``2Mi H2p2H Bb `2biQ`2/ iQ Bib bi`iBM; TQbBiBQM- M/
i?2 THv2` Kv i`v ;BMX

_2/BM;  H2p2H
h?2 7QHHQrBM; +QMbi`m+iQ` #mBH/b  H2p2H Q#D2+iX Aib `;mK2Mi b?QmH/ #2
i?2 ``v Q7 bi`BM;b i?i /2}M2 i?2 H2p2HX
function Level ( plan ) {
this . width = plan [0]. length ;
this . height = plan . length ;
this . grid = [];
this . actors = [];

for ( var y = 0; y < this . height ; y ++) {


var line = plan [ y ] , gridLine = [];
for ( var x = 0; x < this . width ; x ++) {
var ch = line [ x ] , fieldType = null ;
var Actor = actorChars [ ch ];
if ( Actor )
this . actors . push ( new Actor ( new Vector (x , y ) , ch ) ) ;
else if ( ch == " x ")
fieldType = " wall ";
else if ( ch == "!")
fieldType = " lava ";
gridLine . push ( fieldType );
}
this . grid . push ( gridLine ) ;
}

this . player = this . actors . filter ( function ( actor ) {


return actor . type == " player ";

kd8
}) [0];
this . status = this . finishDelay = null ;
}

6Q` #`2pBiv- i?2 +Q/2 /Q2b MQi +?2+F 7Q` KH7Q`K2/ BMTmiX Ai bbmK2b
i?i vQmǶp2 ;Bp2M Bi  T`QT2` H2p2H THM- +QKTH2i2 rBi?  THv2` bi`i
TQbBiBQM M/ Qi?2` 2bb2MiBHbX
 H2p2H biQ`2b Bib rB/i? M/ ?2B;?i- HQM; rBi? irQ ``vběQM2 7Q`
i?2 ;`B/ M/ QM2 7Q` i?2 +iQ`b- r?B+? `2 i?2 /vMKB+ 2H2K2MibX h?2
;`B/ Bb `2T`2b2Mi2/ b M ``v Q7 ``vb- r?2`2 2+? Q7 i?2 BMM2` ``vb
`2T`2b2Mib  ?Q`BxQMiH HBM2 M/ 2+? b[m`2 +QMiBMb 2Bi?2` MmHH- 7Q`
2KTiv b[m`2b- Q`  bi`BM; BM/B+iBM; i?2 ivT2 Q7 i?2 b[m`2ě"wall" Q`
"lava"X
h?2 +iQ`b ``v ?QH/b Q#D2+ib i?i i`+F i?2 +m``2Mi TQbBiBQM M/ bii2
Q7 i?2 /vMKB+ 2H2K2Mib BM i?2 H2p2HX 1+? Q7 i?2b2 Bb 2tT2+i2/ iQ ?p2 
pos T`QT2`iv i?i ;Bp2b Bib TQbBiBQM Ui?2 +QQ`/BMi2b Q7 Bib iQT@H27i +Q`M2`V-
 size T`QT2`iv i?i ;Bp2b Bib bBx2- M/  type T`QT2`iv i?i ?QH/b  bi`BM;
B/2MiB7vBM; i?2 2H2K2Mi U"lava"- "coin"- Q` "player"VX
7i2` #mBH/BM; i?2 ;`B/- r2 mb2 i?2 filter K2i?Q/ iQ }M/ i?2 THv2`
+iQ` Q#D2+i- r?B+? r2 biQ`2 BM  T`QT2`iv Q7 i?2 H2p2HX h?2 status T`QT@
2`iv i`+Fb r?2i?2` i?2 THv2` ?b rQM Q` HQbiX q?2M i?Bb ?TT2Mb-
finishDelay Bb mb2/ iQ F22T i?2 H2p2H +iBp2 7Q`  b?Q`i T2`BQ/ Q7 iBK2 bQ
i?i  bBKTH2 MBKiBQM +M #2 b?QrMX UAKK2/Bi2Hv `2b2iiBM; Q` /@
pM+BM; i?2 H2p2H rQmH/ HQQF +?2TXV h?Bb K2i?Q/ +M #2 mb2/ iQ }M/
Qmi r?2i?2`  H2p2H Bb }MBb?2/,
Level . prototype . isFinished = function () {
return this . status != null && this . finishDelay < 0;
};

+iQ`b
p2+iQ` hQ biQ`2 i?2 TQbBiBQM M/ bBx2 Q7 M +iQ`- r2 rBHH `2im`M iQ Qm`
i`mbiv Vector ivT2- r?B+? ;`QmTb M t@+QQ`/BMi2 M/  v@+QQ`/BMi2 BMiQ
M Q#D2+iX
function Vector (x , y ) {
this . x = x ; this . y = y;

kde
}
Vector . prototype . plus = function ( other ) {
return new Vector ( this . x + other .x , this . y + other . y ) ;
};
Vector . prototype . times = function ( factor ) {
return new Vector ( this . x * factor , this . y * factor ) ;
};

h?2 times K2i?Q/ b+H2b  p2+iQ` #v  ;Bp2M KQmMiX Ai rBHH #2 mb27mH


r?2M r2 M22/ iQ KmHiBTHv  bT22/ p2+iQ` #v  iBK2 BMi2`pH iQ ;2i i?2
/BbiM+2 i`p2H2/ /m`BM; i?i iBK2X
AM i?2 T`2pBQmb b2+iBQM- i?2 actorChars Q#D2+i rb mb2/ #v i?2 Level
+QMbi`m+iQ` iQ bbQ+Bi2 +?`+i2`b rBi? +QMbi`m+iQ` 7mM+iBQMbX h?2
Q#D2+i HQQFb HBF2 i?Bb,
var actorChars = {
" @ ": Player ,
" o ": Coin ,
"=": Lava , "|": Lava , "v ": Lava
};

h?`22 +?`+i2`b KT iQ LavaX h?2 Level +QMbi`m+iQ` Tbb2b i?2 +iQ`Ƕb
bQm`+2 +?`+i2` b i?2 b2+QM/ `;mK2Mi iQ i?2 +QMbi`m+iQ`- M/ i?2
Lava +QMbi`m+iQ` mb2b i?i iQ /Dmbi Bib #2?pBQ` U#QmM+BM; ?Q`BxQMiHHv-
#QmM+BM; p2`iB+HHv- Q` /`BTTBM;VX
h?2 THv2` ivT2 Bb #mBHi rBi? i?2 7QHHQrBM; +QMbi`m+iQ`X Ai ?b  T`QT@
2`iv speed i?i biQ`2b Bib +m``2Mi bT22/- r?B+? rBHH ?2HT bBKmHi2 KQK2M@
imK M/ ;`pBivX
function Player ( pos ) {
this . pos = pos . plus ( new Vector (0 , -0.5) ) ;
this . size = new Vector (0.8 , 1.5) ;
this . speed = new Vector (0 , 0) ;
}
Player . prototype . type = " player ";

"2+mb2  THv2` Bb QM2@M/@@?H7 b[m`2b ?B;?- Bib BMBiBH TQbBiBQM Bb b2i


iQ #2 ?H7  b[m`2 #Qp2 i?2 TQbBiBQM r?2`2 i?2 @ +?`+i2` TT2`2/X
h?Bb rv- Bib #QiiQK HB;Mb rBi? i?2 #QiiQK Q7 i?2 b[m`2 Bi TT2`2/
BMX

kdd
q?2M +QMbi`m+iBM;  /vMKB+ Lava Q#D2+i- r2 M22/ iQ BMBiBHBx2 i?2
Q#D2+i /Bz2`2MiHv /2T2M/BM; QM i?2 +?`+i2` Bi Bb #b2/ QMX .vMKB+
Hp KQp2b HQM; i Bib ;Bp2M bT22/ mMiBH Bi ?Bib M Q#bi+H2X i i?i
TQBMi- B7 Bi ?b  repeatPos T`QT2`iv- Bi rBHH DmKT #+F iQ Bib bi`i TQbBiBQM
U/`BTTBM;VX A7 Bi /Q2b MQi- Bi rBHH BMp2`i Bib bT22/ M/ +QMiBMm2 BM i?2
Qi?2` /B`2+iBQM U#QmM+BM;VX h?2 +QMbi`m+iQ` QMHv b2ib mT i?2 M2+2bb`v
T`QT2`iB2bX h?2 K2i?Q/ i?i /Q2b i?2 +imH KQpBM; rBHH #2 r`Bii2M
Hi2`X
function Lava ( pos , ch ) {
this . pos = pos ;
this . size = new Vector (1 , 1) ;
if ( ch == "=") {
this . speed = new Vector (2 , 0) ;
} else if ( ch == "|") {
this . speed = new Vector (0 , 2) ;
} else if ( ch == " v ") {
this . speed = new Vector (0 , 3) ;
this . repeatPos = pos ;
}
}
Lava . prototype . type = " lava ";

Coin +iQ`b `2 bBKTH2X h?2v KQbiHv Dmbi bBi BM i?2B` TH+2X "mi iQ HBp2M
mT i?2 ;K2  HBiiH2- i?2v `2 ;Bp2M  dzrQ##H2Ǵ-  bHB;?i p2`iB+H KQiBQM
#+F M/ 7Q`i?X hQ i`+F i?Bb-  +QBM Q#D2+i biQ`2b  #b2 TQbBiBQM b
r2HH b  wobble T`QT2`iv i?i i`+Fb i?2 T?b2 Q7 i?2 #QmM+BM; KQiBQMX
hQ;2i?2`- i?2b2 /2i2`KBM2 i?2 +QBMǶb +imH TQbBiBQM UbiQ`2/ BM i?2 pos
T`QT2`ivVX
function Coin ( pos ) {
this . basePos = this . pos = pos . plus ( new Vector (0.2 , 0.1) ) ;
this . size = new Vector (0.6 , 0.6) ;
this . wobble = Math . random () * Math . PI * 2;
}
Coin . prototype . type = " coin ";

AM *?Ti2` Rj- r2 br i?i Math.sin ;Bp2b mb i?2 v@+QQ`/BMi2 Q7  TQBMi


QM  +B`+H2X h?i +QQ`/BMi2 ;Q2b #+F M/ 7Q`i? BM  bKQQi? rp2 7Q`K
b r2 KQp2 HQM; i?2 +B`+H2- r?B+? KF2b i?2 bBM2 7mM+iBQM mb27mH 7Q`
KQ/2HBM;  rpv KQiBQMX

kd3
hQ pQB/  bBimiBQM r?2`2 HH +QBMb KQp2 mT M/ /QrM bvM+?`QMQmbHv-
i?2 bi`iBM; T?b2 Q7 2+? +QBM Bb `M/QKBx2/X h?2 T?b2 Q7 Math.sin
Ƕb rp2- i?2 rB/i? Q7  rp2 Bi T`Q/m+2b- Bb kπ X q2 KmHiBTHv i?2 pHm2
`2im`M2/ #v Math.random #v i?i MmK#2` iQ ;Bp2 i?2 +QBM  `M/QK bi`iBM;
TQbBiBQM QM i?2 rp2X
q2 ?p2 MQr r`Bii2M HH i?2 T`ib M22/2/ iQ `2T`2b2Mi i?2 bii2 Q7 
H2p2HX
var simpleLevel = new Level ( simpleLevelPlan );
console . log ( simpleLevel . width , " by " , simpleLevel . height ) ;
// → 22 by 9

h?2 ibF ?2/ Bb iQ /BbTHv bm+? H2p2Hb QM i?2 b+`22M M/ iQ KQ/2H iBK2
M/ KQiBQM BMbB/2 i?2KX

1M+TbmHiBQM b  #m`/2M
JQbi Q7 i?2 +Q/2 BM i?Bb +?Ti2` /Q2b MQi rQ``v #Qmi 2M+TbmHiBQM 7Q`
irQ `2bQMbX 6B`bi- 2M+TbmHiBQM iF2b 2ti` 2zQ`iX Ai KF2b T`Q;`Kb
#B;;2` M/ `2[mB`2b //BiBQMH +QM+2Tib M/ BMi2`7+2b iQ #2 BMi`Q/m+2/X
aBM+2 i?2`2 Bb QMHv bQ Km+? +Q/2 vQm +M i?`Qr i  `2/2` #27Q`2 i?2B`
2v2b ;Hx2 Qp2`- AǶp2 K/2 M 2zQ`i iQ F22T i?2 T`Q;`K bKHHX
a2+QM/- i?2 p`BQmb 2H2K2Mib BM i?Bb ;K2 `2 bQ +HQb2Hv iB2/ iQ;2i?2`
i?i B7 i?2 #2?pBQ` Q7 QM2 Q7 i?2K +?M;2/- Bi Bb mMHBF2Hv i?i Mv Q7 i?2
Qi?2`b rQmH/ #2 #H2 iQ biv i?2 bK2X AMi2`7+2b #2ir22M i?2 2H2K2Mib
rQmH/ 2M/ mT 2M+Q/BM;  HQi Q7 bbmKTiBQMb #Qmi i?2 rv i?2 ;K2
rQ`FbX h?Bb KF2b i?2K  HQi H2bb 2z2+iBp2ěr?2M2p2` vQm +?M;2 QM2
T`i Q7 i?2 bvbi2K- vQm biBHH ?p2 iQ rQ``v #Qmi i?2 rv Bi BKT+ib i?2
Qi?2` T`ib #2+mb2 i?2B` BMi2`7+2b rQmH/MǶi +Qp2` i?2 M2r bBimiBQMX
aQK2 +miiBM; TQBMib BM  bvbi2K H2M/ i?2Kb2Hp2b r2HH iQ b2T`iBQM
i?`Qm;? `B;Q`Qmb BMi2`7+2b- #mi Qi?2`b /QMǶiX h`vBM; iQ 2M+TbmHi2
bQK2i?BM; i?i BbMǶi  bmBi#H2 #QmM/`v Bb  bm`2 rv iQ rbi2  HQi Q7
2M2`;vX q?2M vQm `2 KFBM; i?Bb KBbiF2- vQmǶHH mbmHHv MQiB+2 i?i
vQm` BMi2`7+2b `2 ;2iiBM; rFr`/Hv H`;2 M/ /2iBH2/ M/ i?i i?2v
M22/ iQ #2 KQ/B}2/ Q7i2M- b i?2 T`Q;`K 2pQHp2bX
h?2`2 Bb QM2 i?BM; i?i r2 rBHH 2M+TbmHi2 BM i?Bb +?Ti2`- M/ i?i
Bb i?2 /`rBM; bm#bvbi2KX h?2 `2bQM 7Q` i?Bb Bb i?i r2 rBHH /BbTHv

kdN
i?2 bK2 ;K2 BM  /Bz2`2Mi rv BM i?2 M2ti +?Ti2`X "v TmiiBM; i?2
/`rBM; #2?BM/ M BMi2`7+2- r2 +M bBKTHv HQ/ i?2 bK2 ;K2 T`Q;`K
i?2`2 M/ THm; BM  M2r /BbTHv KQ/mH2X

.`rBM;
h?2 2M+TbmHiBQM Q7 i?2 /`rBM; +Q/2 Bb /QM2 #v /2}MBM;  /BbTHv
Q#D2+i- r?B+? /BbTHvb  ;Bp2M H2p2HX h?2 /BbTHv ivT2 r2 /2}M2 BM i?Bb
+?Ti2` Bb +HH2/ DOMDisplay #2+mb2 Bi mb2b bBKTH2 .PJ 2H2K2Mib iQ b?Qr
i?2 H2p2HX
q2 rBHH #2 mbBM;  bivH2 b?22i iQ b2i i?2 +imH +QHQ`b M/ Qi?2` }t2/
T`QT2`iB2b Q7 i?2 2H2K2Mib i?i KF2 mT i?2 ;K2X Ai rQmH/ HbQ #2
TQbbB#H2 iQ /B`2+iHv bbB;M iQ i?2 2H2K2MibǶ style T`QT2`iv r?2M r2 +`2i2
i?2K- #mi i?i rQmH/ T`Q/m+2 KQ`2 p2`#Qb2 T`Q;`KbX
h?2 7QHHQrBM; ?2HT2` 7mM+iBQM T`QpB/2b  b?Q`i rv iQ +`2i2 M 2H2K2Mi
M/ ;Bp2 Bi  +Hbb,
function elt ( name , className ) {
var elt = document . createElement ( name ) ;
if ( className ) elt . className = className ;
return elt ;
}

 /BbTHv Bb +`2i2/ #v ;BpBM; Bi  T`2Mi 2H2K2Mi iQ r?B+? Bi b?QmH/


TT2M/ Bib2H7 M/  H2p2H Q#D2+iX
function DOMDisplay ( parent , level ) {
this . wrap = parent . appendChild ( elt (" div " , " game ") ) ;
this . level = level ;

this . wrap . appendChild ( this . drawBackground () ) ;


this . actorLayer = null ;
this . drawFrame () ;
}

q2 mb2/ i?2 7+i i?i appendChild `2im`Mb i?2 TT2M/2/ 2H2K2Mi iQ +`2@
i2 i?2 r`TT2` 2H2K2Mi M/ biQ`2 Bi BM i?2 wrap T`QT2`iv BM  bBM;H2
bii2K2MiX
h?2 H2p2HǶb #+F;`QmM/- r?B+? M2p2` +?M;2b- Bb /`rM QM+2X h?2

k3y
+iQ`b `2 `2/`rM 2p2`v iBK2 i?2 /BbTHv Bb mT/i2/X h?2 actorLayer
T`QT2`iv rBHH #2 mb2/ #v drawFrame iQ i`+F i?2 2H2K2Mi i?i ?QH/b i?2
+iQ`b bQ i?i i?2v +M #2 2bBHv `2KQp2/ M/ `2TH+2/X
Pm` +QQ`/BMi2b M/ bBx2b `2 i`+F2/ BM mMBib `2HiBp2 iQ i?2 ;`B/ bBx2-
r?2`2  bBx2 Q` /BbiM+2 Q7 R K2Mb R ;`B/ mMBiX q?2M b2iiBM; TBt2H bBx2b-
r2 rBHH ?p2 iQ b+H2 i?2b2 +QQ`/BMi2b mTě2p2`vi?BM; BM i?2 ;K2 rQmH/
#2 `B/B+mHQmbHv bKHH i  bBM;H2 TBt2H T2` b[m`2X h?2 scale p`B#H2 ;Bp2b
i?2 MmK#2` Q7 TBt2Hb i?i  bBM;H2 mMBi iF2b mT QM i?2 b+`22MX
var scale = 20;

DOMDisplay . prototype . drawBackground = function () {


var table = elt (" table " , " background ") ;
table . style . width = this . level . width * scale + " px ";
this . level . grid . forEach ( function ( row ) {
var rowElt = table . appendChild ( elt (" tr ") );
rowElt . style . height = scale + " px ";
row . forEach ( function ( type ) {
rowElt . appendChild ( elt (" td ", type ) ) ;
}) ;
}) ;
return table ;
};

b K2MiBQM2/ 2`HB2`- i?2 #+F;`QmM/ Bb /`rM b  <table> 2H2K2MiX h?Bb


MB+2Hv +Q``2bTQM/b iQ i?2 bi`m+im`2 Q7 i?2 grid T`QT2`iv BM i?2 H2p2Hě2+?
`Qr Q7 i?2 ;`B/ Bb im`M2/ BMiQ  i#H2 `Qr U<tr> 2H2K2MiVX h?2 bi`BM;b
BM i?2 ;`B/ `2 mb2/ b +Hbb MK2b 7Q` i?2 i#H2 +2HH U<td>V 2H2K2MibX
h?2 7QHHQrBM; *aa ?2HTb i?2 `2bmHiBM; i#H2 HQQF HBF2 i?2 #+F;`QmM/ r2
rMi,
. background { background : rgb (52 , 166 , 251) ;
table - layout : fixed ;
border - spacing : 0; }
. background td { padding : 0; }
. lava { background : rgb (255 , 100 , 100) ; }
. wall { background : white ; }

aQK2 Q7 i?2b2 Utable-layout- border-spacing- M/ paddingV `2 bBKTHv mb2/


iQ bmTT`2bb mMrMi2/ /27mHi #2?pBQ`X q2 /QMǶi rMi i?2 HvQmi Q7 i?2
i#H2 iQ /2T2M/ mTQM i?2 +QMi2Mib Q7 Bib +2HHb- M/ r2 /QMǶi rMi bT+2

k3R
#2ir22M i?2 i#H2 +2HHb Q` T//BM; BMbB/2 i?2KX
h?2 background `mH2 b2ib i?2 #+F;`QmM/ +QHQ`X *aa HHQrb +QHQ`b iQ #2
bT2+B}2/ #Qi? b rQ`/b UwhiteV M/ rBi?  7Q`Ki bm+? b rgb(R, G, B)-
r?2`2 i?2 `2/- ;`22M- M/ #Hm2 +QKTQM2Mib Q7 i?2 +QHQ` `2 b2T`i2/ BMiQ
i?`22 MmK#2`b 7`QK y iQ k88X aQ- BM rgb(52, 166, 251)- i?2 `2/ +QKTQM2Mi
Bb 8k- ;`22M Bb Ree- M/ #Hm2 Bb k8RX aBM+2 i?2 #Hm2 +QKTQM2Mi Bb i?2
H`;2bi- i?2 `2bmHiBM; +QHQ` rBHH #2 #HmBb?X uQm +M b22 i?i BM i?2 .lava
`mH2- i?2 }`bi MmK#2` U`2/V Bb i?2 H`;2biX
q2 /`r 2+? +iQ` #v +`2iBM;  .PJ 2H2K2Mi 7Q` Bi M/ b2iiBM; i?i
2H2K2MiǶb TQbBiBQM M/ bBx2 #b2/ QM i?2 +iQ`Ƕb T`QT2`iB2bX h?2 pHm2b
?p2 iQ #2 KmHiBTHB2/ #v scale iQ ;Q 7`QK ;K2 mMBib iQ TBt2HbX
DOMDisplay . prototype . drawActors = function () {
var wrap = elt (" div ") ;
this . level . actors . forEach ( function ( actor ) {
var rect = wrap . appendChild ( elt (" div ",
" actor " + actor . type ) ) ;
rect . style . width = actor . size . x * scale + " px ";
rect . style . height = actor . size . y * scale + " px ";
rect . style . left = actor . pos . x * scale + " px ";
rect . style . top = actor . pos .y * scale + " px ";
}) ;
return wrap ;
};

hQ ;Bp2 M 2H2K2Mi KQ`2 i?M QM2 +Hbb- r2 b2T`i2 i?2 +Hbb MK2b
#v bT+2bX AM i?2 *aa +Q/2 b?QrM M2ti- i?2 actor +Hbb ;Bp2b i?2 +iQ`b
i?2B` #bQHmi2 TQbBiBQMX h?2B` ivT2 MK2 Bb mb2/ b M 2ti` +Hbb iQ ;Bp2
i?2K  +QHQ`X q2 /QMǶi ?p2 iQ /2}M2 i?2 lava +Hbb ;BM #2+mb2 r2
`2mb2 i?2 +Hbb 7Q` i?2 Hp ;`B/ b[m`2b r?B+? r2 /2}M2/ 2`HB2`X
. actor { position : absolute ; }
. coin { background : rgb (241 , 229 , 89) ; }
. player { background : rgb (64 , 64 , 64) ; }

q?2M Bi mT/i2b i?2 /BbTHv- i?2 drawFrame K2i?Q/ }`bi `2KQp2b i?2 QH/
+iQ` ;`T?B+b- B7 Mv- M/ i?2M `2/`rb i?2K BM i?2B` M2r TQbBiBQMbX Ai
Kv #2 i2KTiBM; iQ i`v iQ `2mb2 i?2 .PJ 2H2K2Mib 7Q` +iQ`b- #mi iQ
KF2 i?i rQ`F- r2 rQmH/ M22/  HQi Q7 //BiBQMH BM7Q`KiBQM ~Qr #2@
ir22M i?2 /BbTHv +Q/2 M/ i?2 bBKmHiBQM +Q/2X q2Ƕ/ M22/ iQ bbQ+Bi2

k3k
+iQ`b rBi? .PJ 2H2K2Mib- M/ i?2 /`rBM; +Q/2 Kmbi `2KQp2 2H2K2Mib
r?2M i?2B` +iQ`b pMBb?X aBM+2 i?2`2 rBHH ivTB+HHv #2 QMHv  ?M/7mH Q7
+iQ`b BM i?2 ;K2- `2/`rBM; HH Q7 i?2K Bb MQi 2tT2MbBp2X
DOMDisplay . prototype . drawFrame = function () {
if ( this . actorLayer )
this . wrap . removeChild ( this . actorLayer );
this . actorLayer = this . wrap . appendChild ( this . drawActors () ) ;
this . wrap . className = " game " + ( this . level . status || "") ;
this . scrollPlayerIntoView () ;
};

"v //BM; i?2 H2p2HǶb +m``2Mi biimb b  +Hbb MK2 iQ i?2 r`TT2`- r2
+M bivH2 i?2 THv2` +iQ` bHB;?iHv /Bz2`2MiHv r?2M i?2 ;K2 Bb rQM Q`
HQbi #v //BM;  *aa `mH2 i?i iF2b 2z2+i QMHv r?2M i?2 THv2` ?b M
M+2biQ` 2H2K2Mi rBi?  ;Bp2M +HbbX
. lost . player {
background : rgb (160 , 64 , 64) ;
}
. won . player {
box - shadow : -4 px -7 px 8 px white , 4 px -7 px 8 px white ;
}

7i2` iQm+?BM; Hp- i?2 THv2`Ƕb +QHQ` im`Mb /`F `2/- bm;;2biBM; b+Q`+?@
BM;X q?2M i?2 Hbi +QBM ?b #22M +QHH2+i2/- r2 mb2 irQ #Hm``2/ r?Bi2
#Qt b?/Qrb- QM2 iQ i?2 iQT H27i M/ QM2 iQ i?2 iQT `B;?i- iQ +`2i2 
r?Bi2 ?HQ 2z2+iX
q2 +MǶi bbmK2 i?i H2p2Hb Hrvb }i BM i?2 pB2rTQ`iX h?i Bb r?v
i?2 scrollPlayerIntoView +HH Bb M22/2/ěBi 2Mbm`2b i?i B7 i?2 H2p2H Bb T`Q@
i`m/BM; QmibB/2 i?2 pB2rTQ`i- r2 b+`QHH i?i pB2rTQ`i iQ KF2 bm`2 i?2
THv2` Bb M2` Bib +2Mi2`X h?2 7QHHQrBM; *aa ;Bp2b i?2 ;K2Ƕb r`TTBM;
.PJ 2H2K2Mi  KtBKmK bBx2 M/ 2Mbm`2b i?i Mvi?BM; i?i biB+Fb
Qmi Q7 i?2 2H2K2MiǶb #Qt Bb MQi pBbB#H2X q2 HbQ ;Bp2 i?2 Qmi2` 2H2K2Mi
 `2HiBp2 TQbBiBQM bQ i?i i?2 +iQ`b BMbB/2 Bi `2 TQbBiBQM2/ `2HiBp2 iQ
i?2 H2p2HǶb iQT@H27i +Q`M2`X
. game {
overflow : hidden ;
max - width : 600 px ;
max - height : 450 px ;

k3j
position : relative ;
}

AM i?2 scrollPlayerIntoView K2i?Q/- r2 }M/ i?2 THv2`Ƕb TQbBiBQM M/ mT@


/i2 i?2 r`TTBM; 2H2K2MiǶb b+`QHH TQbBiBQMX q2 +?M;2 i?2 b+`QHH TQbB@
iBQM #v KMBTmHiBM; i?i 2H2K2MiǶb scrollLeft M/ scrollTop T`QT2`iB2b
r?2M i?2 THv2` Bb iQQ +HQb2 iQ i?2 2/;2X
DOMDisplay . prototype . scrollPlayerIntoView = function () {
var width = this . wrap . clientWidth ;
var height = this . wrap . clientHeight ;
var margin = width / 3;

// The viewport
var left = this . wrap . scrollLeft , right = left + width ;
var top = this . wrap . scrollTop , bottom = top + height ;

var player = this . level . player ;


var center = player . pos . plus ( player . size . times (0.5) )
. times ( scale ) ;

if ( center .x < left + margin )


this . wrap . scrollLeft = center .x - margin ;
else if ( center . x > right - margin )
this . wrap . scrollLeft = center .x + margin - width ;
if ( center .y < top + margin )
this . wrap . scrollTop = center . y - margin ;
else if ( center . y > bottom - margin )
this . wrap . scrollTop = center . y + margin - height ;
};

h?2 rv i?2 THv2`Ƕb +2Mi2` Bb 7QmM/ b?Qrb ?Qr i?2 K2i?Q/b QM Qm`
Vector ivT2 HHQr +QKTmiiBQMb rBi? Q#D2+ib iQ #2 r`Bii2M BM  `2/#H2
rvX hQ }M/ i?2 +iQ`Ƕb +2Mi2`- r2 // Bib TQbBiBQM UBib iQT@H27i +Q`M2`V
M/ ?H7 Bib bBx2X h?i Bb i?2 +2Mi2` BM H2p2H +QQ`/BMi2b- #mi r2 M22/
Bi BM TBt2H +QQ`/BMi2b- bQ r2 i?2M KmHiBTHv i?2 `2bmHiBM; p2+iQ` #v Qm`
/BbTHv b+H2X
L2ti-  b2`B2b Q7 +?2+Fb p2`B7v i?i i?2 THv2` TQbBiBQM BbMǶi QmibB/2
Q7 i?2 HHQr2/ `M;2X LQi2 i?i bQK2iBK2b i?Bb rBHH b2i MQMb2Mb2 b+`QHH
+QQ`/BMi2b- #2HQr x2`Q Q` #2vQM/ i?2 2H2K2MiǶb b+`QHH#H2 `2X h?Bb Bb
QFvěi?2 .PJ rBHH +QMbi`BM i?2K iQ bM2 pHm2bX a2iiBM; scrollLeft

k39
iQ @Ry rBHH +mb2 Bi iQ #2+QK2 yX
Ai rQmH/ ?p2 #22M bHB;?iHv bBKTH2` iQ Hrvb i`v iQ b+`QHH i?2 THv2`
iQ i?2 +2Mi2` Q7 i?2 pB2rTQ`iX "mi i?Bb +`2i2b  `i?2` D``BM; 2z2+iX b
vQm `2 DmKTBM;- i?2 pB2r rBHH +QMbiMiHv b?B7i mT M/ /QrMX Ai Bb KQ`2
TH2bMi iQ ?p2  dzM2mi`HǴ `2 BM i?2 KB//H2 Q7 i?2 b+`22M r?2`2 vQm
+M KQp2 `QmM/ rBi?Qmi +mbBM; Mv b+`QHHBM;X
6BMHHv- r2ǶHH M22/  rv iQ +H2`  /BbTHv2/ H2p2H- iQ #2 mb2/ r?2M
i?2 ;K2 KQp2b iQ i?2 M2ti H2p2H Q` `2b2ib  H2p2HX
DOMDisplay . prototype . clear = function () {
this . wrap . parentNode . removeChild ( this . wrap ) ;
};

q2 `2 MQr #H2 iQ /BbTHv Qm` iBMv H2p2HX


< link rel =" stylesheet " href =" css / game . css ">

< script >


var simpleLevel = new Level ( simpleLevelPlan ) ;
var display = new DOMDisplay ( document . body , simpleLevel ) ;
</ script >

h?2 <link> i;- r?2M mb2/ rBi? rel="stylesheet"- Bb  rv iQ HQ/  *aa
}H2 BMiQ  T;2X h?2 }H2 game.css +QMiBMb i?2 bivH2b M2+2bb`v 7Q` Qm`
;K2X

JQiBQM M/ +QHHBbBQM


LQr r2Ƕ`2 i i?2 TQBMi r?2`2 r2 +M bi`i //BM; KQiBQMěi?2 KQbi
BMi2`2biBM; bT2+i Q7 i?2 ;K2X h?2 #bB+ TT`Q+?- iF2M #v KQbi ;K2b
HBF2 i?Bb- Bb iQ bTHBi iBK2 BMiQ bKHH bi2Tb M/- 7Q` 2+? bi2T- KQp2 i?2

k38
+iQ`b #v  /BbiM+2 +Q``2bTQM/BM; iQ i?2B` bT22/ U/BbiM+2 KQp2/ T2`
b2+QM/V KmHiBTHB2/ #v i?2 bBx2 Q7 i?2 iBK2 bi2T UBM b2+QM/bVX
h?i Bb 2bvX h?2 /B{+mHi T`i Bb /2HBM; rBi? i?2 BMi2`+iBQMb #2ir22M
i?2 2H2K2MibX q?2M i?2 THv2` ?Bib  rHH Q` ~QQ`- i?2v b?QmH/ MQi bBKTHv
KQp2 i?`Qm;? BiX h?2 ;K2 Kmbi MQiB+2 r?2M  ;Bp2M KQiBQM +mb2b M
Q#D2+i iQ ?Bi MQi?2` Q#D2+i M/ `2bTQM/ ++Q`/BM;HvX 6Q` rHHb- i?2
KQiBQM Kmbi #2 biQTT2/X 6Q` +QBMb- i?2 +QBM Kmbi #2 +QHH2+i2/- M/ bQ
QMX
aQHpBM; i?Bb 7Q` i?2 ;2M2`H +b2 Bb  #B; ibFX uQm +M }M/ HB#``B2b-
mbmHHv +HH2/ T?vbB+b 2M;BM2b- i?i bBKmHi2 BMi2`+iBQM #2ir22M T?vbB+H
Q#D2+ib BM irQ Q` i?`22 /BK2MbBQMbX q2ǶHH iF2  KQ`2 KQ/2bi TT`Q+?
BM i?Bb +?Ti2`- ?M/HBM; QMHv +QHHBbBQMb #2ir22M `2+iM;mH` Q#D2+ib M/
?M/HBM; i?2K BM  `i?2` bBKTHBbiB+ rvX
"27Q`2 KQpBM; i?2 THv2` Q`  #HQ+F Q7 Hp- r2 i2bi r?2i?2` i?2 KQiBQM
rQmH/ iF2 Bi BMbB/2 Q7  MQM2KTiv T`i Q7 i?2 #+F;`QmM/X A7 Bi /Q2b-
r2 bBKTHv +M+2H i?2 KQiBQM HiQ;2i?2`X h?2 `2bTQMb2 iQ bm+?  +QHHBbBQM
/2T2M/b QM i?2 ivT2 Q7 +iQ`ěi?2 THv2` rBHH biQT- r?2`2b  Hp #HQ+F
rBHH #QmM+2 #+FX
h?Bb TT`Q+? `2[mB`2b Qm` iBK2 bi2Tb iQ #2 `i?2` bKHH bBM+2 Bi rBHH
+mb2 KQiBQM iQ biQT #27Q`2 i?2 Q#D2+ib +imHHv iQm+?X A7 i?2 iBK2 bi2Tb
UM/ i?mb i?2 KQiBQM bi2TbV `2 iQQ #B;- i?2 THv2` rQmH/ 2M/ mT ?Qp2`BM;
 MQiB+2#H2 /BbiM+2 #Qp2 i?2 ;`QmM/X MQi?2` TT`Q+?- `;m#Hv
#2ii2` #mi KQ`2 +QKTHB+i2/- rQmH/ #2 iQ }M/ i?2 2t+i +QHHBbBQM bTQi
M/ KQp2 i?2`2X q2 rBHH iF2 i?2 bBKTH2 TT`Q+? M/ ?B/2 Bib T`Q#H2Kb
#v 2Mbm`BM; i?2 MBKiBQM T`Q+22/b BM bKHH bi2TbX
h?Bb K2i?Q/ i2HHb mb r?2i?2`  `2+iM;H2 UbT2+B}2/ #v  TQbBiBQM M/
 bBx2V Qp2`HTb rBi? Mv MQM2KTiv bT+2 QM i?2 #+F;`QmM/ ;`B/,
Level . prototype . obstacleAt = function ( pos , size ) {
var xStart = Math . floor ( pos . x );
var xEnd = Math . ceil ( pos . x + size . x ) ;
var yStart = Math . floor ( pos . y );
var yEnd = Math . ceil ( pos . y + size . y ) ;

if ( xStart < 0 || xEnd > this . width || yStart < 0)


return " wall ";
if ( yEnd > this . height )
return " lava ";

k3e
for ( var y = yStart ; y < yEnd ; y ++) {
for ( var x = xStart ; x < xEnd ; x ++) {
var fieldType = this . grid [ y ][ x ];
if ( fieldType ) return fieldType ;
}
}
};

h?Bb K2i?Q/ +QKTmi2b i?2 b2i Q7 ;`B/ b[m`2b i?i i?2 #Q/v Qp2`HTb rBi?
#v mbBM; Math.floor M/ Math.ceil QM i?2 #Q/vǶb +QQ`/BMi2bX _2K2K#2`
i?i ;`B/ b[m`2b `2 R×R mMBib BM bBx2X "v `QmM/BM; i?2 bB/2b Q7  #Qt mT
M/ /QrM- r2 ;2i i?2 `M;2 Q7 #+F;`QmM/ b[m`2b i?i i?2 #Qt iQm+?2bX

A7 i?2 #Q/v biB+Fb Qmi Q7 i?2 H2p2H- r2 Hrvb `2im`M "wall" 7Q` i?2 bB/2b
M/ iQT M/ "lava" 7Q` i?2 #QiiQKX h?Bb 2Mbm`2b i?i i?2 THv2` /B2b
r?2M 7HHBM; Qmi Q7 i?2 rQ`H/X q?2M i?2 #Q/v Bb 7mHHv BMbB/2 i?2 ;`B/- r2
HQQT Qp2` i?2 #HQ+F Q7 ;`B/ b[m`2b 7QmM/ #v `QmM/BM; i?2 +QQ`/BMi2b
M/ `2im`M i?2 +QMi2Mi Q7 i?2 }`bi MQM2KTiv b[m`2 r2 }M/X
*QHHBbBQMb #2ir22M i?2 THv2` M/ Qi?2` /vMKB+ +iQ`b U+QBMb- KQpBM;
HpV `2 ?M/H2/ 7i2` i?2 THv2` KQp2/X q?2M i?2 KQiBQM ?b iF2M
i?2 THv2` BMiQ MQi?2` +iQ`- i?2 TT`QT`Bi2 2z2+iě+QHH2+iBM;  +QBM
Q` /vBM;ěBb +iBpi2/X
h?Bb K2i?Q/ b+Mb i?2 ``v Q7 +iQ`b- HQQFBM; 7Q` M +iQ` i?i Qp2`@
HTb i?2 QM2 ;Bp2M b M `;mK2Mi,
Level . prototype . actorAt = function ( actor ) {
for ( var i = 0; i < this . actors . length ; i ++) {
var other = this . actors [i ];
if ( other != actor &&
actor . pos . x + actor . size . x > other . pos .x &&
actor . pos . x < other . pos .x + other . size .x &&
actor . pos . y + actor . size . y > other . pos .y &&
actor . pos . y < other . pos .y + other . size .y)

k3d
return other ;
}
};

+iQ`b M/ +iBQMb


h?2 animate K2i?Q/ QM i?2 Level ivT2 ;Bp2b HH +iQ`b BM i?2 H2p2H  +?M+2
iQ KQp2X Aib step `;mK2Mi Bb i?2 iBK2 bi2T BM b2+QM/bX h?2 keys Q#D2+i
+QMiBMb BM7Q`KiBQM #Qmi i?2 ``Qr F2vb i?2 THv2` ?b T`2bb2/X
var maxStep = 0.05;

Level . prototype . animate = function ( step , keys ) {


if ( this . status != null )
this . finishDelay -= step ;

while ( step > 0) {


var thisStep = Math . min ( step , maxStep );
this . actors . forEach ( function ( actor ) {
actor . act ( thisStep , this , keys );
}, this ) ;
step -= thisStep ;
}
};

q?2M i?2 H2p2HǶb status T`QT2`iv ?b  MQM@MmHH pHm2 Ur?B+? Bb i?2 +b2
r?2M i?2 THv2` ?b rQM Q` HQbiV- r2 Kmbi +QmMi /QrM i?2 finishDelay
T`QT2`iv- r?B+? i`+Fb i?2 iBK2 #2ir22M i?2 TQBMi r?2`2 rBMMBM; Q`
HQbBM; ?TT2Mb M/ i?2 TQBMi r?2`2 r2 rMi iQ biQT b?QrBM; i?2 H2p2HX
h?2 while HQQT +mib i?2 iBK2 bi2T r2 `2 MBKiBM; BMiQ bmBi#Hv bKHH
TB2+2bX Ai 2Mbm`2b i?i MQ bi2T H`;2` i?M maxStep Bb iF2MX 6Q` 2tKTH2-
 step Q7 yXRk b2+QM/ rQmH/ #2 +mi BMiQ irQ bi2Tb Q7 yXy8 b2+QM/b M/ QM2
bi2T Q7 yXykX
+iQ` Q#D2+ib ?p2 M act K2i?Q/- r?B+? iF2b b `;mK2Mib i?2 iBK2
bi2T- i?2 H2p2H Q#D2+i- M/ i?2 keys Q#D2+iX >2`2 Bb QM2- 7Q` i?2 Lava +iQ`
ivT2- r?B+? B;MQ`2b i?2 keys Q#D2+i,
Lava . prototype . act = function ( step , level ) {
var newPos = this . pos . plus ( this . speed . times ( step ) ) ;

k33
if (! level . obstacleAt ( newPos , this . size ) )
this . pos = newPos ;
else if ( this . repeatPos )
this . pos = this . repeatPos ;
else
this . speed = this . speed . times ( -1) ;
};

Ai +QKTmi2b  M2r TQbBiBQM #v //BM; i?2 T`Q/m+i Q7 i?2 iBK2 bi2T M/
Bib +m``2Mi bT22/ iQ Bib QH/ TQbBiBQMX A7 MQ Q#bi+H2 #HQ+Fb i?i M2r
TQbBiBQM- Bi KQp2b i?2`2X A7 i?2`2 Bb M Q#bi+H2- i?2 #2?pBQ` /2T2M/b
QM i?2 ivT2 Q7 i?2 Hp #HQ+Fě/`BTTBM; Hp ?b  repeatPos T`QT2`iv-
iQ r?B+? Bi DmKTb #+F r?2M Bi ?Bib bQK2i?BM;X "QmM+BM; Hp bBKTHv
BMp2`ib Bib bT22/ UKmHiBTHB2b Bi #v @RV BM Q`/2` iQ bi`i KQpBM; BM i?2
Qi?2` /B`2+iBQMX
*QBMb mb2 i?2B` act K2i?Q/ iQ rQ##H2X h?2v B;MQ`2 +QHHBbBQMb bBM+2 i?2v
`2 bBKTHv rQ##HBM; `QmM/ BMbB/2 Q7 i?2B` QrM b[m`2- M/ +QHHBbBQMb
rBi? i?2 THv2` rBHH #2 ?M/H2/ #v i?2 THv2`Ƕb act K2i?Q/X
var wobbleSpeed = 8 , wobbleDist = 0.07;

Coin . prototype . act = function ( step ) {


this . wobble += step * wobbleSpeed ;
var wobblePos = Math . sin ( this . wobble ) * wobbleDist ;
this . pos = this . basePos . plus ( new Vector (0 , wobblePos ) ) ;
};

h?2 wobble T`QT2`iv Bb mT/i2/ iQ i`+F iBK2 M/ i?2M mb2/ b M `@
;mK2Mi iQ Math.sin iQ +`2i2  rp2- r?B+? Bb mb2/ iQ +QKTmi2  M2r
TQbBiBQMX
h?i H2p2b i?2 THv2` Bib2H7X SHv2` KQiBQM Bb ?M/H2/ b2T`i2Hv T2`
tBb #2+mb2 ?BiiBM; i?2 ~QQ` b?QmH/ MQi T`2p2Mi ?Q`BxQMiH KQiBQM- M/
?BiiBM;  rHH b?QmH/ MQi biQT 7HHBM; Q` DmKTBM; KQiBQMX h?Bb K2i?Q/
BKTH2K2Mib i?2 ?Q`BxQMiH T`i,
var playerXSpeed = 7;

Player . prototype . moveX = function ( step , level , keys ) {


this . speed . x = 0;
if ( keys . left ) this . speed .x -= playerXSpeed ;
if ( keys . right ) this . speed .x += playerXSpeed ;

k3N
var motion = new Vector ( this . speed . x * step , 0) ;
var newPos = this . pos . plus ( motion ) ;
var obstacle = level . obstacleAt ( newPos , this . size ) ;
if ( obstacle )
level . playerTouched ( obstacle );
else
this . pos = newPos ;
};

h?2 ?Q`BxQMiH KQiBQM Bb +QKTmi2/ #b2/ QM i?2 bii2 Q7 i?2 H27i M/
`B;?i ``Qr F2vbX q?2M  KQiBQM +mb2b i?2 THv2` iQ ?Bi bQK2i?BM;- i?2
H2p2HǶb playerTouched K2i?Q/- r?B+? ?M/H2b i?BM;b HBF2 /vBM; BM Hp M/
+QHH2+iBM; +QBMb- Bb +HH2/X Pi?2`rBb2- i?2 Q#D2+i mT/i2b Bib TQbBiBQMX
o2`iB+H KQiBQM rQ`Fb BM  bBKBH` rv #mi ?b iQ bBKmHi2 DmKTBM;
M/ ;`pBivX
var gravity = 30;
var jumpSpeed = 17;

Player . prototype . moveY = function ( step , level , keys ) {


this . speed . y += step * gravity ;
var motion = new Vector (0 , this . speed . y * step ) ;
var newPos = this . pos . plus ( motion ) ;
var obstacle = level . obstacleAt ( newPos , this . size ) ;
if ( obstacle ) {
level . playerTouched ( obstacle );
if ( keys . up && this . speed .y > 0)
this . speed . y = - jumpSpeed ;
else
this . speed . y = 0;
} else {
this . pos = newPos ;
}
};

i i?2 bi`i Q7 i?2 K2i?Q/- i?2 THv2` Bb ++2H2`i2/ p2`iB+HHv iQ ++QmMi


7Q` ;`pBivX h?2 ;`pBiv- DmKTBM; bT22/- M/ T`2iiv Km+? HH Qi?2` +QM@
biMib BM i?Bb ;K2 ?p2 #22M b2i #v i`BH M/ 2``Q`X A i2bi2/ p`BQmb
pHm2b mMiBH A 7QmM/  +QK#BMiBQM A HBF2/X

kNy
L2ti- r2 +?2+F 7Q` Q#bi+H2b ;BMX A7 r2 ?Bi M Q#bi+H2- i?2`2 `2 irQ
TQbbB#H2 Qmi+QK2bX q?2M i?2 mT ``Qr Bb T`2bb2/ M/ r2 `2 KQpBM;
/QrM UK2MBM; i?2 i?BM; r2 ?Bi Bb #2HQr mbV- i?2 bT22/ Bb b2i iQ 
`2HiBp2Hv H`;2- M2;iBp2 pHm2X h?Bb +mb2b i?2 THv2` iQ DmKTX A7 i?i
Bb MQi i?2 +b2- r2 bBKTHv #mKT2/ BMiQ bQK2i?BM;- M/ i?2 bT22/ Bb `2b2i
iQ x2`QX
h?2 +imH act K2i?Q/ HQQFb HBF2 i?Bb,
Player . prototype . act = function ( step , level , keys ) {
this . moveX ( step , level , keys ) ;
this . moveY ( step , level , keys ) ;

var otherActor = level . actorAt ( this ) ;


if ( otherActor )
level . playerTouched ( otherActor . type , otherActor );

// Losing animation
if ( level . status == " lost ") {
this . pos . y += step ;
this . size . y -= step ;
}
};

7i2` KQpBM;- i?2 K2i?Q/ +?2+Fb 7Q` Qi?2` +iQ`b i?i i?2 THv2` Bb
+QHHB/BM; rBi? M/ ;BM +HHb playerTouched r?2M Bi }M/b QM2X h?Bb iBK2-
Bi Tbb2b i?2 +iQ` Q#D2+i b i?2 b2+QM/ `;mK2Mi #2+mb2 B7 i?2 Qi?2`
+iQ` Bb  +QBM- playerTouched M22/b iQ FMQr r?B+? +QBM Bb #2BM; +QHH2+i2/X
6BMHHv- r?2M i?2 THv2` /B2b UiQm+?2b HpV- r2 b2i mT  HBiiH2 MBKiBQM
i?i +mb2b i?2K iQ dzb?`BMFǴ Q` dzbBMFǴ /QrM #v `2/m+BM; i?2 ?2B;?i Q7
i?2 THv2` Q#D2+iX
M/ ?2`2 Bb i?2 K2i?Q/ i?i ?M/H2b +QHHBbBQMb #2ir22M i?2 THv2` M/
Qi?2` Q#D2+ib,
Level . prototype . playerTouched = function ( type , actor ) {
if ( type == " lava " && this . status == null ) {
this . status = " lost ";
this . finishDelay = 1;
} else if ( type == " coin ") {
this . actors = this . actors . filter ( function ( other ) {
return other != actor ;
}) ;

kNR
if (! this . actors . some ( function ( actor ) {
return actor . type == " coin ";
}) ) {
this . status = " won ";
this . finishDelay = 1;
}
}
};

q?2M Hp Bb iQm+?2/- i?2 ;K2Ƕb biimb Bb b2i iQ "lost"X q?2M  +QBM Bb
iQm+?2/- i?i +QBM Bb `2KQp2/ 7`QK i?2 ``v Q7 +iQ`b- M/ B7 Bi rb i?2
Hbi QM2- i?2 ;K2Ƕb biimb Bb b2i iQ "won"X
h?Bb ;Bp2b mb  H2p2H i?i +M +imHHv #2 MBKi2/X HH i?i Bb KBbbBM;
MQr Bb i?2 +Q/2 i?i /`Bp2b i?2 MBKiBQMX

h`+FBM; F2vb
6Q`  ;K2 HBF2 i?Bb- r2 /Q MQi rMi F2vb iQ iF2 2z2+i QM+2 T2` F2v@
T`2bbX _i?2`- r2 rMi i?2B` 2z2+i UKQpBM; i?2 THv2` };m`2V iQ +QMiBMm2
?TT2MBM; b HQM; b i?2v `2 T`2bb2/X
q2 M22/ iQ b2i mT  F2v ?M/H2` i?i biQ`2b i?2 +m``2Mi bii2 Q7 i?2
H27i- `B;?i- M/ mT ``Qr F2vbX q2 rBHH HbQ rMi iQ +HH preventDefault
7Q` i?Qb2 F2vb bQ i?i i?2v /QMǶi 2M/ mT b+`QHHBM; i?2 T;2X
h?2 7QHHQrBM; 7mM+iBQM- r?2M ;Bp2M M Q#D2+i rBi? F2v +Q/2b b T`QT@
2`iv MK2b M/ F2v MK2b b pHm2b- rBHH `2im`M M Q#D2+i i?i i`+Fb i?2
+m``2Mi TQbBiBQM Q7 i?Qb2 F2vbX Ai `2;Bbi2`b 2p2Mi ?M/H2`b 7Q` "keydown"
M/ "keyup" 2p2Mib M/- r?2M i?2 F2v +Q/2 BM i?2 2p2Mi Bb T`2b2Mi BM i?2
b2i Q7 +Q/2b i?i Bi Bb i`+FBM;- mT/i2b i?2 Q#D2+iX
var arrowCodes = {37: " left ", 38: " up ", 39: " right "};

function trackKeys ( codes ) {


var pressed = Object . create ( null );
function handler ( event ) {
if ( codes . hasOwnProperty ( event . keyCode ) ) {
var down = event . type == " keydown ";
pressed [ codes [ event . keyCode ]] = down ;
event . preventDefault () ;
}

kNk
}
addEventListener (" keydown ", handler );
addEventListener (" keyup ", handler );
return pressed ;
}

LQi2 ?Qr i?2 bK2 ?M/H2` 7mM+iBQM Bb mb2/ 7Q` #Qi? 2p2Mi ivT2bX Ai
HQQFb i i?2 2p2Mi Q#D2+iǶb type T`QT2`iv iQ /2i2`KBM2 r?2i?2` i?2 F2v
bii2 b?QmH/ #2 mT/i2/ iQ i`m2 U"keydown"V Q` 7Hb2 U"keyup"VX

_mMMBM; i?2 ;K2


h?2 requestAnimationFrame 7mM+iBQM- r?B+? r2 br BM *?Ti2` Rj- T`QpB/2b
 ;QQ/ rv iQ MBKi2  ;K2X "mi Bib BMi2`7+2 Bb [mBi2 T`BKBiBp2ěmbBM;
Bi `2[mB`2b mb iQ i`+F i?2 iBK2 i r?B+? Qm` 7mM+iBQM rb +HH2/ i?2 Hbi
iBK2 `QmM/ M/ +HH requestAnimationFrame ;BM 7i2` 2p2`v 7`K2X
G2iǶb /2}M2  ?2HT2` 7mM+iBQM i?i r`Tb i?Qb2 #Q`BM; T`ib BM  +QMp2@
MB2Mi BMi2`7+2 M/ HHQrb mb iQ bBKTHv +HH runAnimation- ;BpBM; Bi  7mM+@
iBQM i?i 2tT2+ib  iBK2 /Bz2`2M+2 b M `;mK2Mi M/ /`rb  bBM;H2
7`K2X q?2M i?2 7`K2 7mM+iBQM `2im`Mb i?2 pHm2 false- i?2 MBKiBQM
biQTbX
function runAnimation ( frameFunc ) {
var lastTime = null ;
function frame ( time ) {
var stop = false ;
if ( lastTime != null ) {
var timeStep = Math . min ( time - lastTime , 100) / 1000;
stop = frameFunc ( timeStep ) === false ;
}
lastTime = time ;
if (! stop )
requestAnimationFrame ( frame ) ;
}
requestAnimationFrame ( frame );
}

A ?p2 b2i  KtBKmK 7`K2 bi2T Q7 Ryy KBHHBb2+QM/b UQM2@i2Mi? Q7 


b2+QM/VX q?2M i?2 #`Qrb2` i# Q` rBM/Qr rBi? Qm` T;2 Bb ?B//2M-
requestAnimationFrame +HHb rBHH #2 bmbT2M/2/ mMiBH i?2 i# Q` rBM/Qr Bb

kNj
b?QrM ;BMX AM i?Bb +b2- i?2 /Bz2`2M+2 #2ir22M lastTime M/ time rBHH
#2 i?2 2MiB`2 iBK2 BM r?B+? i?2 T;2 rb ?B//2MX /pM+BM; i?2 ;K2
#v i?i Km+? BM  bBM;H2 bi2T rBHH HQQF bBHHv M/ KB;?i #2  HQi Q7 rQ`F
U`2K2K#2` i?2 iBK2@bTHBiiBM; BM i?2 animate K2i?Q/VX
h?2 7mM+iBQM HbQ +QMp2`ib i?2 iBK2 bi2Tb iQ b2+QM/b- r?B+? `2 M
2bB2` [mMiBiv iQ i?BMF #Qmi i?M KBHHBb2+QM/bX
h?2 runLevel 7mM+iBQM iF2b  Level Q#D2+i-  +QMbi`m+iQ` 7Q`  /BbTHv-
M/- QTiBQMHHv-  7mM+iBQMX Ai /BbTHvb i?2 H2p2H UBM document.bodyV M/
H2ib i?2 mb2` THv i?`Qm;? BiX q?2M i?2 H2p2H Bb }MBb?2/ UHQbi Q` rQMV-
runLevel +H2`b i?2 /BbTHv- biQTb i?2 MBKiBQM- M/- B7 M andThen 7mM+iBQM
rb ;Bp2M- +HHb i?i 7mM+iBQM rBi? i?2 H2p2HǶb biimbX
var arrows = trackKeys ( arrowCodes ) ;

function runLevel ( level , Display , andThen ) {


var display = new Display ( document . body , level ) ;
runAnimation ( function ( step ) {
level . animate ( step , arrows ) ;
display . drawFrame ( step );
if ( level . isFinished () ) {
display . clear () ;
if ( andThen )
andThen ( level . status );
return false ;
}
}) ;
}

 ;K2 Bb  b2[m2M+2 Q7 H2p2HbX q?2M2p2` i?2 THv2` /B2b- i?2 +m``2Mi


H2p2H Bb `2bi`i2/X q?2M  H2p2H Bb +QKTH2i2/- r2 KQp2 QM iQ i?2 M2ti
H2p2HX h?Bb +M #2 2tT`2bb2/ #v i?2 7QHHQrBM; 7mM+iBQM- r?B+? iF2b M
``v Q7 H2p2H THMb U``vb Q7 bi`BM;bV M/  /BbTHv +QMbi`m+iQ`,
function runGame ( plans , Display ) {
function startLevel ( n ) {
runLevel ( new Level ( plans [n ]) , Display , function ( status ) {
if ( status == " lost ")
startLevel ( n ) ;
else if ( n < plans . length - 1)
startLevel ( n + 1) ;
else

kN9
console . log (" You win !") ;
}) ;
}
startLevel (0) ;
}

h?2b2 7mM+iBQMb b?Qr  T2+mHB` bivH2 Q7 T`Q;`KKBM;X "Qi? runAnimation


M/ runLevel `2 ?B;?2`@Q`/2` 7mM+iBQMb #mi `2 MQi BM i?2 bivH2 r2 br BM
*?Ti2` 8X h?2 7mM+iBQM `;mK2Mi Bb mb2/ iQ ``M;2 i?BM;b iQ ?TT2M
i bQK2 iBK2 BM i?2 7mim`2- M/ M2Bi?2` Q7 i?2 7mM+iBQMb `2im`Mb Mvi?BM;
mb27mHX h?2B` ibF Bb- BM  rv- iQ b+?2/mH2 +iBQMbX q`TTBM; i?2b2
+iBQMb BM 7mM+iBQMb ;Bp2b mb  rv iQ biQ`2 i?2K b  pHm2 bQ i?i i?2v
+M #2 +HH2/ i i?2 `B;?i KQK2MiX
h?Bb T`Q;`KKBM; bivH2 Bb mbmHHv +HH2/ bvM+?`QMQmb T`Q;`KKBM;X
1p2Mi ?M/HBM; Bb HbQ M BMbiM+2 Q7 i?Bb bivH2- M/ r2 rBHH b22 Km+?
KQ`2 Q7 Bi r?2M rQ`FBM; rBi? ibFb i?i +M iF2 M `#Bi``v KQmMi
Q7 iBK2- bm+? b M2irQ`F `2[m2bib BM *?Ti2` Rd M/ BMTmi M/ QmiTmi
BM ;2M2`H BM *?Ti2` kyX
h?2`2 Bb  b2i Q7 H2p2H THMb pBH#H2 BM i?2 GAME_LEVELS p`B#H2 U/QrM@
HQ/#H2 7`QK 2HQ[m2MiDpb+`BTiXM2if+Q/2OR8VX h?Bb T;2 722/b i?2K iQ
runGame- bi`iBM; M +imH ;K2,

< link rel =" stylesheet " href =" css / game . css ">

< body >


< script >
runGame ( GAME_LEVELS , DOMDisplay ) ;
</ script >
</ body >

1t2`+Bb2b
:K2 Qp2`
AiǶb i`/BiBQMH 7Q` THi7Q`K ;K2b iQ ?p2 i?2 THv2` bi`i rBi?  HBKBi2/
MmK#2` Q7 HBp2b M/ bm#i`+i QM2 HB72 2+? iBK2 i?2v /B2X q?2M i?2 THv2`
Bb Qmi Q7 HBp2b- i?2 ;K2 `2bi`ib 7`QK i?2 #2;BMMBM;X
/Dmbi runGame iQ BKTH2K2Mi HBp2bX >p2 i?2 THv2` bi`i rBi? i?`22X

kN8
SmbBM; i?2 ;K2
JF2 Bi TQbbB#H2 iQ Tmb2 UbmbT2M/V M/ mMTmb2 i?2 ;K2 #v T`2bbBM;
i?2 1b+ F2vX
h?Bb +M #2 /QM2 #v +?M;BM; i?2 runLevel 7mM+iBQM iQ mb2 MQi?2` F2v@
#Q`/ 2p2Mi ?M/H2` M/ BMi2``mTiBM; Q` `2bmKBM; i?2 MBKiBQM r?2M@
2p2` i?2 1b+ F2v Bb ?BiX
h?2 runAnimation BMi2`7+2 Kv MQi HQQF HBF2 Bi Bb bmBi#H2 7Q` i?Bb i
}`bi ;HM+2- #mi Bi Bb- B7 vQm `2``M;2 i?2 rv runLevel +HHb BiX
q?2M vQm ?p2 i?i rQ`FBM;- i?2`2 Bb bQK2i?BM; 2Hb2 vQm +QmH/ i`vX
h?2 rv r2 ?p2 #22M `2;Bbi2`BM; F2v#Q`/ 2p2Mi ?M/H2`b Bb bQK2r?i
T`Q#H2KiB+X h?2 arrows Q#D2+i Bb +m``2MiHv  ;HQ#H p`B#H2- M/ Bib
2p2Mi ?M/H2`b `2 F2Ti `QmM/ 2p2M r?2M MQ ;K2 Bb `mMMBM;X uQm
+QmH/ bv i?2v H2F Qmi Q7 Qm` bvbi2KX 1ti2M/ trackKeys iQ T`QpB/2 
rv iQ mM`2;Bbi2` Bib ?M/H2`b- M/ i?2M +?M;2 runLevel iQ `2;Bbi2` Bib
?M/H2`b r?2M Bi bi`ib M/ mM`2;Bbi2` i?2K ;BM r?2M Bi Bb }MBb?2/X

kNe
dz.`rBM; Bb /2+2TiBQMXǴ
ěJX*X 1b+?2`- +Bi2/ #v "`mMQ 1`Mbi BM h?2 J;B+ JB``Q` Q7
JX*X 1b+?2`

Re .`rBM; QM *Mpb
"`Qrb2`b ;Bp2 mb b2p2`H rvb iQ /BbTHv ;`T?B+bX h?2 bBKTH2bi rv Bb
iQ mb2 bivH2b iQ TQbBiBQM M/ +QHQ` `2;mH` .PJ 2H2K2MibX h?Bb +M ;2i
vQm [mBi2 7`- b i?2 ;K2 BM i?2 T`2pBQmb +?Ti2` b?Qr2/X "v //BM;
T`iBHHv i`MbT`2Mi #+F;`QmM/ BK;2b iQ i?2 MQ/2b- r2 +M KF2 i?2K
HQQF 2t+iHv i?2 rv r2 rMiX Ai Bb 2p2M TQbbB#H2 iQ `Qii2 Q` bF2r MQ/2b
#v mbBM; i?2 transform bivH2X
"mi r2Ƕ/ #2 mbBM; i?2 .PJ 7Q` bQK2i?BM; i?i Bi rbMǶi Q`B;BMHHv
/2bB;M2/ 7Q`X aQK2 ibFb- bm+? b /`rBM;  HBM2 #2ir22M `#Bi``v
TQBMib- `2 2ti`2K2Hv rFr`/ iQ /Q rBi? `2;mH` >hJG 2H2K2MibX
h?2`2 `2 irQ Hi2`MiBp2bX h?2 }`bi Bb .PJ@#b2/ #mi miBHBx2b a+H@
#H2 o2+iQ` :`T?B+b Uao:V- `i?2` i?M >hJG 2H2K2MibX h?BMF Q7
ao: b  /BH2+i 7Q` /2b+`B#BM; /Q+mK2Mib i?i 7Q+mb2b QM b?T2b `i?2`
i?M i2tiX uQm +M 2K#2/ M ao: /Q+mK2Mi BM M >hJG /Q+mK2Mi-
Q` vQm +M BM+Hm/2 Bi i?`Qm;? M <img> i;X
h?2 b2+QM/ Hi2`MiBp2 Bb +HH2/  +MpbX  +Mpb Bb  bBM;H2 .PJ
2H2K2Mi i?i 2M+TbmHi2b  TB+im`2X Ai T`QpB/2b  T`Q;`KKBM; BMi2`7+2
7Q` /`rBM; b?T2b QMiQ i?2 bT+2 iF2M mT #v i?2 MQ/2X h?2 KBM
/Bz2`2M+2 #2ir22M  +Mpb M/ M ao: TB+im`2 Bb i?i BM ao: i?2
Q`B;BMH /2b+`BTiBQM Q7 i?2 b?T2b Bb T`2b2`p2/ bQ i?i i?2v +M #2 KQp2/
Q` `2bBx2/ i Mv iBK2X  +Mpb- QM i?2 Qi?2` ?M/- +QMp2`ib i?2 b?T2b
iQ TBt2Hb U+QHQ`2/ /Qib QM  `bi2`V b bQQM b i?2v `2 /`rM M/ /Q2b
MQi `2K2K#2` r?i i?2b2 TBt2Hb `2T`2b2MiX h?2 QMHv rv iQ KQp2  b?T2
QM  +Mpb Bb iQ +H2` i?2 +Mpb UQ` i?2 T`i Q7 i?2 +Mpb `QmM/ i?2
b?T2V M/ `2/`r Bi rBi? i?2 b?T2 BM  M2r TQbBiBQMX

ao:
h?Bb #QQF rBHH MQi ;Q BMiQ ao: BM /2iBH- #mi A rBHH #`B2~v 2tTHBM ?Qr Bi
rQ`FbX i i?2 2M/ Q7 i?2 +?Ti2`- AǶHH +QK2 #+F iQ i?2 i`/2@Qzb i?i vQm

kNd
Kmbi +QMbB/2` r?2M /2+B/BM; r?B+? /`rBM; K2+?MBbK Bb TT`QT`Bi2
7Q`  ;Bp2M TTHB+iBQMX
h?Bb Bb M >hJG /Q+mK2Mi rBi?  bBKTH2 ao: TB+im`2 BM Bi,
<p > Normal HTML here . </p >
< svg xmlns =" http :// www . w3 . org /2000/ svg ">
< circle r ="50" cx ="50" cy ="50" fill =" red "/ >
< rect x ="120" y ="5" width ="90" height ="90"
stroke =" blue " fill =" none "/ >
</ svg >

h?2 xmlns ii`B#mi2 +?M;2b M 2H2K2Mi UM/ Bib +?BH/`2MV iQ  /Bz2`2Mi


sJG MK2bT+2X h?Bb MK2bT+2- B/2MiB}2/ #v  l_G- bT2+B}2b i?2
/BH2+i i?i r2 `2 +m``2MiHv bT2FBM;X h?2 <circle> M/ <rect> i;b-
r?B+? /Q MQi 2tBbi BM >hJG- /Q ?p2  K2MBM; BM ao:ěi?2v /`r
b?T2b mbBM; i?2 bivH2 M/ TQbBiBQM bT2+B}2/ #v i?2B` ii`B#mi2bX
h?2 /Q+mK2Mi Bb /BbTHv2/ HBF2 i?Bb,

h?2b2 i;b +`2i2 .PJ 2H2K2Mib- Dmbi HBF2 >hJG i;bX 6Q` 2tKTH2-
i?Bb +?M;2b i?2 <circle> 2H2K2Mi iQ #2 +QHQ`2/ +vM BMbi2/,
var circle = document . querySelector (" circle ") ;
circle . setAttribute (" fill ", " cyan ") ;

h?2 +Mpb 2H2K2Mi


*Mpb ;`T?B+b +M #2 /`rM QMiQ  <canvas> 2H2K2MiX uQm +M ;Bp2 bm+?
M 2H2K2Mi width M/ height ii`B#mi2b iQ /2i2`KBM2 Bib bBx2 BM TBt2HbX
 M2r +Mpb Bb 2KTiv- K2MBM; Bi Bb 2MiB`2Hv i`MbT`2Mi M/ i?mb
b?Qrb mT bBKTHv b 2KTiv bT+2 BM i?2 /Q+mK2MiX

kN3
h?2 <canvas> i; Bb BMi2M/2/ iQ bmTTQ`i /Bz2`2Mi bivH2b Q7 /`rBM;X
hQ ;2i ++2bb iQ M +imH /`rBM; BMi2`7+2- r2 }`bi M22/ iQ +`2i2 
+QMi2ti- r?B+? Bb M Q#D2+i r?Qb2 K2i?Q/b T`QpB/2 i?2 /`rBM; BMi2`7+2X
h?2`2 `2 +m``2MiHv irQ rB/2Hv bmTTQ`i2/ /`rBM; bivH2b, "2d" 7Q` irQ@
/BK2MbBQMH ;`T?B+b M/ "webgl" 7Q` i?`22@/BK2MbBQMH ;`T?B+b i?`Qm;?
i?2 PT2M:G BMi2`7+2X
h?Bb #QQF rQMǶi /Bb+mbb q2#:GX q2 biB+F iQ irQ /BK2MbBQMbX "mi B7
vQm `2 BMi2`2bi2/ BM i?`22@/BK2MbBQMH ;`T?B+b- A /Q 2M+Qm`;2 vQm iQ
HQQF BMiQ q2#:GX Ai T`QpB/2b  p2`v /B`2+i BMi2`7+2 iQ KQ/2`M ;`T?B+b
?`/r`2 M/ i?mb HHQrb vQm iQ `2M/2` 2p2M +QKTHB+i2/ b+2M2b 2{@
+B2MiHv- mbBM; Cpa+`BTiX
 +QMi2ti Bb +`2i2/ i?`Qm;? i?2 getContext K2i?Q/ QM i?2 <canvas>
2H2K2MiX
<p > Before canvas . </p >
< canvas width ="120" height ="60" > </ canvas >
<p > After canvas . </p >
< script >
var canvas = document . querySelector (" canvas ") ;
var context = canvas . getContext ("2 d ") ;
context . fillStyle = " red ";
context . fillRect (10 , 10 , 100 , 50) ;
</ script >

7i2` +`2iBM; i?2 +QMi2ti Q#D2+i- i?2 2tKTH2 /`rb  `2/ `2+iM;H2 Ryy
TBt2Hb rB/2 M/ 8y TBt2Hb ?B;?- rBi? Bib iQT@H27i +Q`M2` i +QQ`/BMi2b
URy-RyVX

Cmbi HBF2 BM >hJG UM/ ao:V- i?2 +QQ`/BMi2 bvbi2K i?i i?2 +Mpb
mb2b Tmib Uy-yV i i?2 iQT@H27i +Q`M2`- M/ i?2 TQbBiBp2 v@tBb ;Q2b /QrM
7`QK i?2`2X aQ URy-RyV Bb Ry TBt2Hb #2HQr M/ iQ i?2 `B;?i Q7 i?2 iQT@H27i

kNN
+Q`M2`X

6BHHBM; M/ bi`QFBM;


AM i?2 +Mpb BMi2`7+2-  b?T2 +M #2 }HH2/- K2MBM; Bib `2 Bb ;Bp2M
 +2`iBM +QHQ` Q` Tii2`M- Q` Bi +M #2 bi`QF2/- r?B+? K2Mb  HBM2 Bb
/`rM HQM; Bib 2/;2X h?2 bK2 i2`KBMQHQ;v Bb mb2/ #v ao:X
h?2 fillRect K2i?Q/ }HHb  `2+iM;H2X Ai iF2b }`bi i?2 t@ M/ v@
+QQ`/BMi2b Q7 i?2 `2+iM;H2Ƕb iQT@H27i +Q`M2`- i?2M Bib rB/i?- M/ i?2M
Bib ?2B;?iX  bBKBH` K2i?Q/- strokeRect- /`rb i?2 QmiHBM2 Q7  `2+iM;H2X
L2Bi?2` K2i?Q/ iF2b Mv 7m`i?2` T`K2i2`bX h?2 +QHQ` Q7 i?2 }HH-
i?B+FM2bb Q7 i?2 bi`QF2- M/ bQ QM `2 MQi /2i2`KBM2/ #v M `;mK2Mi iQ
i?2 K2i?Q/ Ub vQm KB;?i DmbiHv 2tT2+iV #mi `i?2` #v T`QT2`iB2b Q7 i?2
+QMi2ti Q#D2+iX
a2iiBM; fillStyle +?M;2b i?2 rv b?T2b `2 }HH2/X Ai +M #2 b2i iQ 
bi`BM; i?i bT2+B}2b  +QHQ`- M/ Mv +QHQ` mM/2`biQQ/ #v *aa +M HbQ
#2 mb2/ ?2`2X
h?2 strokeStyle T`QT2`iv rQ`Fb bBKBH`Hv #mi /2i2`KBM2b i?2 +QHQ` mb2/
7Q`  bi`QF2/ HBM2X h?2 rB/i? Q7 i?i HBM2 Bb /2i2`KBM2/ #v i?2 lineWidth
T`QT2`iv- r?B+? Kv +QMiBM Mv TQbBiBp2 MmK#2`X
< canvas > </ canvas >
< script >
var cx = document . querySelector (" canvas ") . getContext ("2 d ") ;
cx . strokeStyle = " blue ";
cx . strokeRect (5 , 5 , 50 , 50) ;
cx . lineWidth = 5;
cx . strokeRect (135 , 5 , 50 , 50) ;
</ script >

h?Bb +Q/2 /`rb irQ #Hm2 b[m`2b- mbBM;  i?B+F2` HBM2 7Q` i?2 b2+QM/
QM2X

q?2M MQ width Q` height ii`B#mi2 Bb bT2+B}2/- b BM i?2 T`2pBQmb 2tKTH2-

jyy
 +Mpb 2H2K2Mi ;2ib  /27mHi rB/i? Q7 jyy TBt2Hb M/ ?2B;?i Q7 R8y
TBt2HbX

Si?b
 Ti? Bb  b2[m2M+2 Q7 HBM2bX h?2 k. +Mpb BMi2`7+2 iF2b  T2+mHB`
TT`Q+? iQ /2b+`B#BM; bm+?  Ti?X Ai Bb /QM2 2MiB`2Hv i?`Qm;? bB/2
2z2+ibX Si?b `2 MQi pHm2b i?i +M #2 biQ`2/ M/ Tbb2/ `QmM/X
AMbi2/- B7 vQm rMi iQ /Q bQK2i?BM; rBi?  Ti?- vQm KF2  b2[m2M+2
Q7 K2i?Q/ +HHb iQ /2b+`B#2 Bib b?T2X
< canvas > </ canvas >
< script >
var cx = document . querySelector (" canvas ") . getContext ("2 d ") ;
cx . beginPath () ;
for ( var y = 10; y < 100; y += 10) {
cx . moveTo (10 , y ) ;
cx . lineTo (90 , y ) ;
}
cx . stroke () ;
</ script >

h?Bb 2tKTH2 +`2i2b  Ti? rBi?  MmK#2` Q7 ?Q`BxQMiH HBM2 b2;K2Mib


M/ i?2M bi`QF2b Bi mbBM; i?2 stroke K2i?Q/X 1+? b2;K2Mi +`2i2/ rBi?
lineTo bi`ib i i?2 Ti?Ƕb +m``2Mi TQbBiBQMX h?i TQbBiBQM Bb mbmHHv i?2
2M/ Q7 i?2 Hbi b2;K2Mi- mMH2bb moveTo rb +HH2/X AM i?i +b2- i?2 M2ti
b2;K2Mi rQmH/ bi`i i i?2 TQbBiBQM Tbb2/ iQ moveToX
h?2 Ti? /2b+`B#2/ #v i?2 T`2pBQmb T`Q;`K HQQFb HBF2 i?Bb,

q?2M }HHBM;  Ti? UmbBM; i?2 fill K2i?Q/V- 2+? b?T2 Bb }HH2/ b2T@
`i2HvX  Ti? +M +QMiBM KmHiBTH2 b?T2bě2+? moveTo KQiBQM bi`ib 
M2r QM2X "mi i?2 Ti? M22/b iQ #2 +HQb2/ UK2MBM; Bib bi`i M/ 2M/ `2
BM i?2 bK2 TQbBiBQMV #27Q`2 Bi +M #2 }HH2/X A7 i?2 Ti? Bb MQi H`2/v

jyR
+HQb2/-  HBM2 Bb //2/ 7`QK Bib 2M/ iQ Bib bi`i- M/ i?2 b?T2 2M+HQb2/
#v i?2 +QKTH2i2/ Ti? Bb }HH2/X
< canvas > </ canvas >
< script >
var cx = document . querySelector (" canvas ") . getContext ("2 d ") ;
cx . beginPath () ;
cx . moveTo (50 , 10) ;
cx . lineTo (10 , 70) ;
cx . lineTo (90 , 70) ;
cx . fill () ;
</ script >

h?Bb 2tKTH2 /`rb  }HH2/ i`BM;H2X LQi2 i?i QMHv irQ Q7 i?2 i`BM;H2Ƕb
bB/2b `2 2tTHB+BiHv /`rMX h?2 i?B`/- 7`QK i?2 #QiiQK@`B;?i +Q`M2` #+F
iQ i?2 iQT- Bb BKTHB2/ M/ rQMǶi #2 i?2`2 r?2M vQm bi`QF2 i?2 Ti?X

uQm +QmH/ HbQ mb2 i?2 closePath K2i?Q/ iQ 2tTHB+BiHv +HQb2  Ti? #v
//BM; M +imH HBM2 b2;K2Mi #+F iQ i?2 Ti?Ƕb bi`iX h?Bb b2;K2Mi Bb
/`rM r?2M bi`QFBM; i?2 Ti?X

*m`p2b
 Ti? Kv HbQ +QMiBM +m`p2/ HBM2bX h?2b2 `2- mM7Q`imMi2Hv-  #Bi
KQ`2 BMpQHp2/ iQ /`r i?M bi`B;?i HBM2bX
h?2 quadraticCurveTo K2i?Q/ /`rb  +m`p2 iQ  ;Bp2M TQBMiX hQ /2@
i2`KBM2 i?2 +m`pim`2 Q7 i?2 HBM2- i?2 K2i?Q/ Bb ;Bp2M  +QMi`QH TQBMi
b r2HH b  /2biBMiBQM TQBMiX AK;BM2 i?Bb +QMi`QH TQBMi b ii`+iBM;
i?2 HBM2- ;BpBM; i?2 HBM2 Bib +m`p2X h?2 HBM2 rQMǶi ;Q i?`Qm;? i?2 +QMi`QH
TQBMiX _i?2`- i?2 /B`2+iBQM Q7 i?2 HBM2 i Bib bi`i M/ 2M/ TQBMib rBHH
#2 bm+? i?i Bi HB;Mb rBi? i?2 HBM2 7`QK i?2`2 iQ i?2 +QMi`QH TQBMiX h?2
7QHHQrBM; 2tKTH2 BHHmbi`i2b i?Bb,
< canvas > </ canvas >

jyk
< script >
var cx = document . querySelector (" canvas ") . getContext ("2 d ") ;
cx . beginPath () ;
cx . moveTo (10 , 90) ;
// control =(60 ,10) goal =(90 ,90)
cx . quadraticCurveTo (60 , 10 , 90 , 90) ;
cx . lineTo (60 , 10) ;
cx . closePath () ;
cx . stroke () ;
</ script >

Ai T`Q/m+2b  Ti? i?i HQQFb HBF2 i?Bb,

q2 /`r  [m/`iB+ +m`p2 7`QK i?2 H27i iQ i?2 `B;?i- rBi? Uey-RyV b +QM@
i`QH TQBMi- M/ i?2M /`r irQ HBM2 b2;K2Mib ;QBM; i?`Qm;? i?i +QMi`QH
TQBMi M/ #+F iQ i?2 bi`i Q7 i?2 HBM2X h?2 `2bmHi bQK2r?i `2b2K#H2b 
ai` h`2F BMbB;MBX uQm +M b22 i?2 2z2+i Q7 i?2 +QMi`QH TQBMi, i?2 HBM2b
H2pBM; i?2 HQr2` +Q`M2`b bi`i Qz BM i?2 /B`2+iBQM Q7 i?2 +QMi`QH TQBMi
M/ i?2M +m`p2 iQr`/ i?2B` i`;2iX
h?2 bezierCurveTo K2i?Q/ /`rb  bBKBH` FBM/ Q7 +m`p2X AMbi2/ Q7
 bBM;H2 +QMi`QH TQBMi- i?Bb QM2 ?b irQěQM2 7Q` 2+? Q7 i?2 HBM2Ƕb 2M/@
TQBMibX >2`2 Bb  bBKBH` bF2i+? iQ BHHmbi`i2 i?2 #2?pBQ` Q7 bm+?  +m`p2,
< canvas > </ canvas >
< script >
var cx = document . querySelector (" canvas ") . getContext ("2 d ") ;
cx . beginPath () ;
cx . moveTo (10 , 90) ;
// control1 =(10 ,10) control2 =(90 ,10) goal =(50 ,90)
cx . bezierCurveTo (10 , 10 , 90 , 10 , 50 , 90) ;
cx . lineTo (90 , 10) ;
cx . lineTo (10 , 10) ;
cx . closePath () ;
cx . stroke () ;
</ script >

jyj
h?2 irQ +QMi`QH TQBMib bT2+B7v i?2 /B`2+iBQM i #Qi? 2M/b Q7 i?2 +m`p2X
h?2 7m`i?2` i?2v `2 rv 7`QK i?2B` +Q``2bTQM/BM; TQBMi- i?2 KQ`2 i?2
+m`p2 rBHH dz#mH;2Ǵ BM i?i /B`2+iBQMX

am+? +m`p2b +M #2 ?`/ iQ rQ`F rBi?ěBiǶb MQi Hrvb +H2` ?Qr iQ }M/
i?2 +QMi`QH TQBMib i?i T`QpB/2 i?2 b?T2 vQm `2 HQQFBM; 7Q`X aQK2iBK2b
vQm +M +QKTmi2 i?2K- M/ bQK2iBK2b vQmǶHH Dmbi ?p2 iQ }M/  bmBi#H2
pHm2 #v i`BH M/ 2``Q`X
`+bě7`;K2Mib Q7  +B`+H2ě`2 2bB2` iQ `2bQM #QmiX h?2 arcTo
K2i?Q/ iF2b MQ H2bb i?M }p2 `;mK2MibX h?2 }`bi 7Qm` `;mK2Mib +i
bQK2r?i HBF2 i?2 `;mK2Mib iQ quadraticCurveToX h?2 }`bi TB` T`QpB/2b
 bQ`i Q7 +QMi`QH TQBMi- M/ i?2 b2+QM/ TB` ;Bp2b i?2 HBM2Ƕb /2biBMiBQMX
h?2 }7i? `;mK2Mi T`QpB/2b i?2 `/Bmb Q7 i?2 `+X h?2 K2i?Q/ rBHH
+QM+2TimHHv T`QD2+i  +Q`M2`ě HBM2 ;QBM; iQ i?2 +QMi`QH TQBMi M/ i?2M
iQ i?2 /2biBMiBQM TQBMiěM/ `QmM/ i?2 +Q`M2`Ƕb TQBMi bQ i?i Bi 7Q`Kb
T`i Q7  +B`+H2 rBi? i?2 ;Bp2M `/BmbX h?2 arcTo K2i?Q/ i?2M /`rb i?2
`QmM/2/ T`i- b r2HH b  HBM2 7`QK i?2 bi`iBM; TQbBiBQM iQ i?2 bi`i Q7
i?2 `QmM/2/ T`iX
< canvas > </ canvas >
< script >
var cx = document . querySelector (" canvas ") . getContext ("2 d ") ;
cx . beginPath () ;
cx . moveTo (10 , 10) ;
// control =(90 ,10) goal =(90 ,90) radius =20
cx . arcTo (90 , 10 , 90 , 90 , 20) ;
cx . moveTo (10 , 10) ;
// control =(90 ,10) goal =(90 ,90) radius =80
cx . arcTo (90 , 10 , 90 , 90 , 80) ;
cx . stroke () ;
</ script >

h?Bb T`Q/m+2b irQ `QmM/2/ +Q`M2`b rBi? /Bz2`2Mi `/BBX

jy9
h?2 arcTo K2i?Q/ rQMǶi /`r i?2 HBM2 7`QK i?2 2M/ Q7 i?2 `QmM/2/ T`i iQ
i?2 ;QH TQbBiBQM- i?Qm;? i?2 rQ`/ iQ BM Bib MK2 rQmH/ bm;;2bi Bi /Q2bX
uQm +M 7QHHQr mT rBi?  +HH iQ lineTo rBi? i?2 bK2 ;QH +QQ`/BMi2b
iQ // i?i T`i Q7 i?2 HBM2X
hQ /`r  +B`+H2- vQm +QmH/ mb2 7Qm` +HHb iQ arcTo U2+? im`MBM; Ny
/2;`22bVX "mi i?2 arc K2i?Q/ T`QpB/2b  bBKTH2` rvX Ai iF2b  TB`
Q7 +QQ`/BMi2b 7Q` i?2 `+Ƕb +2Mi2`-  `/Bmb- M/ i?2M  bi`i M/ 2M/
M;H2X
h?Qb2 Hbi irQ T`K2i2`b KF2 Bi TQbbB#H2 iQ /`r QMHv T`i Q7 +B`+H2X
h?2 M;H2b `2 K2bm`2/ BM `/BMb- MQi /2;`22bX h?Bb K2Mb  7mHH +B`+H2
?b M M;H2 Q7 kπ - Q` 2 * Math.PI- r?B+? Bb #Qmi eXk3X h?2 M;H2 bi`ib
+QmMiBM; i i?2 TQBMi iQ i?2 `B;?i Q7 i?2 +B`+H2Ƕb +2Mi2` M/ ;Q2b +HQ+FrBb2
7`QK i?2`2X uQm +M mb2  bi`i Q7 y M/ M 2M/ #B;;2` i?M kπ Ubv- dV
iQ /`r  7mHH +B`+H2X
< canvas > </ canvas >
< script >
var cx = document . querySelector (" canvas ") . getContext ("2 d ") ;
cx . beginPath () ;
// center =(50 ,50) radius =40 angle =0 to 7
cx . arc (50 , 50 , 40 , 0 , 7) ;
// center =(150 ,50) radius =40 angle =0 to π 12
cx . arc (150 , 50 , 40 , 0 , 0.5 * Math . PI ) ;
cx . stroke () ;
</ script >

h?2 `2bmHiBM; TB+im`2 +QMiBMb  HBM2 7`QK i?2 `B;?i Q7 i?2 7mHH +B`+H2
U}`bi +HH iQ arcV iQ i?2 `B;?i Q7 i?2 [m`i2`@+B`+H2 Ub2+QM/ +HHVX GBF2
Qi?2` Ti?@/`rBM; K2i?Q/b-  HBM2 /`rM rBi? arc Bb +QMM2+i2/ iQ i?2
T`2pBQmb Ti? b2;K2Mi #v /27mHiX uQmǶ/ ?p2 iQ +HH moveTo Q` bi`i 
M2r Ti? B7 vQm rMi iQ pQB/ i?BbX

jy8
.`rBM;  TB2 +?`i
AK;BM2 vQmǶp2 Dmbi iF2M  DQ# i 1+QMQKB*Q`T- AM+X- M/ vQm` }`bi
bbB;MK2Mi Bb iQ /`r  TB2 +?`i Q7 i?2B` +mbiQK2` biBb7+iBQM bm`p2v
`2bmHibX
h?2 results p`B#H2 +QMiBMb M ``v Q7 Q#D2+ib i?i `2T`2b2Mi i?2
bm`p2v `2bTQMb2bX
var results = [
{ name : " Satisfied " , count : 1043 , color : " lightblue "} ,
{ name : " Neutral " , count : 563 , color : " lightgreen "} ,
{ name : " Unsatisfied " , count : 510 , color : " pink "} ,
{ name : " No comment " , count : 175 , color : " silver "}
];

hQ /`r  TB2 +?`i- r2 /`r  MmK#2` Q7 TB2 bHB+2b- 2+? K/2 mT Q7


M `+ M/  TB` Q7 HBM2b iQ i?2 +2Mi2` Q7 i?i `+X q2 +M +QKTmi2
i?2 M;H2 iF2M mT #v 2+? `+ #v /BpB/BM;  7mHH +B`+H2 Ukπ V #v i?2 iQiH
MmK#2` Q7 `2bTQMb2b M/ i?2M KmHiBTHvBM; i?i MmK#2` Ui?2 M;H2 T2`
`2bTQMb2V #v i?2 MmK#2` Q7 T2QTH2 r?Q TB+F2/  ;Bp2M +?QB+2X
< canvas width ="200" height ="200" > </ canvas >
< script >
var cx = document . querySelector (" canvas ") . getContext ("2 d ") ;
var total = results . reduce ( function ( sum , choice ) {
return sum + choice . count ;
} , 0) ;
// Start at the top
var currentAngle = -0.5 * Math . PI ;
results . forEach ( function ( result ) {
var sliceAngle = ( result . count / total ) * 2 * Math . PI ;
cx . beginPath () ;

jye
// center =100 ,100 , radius =100
// from current angle , clockwise by slice s angle
cx . arc (100 , 100 , 100 ,
currentAngle , currentAngle + sliceAngle ) ;
currentAngle += sliceAngle ;
cx . lineTo (100 , 100) ;
cx . fillStyle = result . color ;
cx . fill () ;
}) ;
</ script >

h?Bb /`rb i?2 7QHHQrBM; +?`i,

"mi  +?`i i?i /Q2bMǶi i2HH mb r?i Bi K2Mb BbMǶi p2`v ?2HT7mHX q2
M22/  rv iQ /`r i2ti iQ i?2 +MpbX

h2ti
 k. +Mpb /`rBM; +QMi2ti T`QpB/2b i?2 K2i?Q/b fillText M/ strokeText
X h?2 Hii2` +M #2 mb27mH 7Q` QmiHBMBM; H2ii2`b- #mi mbmHHv fillText Bb
r?i vQm M22/X Ai rBHH }HH i?2 ;Bp2M i2ti rBi? i?2 +m``2Mi fillColorX
< canvas > </ canvas >
< script >
var cx = document . querySelector (" canvas ") . getContext ("2 d ") ;
cx . font = "28 px Georgia ";
cx . fillStyle = " fuchsia ";

jyd
cx . fillText (" I can draw text , too !" , 10 , 50) ;
</ script >

uQm +M bT2+B7v i?2 bBx2- bivH2- M/ 7QMi Q7 i?2 i2ti rBi? i?2 font T`QT2`ivX
h?Bb 2tKTH2 Dmbi ;Bp2b  7QMi bBx2 M/ 7KBHv MK2X uQm +M // italic
Q` bold iQ i?2 bi`i Q7 i?2 bi`BM; iQ b2H2+i  bivH2X
h?2 Hbi irQ `;mK2Mib iQ fillText UM/ strokeTextV T`QpB/2 i?2 TQbBiBQM
i r?B+? i?2 7QMi Bb /`rMX "v /27mHi- i?2v BM/B+i2 i?2 TQbBiBQM Q7
i?2 bi`i Q7 i?2 i2tiǶb HT?#2iB+ #b2HBM2- r?B+? Bb i?2 HBM2 i?i H2ii2`b
dzbiM/Ǵ QM- MQi +QmMiBM; ?M;BM; T`ib BM H2ii2`b HBF2 D Q` TX uQm +M
+?M;2 i?2 ?Q`BxQMiH TQbBiBQM #v b2iiBM; i?2 textAlign T`QT2`iv iQ "end
" Q` "center" M/ i?2 p2`iB+H TQbBiBQM #v b2iiBM; textBaseline iQ "top"-
"middle"- Q` "bottom"X
q2 rBHH +QK2 #+F iQ Qm` TB2 +?`i- M/ i?2 T`Q#H2K Q7 H#2HBM; i?2
bHB+2b- BM i?2 2t2`+Bb2b i i?2 2M/ Q7 i?2 +?Ti2`X

AK;2b
AM +QKTmi2` ;`T?B+b-  /BbiBM+iBQM Bb Q7i2M K/2 #2ir22M p2+iQ` ;`T?B+b
M/ #BiKT ;`T?B+bX h?2 }`bi Bb r?i r2 ?p2 #22M /QBM; bQ 7` BM i?Bb
+?Ti2`ěbT2+B7vBM;  TB+im`2 #v ;BpBM;  HQ;B+H /2b+`BTiBQM Q7 b?T2bX
"BiKT ;`T?B+b- QM i?2 Qi?2` ?M/- /QMǶi bT2+B7v +imH b?T2b #mi
`i?2` rQ`F rBi? TBt2H /i U`bi2`b Q7 +QHQ`2/ /QibVX
h?2 drawImage K2i?Q/ HHQrb mb iQ /`r TBt2H /i QMiQ  +MpbX h?Bb
TBt2H /i +M Q`B;BMi2 7`QK M <img> 2H2K2Mi Q` 7`QK MQi?2` +Mpb-
M/ M2Bi?2` ?b iQ #2 pBbB#H2 BM i?2 +imH /Q+mK2MiX h?2 7QHHQrBM;
2tKTH2 +`2i2b  /2i+?2/ <img> 2H2K2Mi M/ HQ/b M BK;2 }H2 BMiQ
BiX "mi Bi +MMQi BKK2/Bi2Hv bi`i /`rBM; 7`QK i?Bb TB+im`2 #2+mb2
i?2 #`Qrb2` Kv MQi ?p2 72i+?2/ Bi v2iX hQ /2H rBi? i?Bb- r2 `2;Bbi2`
 "load" 2p2Mi ?M/H2` M/ /Q i?2 /`rBM; 7i2` i?2 BK;2 ?b HQ/2/X
< canvas > </ canvas >
< script >
var cx = document . querySelector (" canvas ") . getContext ("2 d ") ;
var img = document . createElement (" img ") ;
img . src = " img / hat . png ";
img . addEventListener (" load ", function () {
for ( var x = 10; x < 200; x += 30)

jy3
cx . drawImage ( img , x , 10) ;
}) ;
</ script >

"v /27mHi- drawImage rBHH /`r i?2 BK;2 i Bib Q`B;BMH bBx2X uQm +M
HbQ ;Bp2 Bi irQ //BiBQMH `;mK2Mib iQ /B+ii2  /Bz2`2Mi rB/i? M/
?2B;?iX
q?2M drawImage Bb ;Bp2M MBM2 `;mK2Mib- Bi +M #2 mb2/ iQ /`r QMHv
 7`;K2Mi Q7 M BK;2X h?2 b2+QM/ i?`Qm;? }7i? `;mK2Mib BM/B+i2
i?2 `2+iM;H2 Ut- v- rB/i?- M/ ?2B;?iV BM i?2 bQm`+2 BK;2 i?i b?QmH/
#2 +QTB2/- M/ i?2 bBti? iQ MBMi? `;mK2Mib ;Bp2 i?2 `2+iM;H2 UQM i?2
+MpbV BMiQ r?B+? Bi b?QmH/ #2 +QTB2/X
h?Bb +M #2 mb2/ iQ T+F KmHiBTH2 bT`Bi2b UBK;2 2H2K2MibV BMiQ  bBM;H2
BK;2 }H2 M/ i?2M /`r QMHv i?2 T`i vQm M22/X 6Q` 2tKTH2- r2 ?p2
i?Bb TB+im`2 +QMiBMBM;  ;K2 +?`+i2` BM KmHiBTH2 TQb2b,

"v Hi2`MiBM; r?B+? TQb2 r2 /`r- r2 +M b?Qr M MBKiBQM i?i HQQFb
HBF2  rHFBM; +?`+i2`X
hQ MBKi2 i?2 TB+im`2 QM  +Mpb- i?2 clearRect K2i?Q/ Bb mb27mHX
Ai `2b2K#H2b fillRect- #mi BMbi2/ Q7 +QHQ`BM; i?2 `2+iM;H2- Bi KF2b Bi
i`MbT`2Mi- `2KQpBM; i?2 T`2pBQmbHv /`rM TBt2HbX
q2 FMQr i?i 2+? bT`Bi2- 2+? bm#TB+im`2- Bb k9 TBt2Hb rB/2 M/ jy
TBt2Hb ?B;?X h?2 7QHHQrBM; +Q/2 HQ/b i?2 BK;2 M/ i?2M b2ib mT M
BMi2`pH U`2T2i2/ iBK2`V iQ /`r i?2 M2ti 7`K2,
< canvas > </ canvas >
< script >
var cx = document . querySelector (" canvas ") . getContext ("2 d ") ;
var img = document . createElement (" img ") ;
img . src = " img / player . png ";
var spriteW = 24 , spriteH = 30;
img . addEventListener (" load ", function () {
var cycle = 0;
setInterval ( function () {
cx . clearRect (0 , 0 , spriteW , spriteH ) ;
cx . drawImage ( img ,
// source rectangle

jyN
cycle * spriteW , 0, spriteW , spriteH ,
// destination rectangle
0, 0 , spriteW , spriteH ) ;
cycle = ( cycle + 1) % 8;
}, 120) ;
}) ;
</ script >

h?2 cycle p`B#H2 i`+Fb Qm` TQbBiBQM BM i?2 MBKiBQMX 1+? 7`K2-
Bi Bb BM+`2K2Mi2/ M/ i?2M +HBTT2/ #+F iQ i?2 y iQ d `M;2 #v mbBM;
i?2 `2KBM/2` QT2`iQ`X h?Bb p`B#H2 Bb i?2M mb2/ iQ +QKTmi2 i?2 t@
+QQ`/BMi2 i?i i?2 bT`Bi2 7Q` i?2 +m``2Mi TQb2 ?b BM i?2 TB+im`2X

h`Mb7Q`KiBQM
"mi r?i B7 r2 rMi Qm` +?`+i2` iQ rHF iQ i?2 H27i BMbi2/ Q7 iQ i?2
`B;?i\ q2 +QmH/ // MQi?2` b2i Q7 bT`Bi2b- Q7 +Qm`b2X "mi r2 +M HbQ
BMbi`m+i i?2 +Mpb iQ /`r i?2 TB+im`2 i?2 Qi?2` rv `QmM/X
*HHBM; i?2 scale K2i?Q/ rBHH +mb2 Mvi?BM; /`rM 7i2` Bi iQ #2 b+H2/X
h?Bb K2i?Q/ iF2b irQ T`K2i2`b- QM2 iQ b2i  ?Q`BxQMiH b+H2 M/ QM2
iQ b2i  p2`iB+H b+H2X
< canvas > </ canvas >
< script >
var cx = document . querySelector (" canvas ") . getContext ("2 d ") ;
cx . scale (3 , .5) ;
cx . beginPath () ;
cx . arc (50 , 50 , 40 , 0 , 7) ;
cx . lineWidth = 3;
cx . stroke () ;
</ script >

.m2 iQ i?2 +HH iQ scale- i?2 +B`+H2 Bb /`rM i?`22 iBK2b b rB/2 M/ ?H7
b ?B;?X

a+HBM; rBHH +mb2 2p2`vi?BM; #Qmi i?2 /`rM BK;2- BM+Hm/BM; i?2 HBM2

jRy
rB/i?- iQ #2 bi`2i+?2/ Qmi Q` b[m22x2/ iQ;2i?2` b bT2+B}2/X a+HBM; #v
 M2;iBp2 KQmMi rBHH ~BT i?2 TB+im`2 `QmM/X h?2 ~BTTBM; ?TT2Mb
`QmM/ TQBMi Uy-yV- r?B+? K2Mb Bi rBHH HbQ ~BT i?2 /B`2+iBQM Q7 i?2
+QQ`/BMi2 bvbi2KX q?2M  ?Q`BxQMiH b+HBM; Q7 @R Bb TTHB2/-  b?T2
/`rM i t TQbBiBQM Ryy rBHH 2M/ mT i r?i mb2/ iQ #2 TQbBiBQM @RyyX
aQ iQ im`M  TB+im`2 `QmM/- r2 +MǶi bBKTHv // cx.scale(-1, 1) #27Q`2
i?2 +HH iQ drawImage bBM+2 i?i rQmH/ KQp2 Qm` TB+im`2 QmibB/2 Q7 i?2
+Mpb- r?2`2 Bi rQMǶi #2 pBbB#H2X uQm +QmH/ /Dmbi i?2 +QQ`/BMi2b ;Bp2M
iQ drawImage iQ +QKT2Mbi2 7Q` i?Bb #v /`rBM; i?2 BK;2 i t TQbBiBQM
@8y BMbi2/ Q7 yX MQi?2` bQHmiBQM- r?B+? /Q2bMǶi `2[mB`2 i?2 +Q/2 i?i
/Q2b i?2 /`rBM; iQ FMQr #Qmi i?2 b+H2 +?M;2- Bb iQ /Dmbi i?2 tBb
`QmM/ r?B+? i?2 b+HBM; ?TT2MbX
h?2`2 `2 b2p2`H Qi?2` K2i?Q/b #2bB/2b scale i?i BM~m2M+2 i?2 +QQ`@
/BMi2 bvbi2K 7Q`  +MpbX uQm +M `Qii2 bm#b2[m2MiHv /`rM b?T2b
rBi? i?2 rotate K2i?Q/ M/ KQp2 i?2K rBi? i?2 translate K2i?Q/X h?2
BMi2`2biBM;ěM/ +QM7mbBM;ěi?BM; Bb i?i i?2b2 i`Mb7Q`KiBQMb bi+F-
K2MBM; i?i 2+? QM2 ?TT2Mb `2HiBp2 iQ i?2 T`2pBQmb i`Mb7Q`KiBQMbX
aQ B7 r2 i`MbHi2 #v Ry ?Q`BxQMiH TBt2Hb irB+2- 2p2`vi?BM; rBHH #2
/`rM ky TBt2Hb iQ i?2 `B;?iX A7 r2 }`bi KQp2 i?2 +2Mi2` Q7 i?2 +QQ`/BMi2
bvbi2K iQ U8y-8yV M/ i?2M `Qii2 #v ky /2;`22b UyXRπ BM `/BMbV- i?i
`QiiBQM rBHH ?TT2M `QmM/ TQBMi U8y-8yVX

rotate(0.1*Math.PI)

translate(50, 50)

translate(50, 50)
rotate(0.1*Math.PI)

"mi B7 r2 }`bi `Qii2 #v ky /2;`22b M/ i?2M i`MbHi2 #v U8y-8yV- i?2


i`MbHiBQM rBHH ?TT2M BM i?2 `Qii2/ +QQ`/BMi2 bvbi2K M/ i?mb T`Q@
/m+2  /Bz2`2Mi Q`B2MiiBQMX h?2 Q`/2` BM r?B+? i`Mb7Q`KiBQMb `2
TTHB2/ Kii2`bX
hQ ~BT  TB+im`2 `QmM/ i?2 p2`iB+H HBM2 i  ;Bp2M t TQbBiBQM- r2 +M
/Q i?2 7QHHQrBM;,

jRR
function flipHorizontally ( context , around ) {
context . translate ( around , 0) ;
context . scale ( -1 , 1) ;
context . translate ( - around , 0) ;
}

q2 KQp2 i?2 v@tBb iQ r?2`2 r2 rMi Qm` KB``Q` iQ #2- TTHv i?2 KB``Q`@
BM;- M/ }MHHv KQp2 i?2 v@tBb #+F iQ Bib T`QT2` TH+2 BM i?2 KB``Q`2/
mMBp2`b2X h?2 7QHHQrBM; TB+im`2 2tTHBMb r?v i?Bb rQ`Fb,
mirror

3 1 4 2

h?Bb b?Qrb i?2 +QQ`/BMi2 bvbi2Kb #27Q`2 M/ 7i2` KB``Q`BM; +`Qbb i?2
+2Mi`H HBM2X A7 r2 /`r  i`BM;H2 i  TQbBiBp2 t TQbBiBQM- Bi rQmH/- #v
/27mHi- #2 BM i?2 TH+2 r?2`2 i`BM;H2 R BbX  +HH iQ flipHorizontally }`bi
/Q2b  i`MbHiBQM iQ i?2 `B;?i- r?B+? ;2ib mb iQ i`BM;H2 kX Ai i?2M b+H2b-
~BTTBM; i?2 i`BM;H2 #+F iQ TQbBiBQM jX h?Bb Bb MQi r?2`2 Bi b?QmH/ #2- B7
Bi r2`2 KB``Q`2/ BM i?2 ;Bp2M HBM2X h?2 b2+QM/ translate +HH }t2b i?Bbě
Bi dz+M+2HbǴ i?2 BMBiBH i`MbHiBQM M/ KF2b i`BM;H2 9 TT2` 2t+iHv
r?2`2 Bi b?QmH/X
q2 +M MQr /`r  KB``Q`2/ +?`+i2` i TQbBiBQM URyy-yV #v ~BTTBM;
i?2 rQ`H/ `QmM/ i?2 +?`+i2`Ƕb p2`iB+H +2Mi2`X
< canvas > </ canvas >
< script >
var cx = document . querySelector (" canvas ") . getContext ("2 d ") ;
var img = document . createElement (" img ") ;
img . src = " img / player . png ";
var spriteW = 24 , spriteH = 30;
img . addEventListener (" load ", function () {
flipHorizontally ( cx , 100 + spriteW / 2) ;
cx . drawImage ( img , 0 , 0 , spriteW , spriteH ,

jRk
100 , 0 , spriteW , spriteH ) ;
}) ;
</ script >

aiQ`BM; M/ +H2`BM; i`Mb7Q`KiBQMb


h`Mb7Q`KiBQMb biB+F `QmM/X 1p2`vi?BM; 2Hb2 r2 /`r 7i2` /`rBM;
i?i KB``Q`2/ +?`+i2` rQmH/ HbQ #2 KB``Q`2/X h?i KB;?i #2  T`Q#@
H2KX
Ai Bb TQbbB#H2 iQ bp2 i?2 +m``2Mi i`Mb7Q`KiBQM- /Q bQK2 /`rBM; M/
i`Mb7Q`KBM;- M/ i?2M `2biQ`2 i?2 QH/ i`Mb7Q`KiBQMX h?Bb Bb mbmHHv
i?2 T`QT2` i?BM; iQ /Q 7Q`  7mM+iBQM i?i M22/b iQ i2KTQ``BHv i`Mb7Q`K
i?2 +QQ`/BMi2 bvbi2KX 6B`bi- r2 bp2 r?i2p2` i`Mb7Q`KiBQM i?2 +Q/2
i?i +HH2/ i?2 7mM+iBQM rb mbBM;X h?2M- i?2 7mM+iBQM /Q2b Bib i?BM;
UQM iQT Q7 i?2 2tBbiBM; i`Mb7Q`KiBQMV- TQbbB#Hv //BM; KQ`2 i`Mb7Q`@
KiBQMbX M/ }MHHv- r2 `2p2`i iQ i?2 i`Mb7Q`KiBQM i?i r2 bi`i2/
rBi?X
h?2 save M/ restore K2i?Q/b QM i?2 k. +Mpb +QMi2ti T2`7Q`K i?Bb
FBM/ Q7 i`Mb7Q`KiBQM KM;2K2MiX h?2v +QM+2TimHHv F22T  bi+F Q7
i`Mb7Q`KiBQM bii2bX q?2M vQm +HH save- i?2 +m``2Mi bii2 Bb Tmb?2/
QMiQ i?2 bi+F- M/ r?2M vQm +HH restore- i?2 bii2 QM iQT Q7 i?2 bi+F
Bb iF2M Qz M/ mb2/ b i?2 +QMi2tiǶb +m``2Mi i`Mb7Q`KiBQMX
h?2 branch 7mM+iBQM BM i?2 7QHHQrBM; 2tKTH2 BHHmbi`i2b r?i vQm +M /Q
rBi?  7mM+iBQM i?i +?M;2b i?2 i`Mb7Q`KiBQM M/ i?2M +HHb MQi?2`
7mM+iBQM UBM i?Bb +b2 Bib2H7V- r?B+? +QMiBMm2b /`rBM; rBi? i?2 ;Bp2M
i`Mb7Q`KiBQMX
h?Bb 7mM+iBQM /`rb  i`22HBF2 b?T2 #v /`rBM;  HBM2- KQpBM; i?2
+2Mi2` Q7 i?2 +QQ`/BMi2 bvbi2K iQ i?2 2M/ Q7 i?2 HBM2- M/ +HHBM; Bib2H7
irB+2ě}`bi `Qii2/ iQ i?2 H27i M/ i?2M `Qii2/ iQ i?2 `B;?iX 1p2`v +HH
`2/m+2b i?2 H2M;i? Q7 i?2 #`M+? /`rM- M/ i?2 `2+m`bBQM biQTb r?2M
i?2 H2M;i? /`QTb #2HQr 3X
< canvas width ="600" height ="300" > </ canvas >
< script >
var cx = document . querySelector (" canvas ") . getContext ("2 d ") ;
function branch ( length , angle , scale ) {
cx . fillRect (0 , 0 , 1 , length );

jRj
if ( length < 8) return ;
cx . save () ;
cx . translate (0 , length );
cx . rotate ( - angle ) ;
branch ( length * scale , angle , scale ) ;
cx . rotate (2 * angle );
branch ( length * scale , angle , scale ) ;
cx . restore () ;
}
cx . translate (300 , 0) ;
branch (60 , 0.5 , 0.8) ;
</ script >

h?2 `2bmHi Bb  bBKTH2 7`+iHX

A7 i?2 +HHb iQ save M/ restore r2`2 MQi i?2`2- i?2 b2+QM/ `2+m`bBp2 +HH
iQ branch rQmH/ 2M/ mT rBi? i?2 TQbBiBQM M/ `QiiBQM +`2i2/ #v i?2
}`bi +HHX Ai rQmH/MǶi #2 +QMM2+i2/ iQ i?2 +m``2Mi #`M+? #mi `i?2` iQ
i?2 BMM2`KQbi- `B;?iKQbi #`M+? /`rM #v i?2 }`bi +HHX h?2 `2bmHiBM;
b?T2 KB;?i HbQ #2 BMi2`2biBM;- #mi Bi Bb /2}MBi2Hv MQi  i`22X

"+F iQ i?2 ;K2


q2 MQr FMQr 2MQm;? #Qmi +Mpb /`rBM; iQ bi`i rQ`FBM; QM  +Mpb@
#b2/ /BbTHv bvbi2K 7Q` i?2 ;K2 7`QK i?2 T`2pBQmb +?Ti2`X h?2 M2r
/BbTHv rBHH MQ HQM;2` #2 b?QrBM; Dmbi +QHQ`2/ #Qt2bX AMbi2/- r2ǶHH mb2
drawImage iQ /`r TB+im`2b i?i `2T`2b2Mi i?2 ;K2Ƕb 2H2K2MibX
q2 rBHH /2}M2 M Q#D2+i ivT2 CanvasDisplay- bmTTQ`iBM; i?2 bK2 BMi2`@
7+2 b DOMDisplay 7`QK *?Ti2` R8- MK2Hv- i?2 K2i?Q/b drawFrame M/

jR9
clearX
h?Bb Q#D2+i F22Tb  HBiiH2 KQ`2 BM7Q`KiBQM i?M DOMDisplayX _i?2`
i?M mbBM; i?2 b+`QHH TQbBiBQM Q7 Bib .PJ 2H2K2Mi- Bi i`+Fb Bib QrM
pB2rTQ`i- r?B+? i2HHb mb r?i T`i Q7 i?2 H2p2H r2 `2 +m``2MiHv HQQFBM;
iX Ai HbQ i`+Fb iBK2 M/ mb2b i?i iQ /2+B/2 r?B+? MBKiBQM 7`K2
iQ mb2X M/ }MHHv- Bi F22Tb  flipPlayer T`QT2`iv bQ i?i 2p2M r?2M i?2
THv2` Bb biM/BM; biBHH- Bi F22Tb 7+BM; i?2 /B`2+iBQM Bi Hbi KQp2/ BMX
function CanvasDisplay ( parent , level ) {
this . canvas = document . createElement (" canvas ") ;
this . canvas . width = Math . min (600 , level . width * scale ) ;
this . canvas . height = Math . min (450 , level . height * scale ) ;
parent . appendChild ( this . canvas ) ;
this . cx = this . canvas . getContext ("2 d ") ;

this . level = level ;


this . animationTime = 0;
this . flipPlayer = false ;

this . viewport = {
left : 0,
top : 0 ,
width : this . canvas . width / scale ,
height : this . canvas . height / scale
};

this . drawFrame (0) ;


}

CanvasDisplay . prototype . clear = function () {


this . canvas . parentNode . removeChild ( this . canvas ) ;
};

h?2 animationTime +QmMi2` Bb i?2 `2bQM r2 Tbb2/ i?2 bi2T bBx2 iQ drawFrame
BM *?Ti2` R8- 2p2M i?Qm;? DOMDisplay /Q2b MQi mb2 BiX Pm` M2r drawFrame
7mM+iBQM mb2b i?2 +QmMi2` iQ i`+F iBK2 bQ i?i Bi +M brBi+? #2ir22M
MBKiBQM 7`K2b #b2/ QM i?2 +m``2Mi iBK2X
CanvasDisplay . prototype . drawFrame = function ( step ) {
this . animationTime += step ;

jR8
this . updateViewport () ;
this . clearDisplay () ;
this . drawBackground () ;
this . drawActors () ;
};

Pi?2` i?M i`+FBM; iBK2- i?2 K2i?Q/ mT/i2b i?2 pB2rTQ`i 7Q` i?2 +m`@
`2Mi THv2` TQbBiBQM- }HHb i?2 r?QH2 +Mpb rBi?  #+F;`QmM/ +QHQ`- M/
/`rb i?2 #+F;`QmM/ M/ +iQ`b QMiQ i?iX LQi2 i?i i?Bb Bb /Bz2`2Mi
7`QK i?2 TT`Q+? BM *?Ti2` R8- r?2`2 r2 /`2r i?2 #+F;`QmM/ QM+2
M/ b+`QHH2/ i?2 r`TTBM; .PJ 2H2K2Mi iQ KQp2 BiX
"2+mb2 b?T2b QM  +Mpb `2 Dmbi TBt2Hb- 7i2` r2 /`r i?2K- i?2`2
Bb MQ rv iQ KQp2 i?2K UQ` `2KQp2 i?2KVX h?2 QMHv rv iQ mT/i2 i?2
+Mpb /BbTHv Bb iQ +H2` Bi M/ `2/`r i?2 b+2M2X
h?2 updateViewport K2i?Q/ Bb bBKBH` iQ DOMDisplayǶb scrollPlayerIntoView
K2i?Q/X Ai +?2+Fb r?2i?2` i?2 THv2` Bb iQQ +HQb2 iQ i?2 2/;2 Q7 i?2
b+`22M M/ KQp2b i?2 pB2rTQ`i r?2M i?Bb Bb i?2 +b2X
CanvasDisplay . prototype . updateViewport = function () {
var view = this . viewport , margin = view . width / 3;
var player = this . level . player ;
var center = player . pos . plus ( player . size . times (0.5) ) ;

if ( center .x < view . left + margin )


view . left = Math . max ( center . x - margin , 0) ;
else if ( center . x > view . left + view . width - margin )
view . left = Math . min ( center . x + margin - view . width ,
this . level . width - view . width );
if ( center .y < view . top + margin )
view . top = Math . max ( center .y - margin , 0) ;
else if ( center . y > view . top + view . height - margin )
view . top = Math . min ( center .y + margin - view . height ,
this . level . height - view . height ) ;
};

h?2 +HHb iQ Math.max M/ Math.min 2Mbm`2 i?i i?2 pB2rTQ`i /Q2b MQi 2M/
mT b?QrBM; bT+2 QmibB/2 Q7 i?2 H2p2HX Math.max(x, 0) 2Mbm`2b i?i i?2
`2bmHiBM; MmK#2` Bb MQi H2bb i?M x2`QX Math.min- bBKBH`Hv- 2Mbm`2b 
pHm2 bivb #2HQr  ;Bp2M #QmM/X
q?2M +H2`BM; i?2 /BbTHv- r2ǶHH mb2  bHB;?iHv /Bz2`2Mi +QHQ` /2T2M/BM;
QM r?2i?2` i?2 ;K2 Bb rQM U#`B;?i2`V Q` HQbi U/`F2`VX

jRe
CanvasDisplay . prototype . clearDisplay = function () {
if ( this . level . status == " won ")
this . cx . fillStyle = " rgb (68 , 191 , 255) ";
else if ( this . level . status == " lost ")
this . cx . fillStyle = " rgb (44 , 136 , 214) ";
else
this . cx . fillStyle = " rgb (52 , 166 , 251) ";
this . cx . fillRect (0 , 0 ,
this . canvas . width , this . canvas . height );
};

hQ /`r i?2 #+F;`QmM/- r2 `mM i?`Qm;? i?2 iBH2b i?i `2 pBbB#H2 BM i?2
+m``2Mi pB2rTQ`i- mbBM; i?2 bK2 i`B+F mb2/ BM obstacleAt BM i?2 T`2pBQmb
+?Ti2`X
var otherSprites = document . createElement (" img ") ;
otherSprites . src = " img / sprites . png ";

CanvasDisplay . prototype . drawBackground = function () {


var view = this . viewport ;
var xStart = Math . floor ( view . left ) ;
var xEnd = Math . ceil ( view . left + view . width ) ;
var yStart = Math . floor ( view . top );
var yEnd = Math . ceil ( view . top + view . height ) ;

for ( var y = yStart ; y < yEnd ; y ++) {


for ( var x = xStart ; x < xEnd ; x ++) {
var tile = this . level . grid [y ][ x ];
if ( tile == null ) continue ;
var screenX = ( x - view . left ) * scale ;
var screenY = ( y - view . top ) * scale ;
var tileX = tile == " lava " ? scale : 0;
this . cx . drawImage ( otherSprites ,
tileX , 0 , scale , scale ,
screenX , screenY , scale , scale );
}
}
};

hBH2b i?i `2 MQi 2KTiv UMmHHV `2 /`rM rBi? drawImageX h?2 otherSprites
BK;2 +QMiBMb i?2 TB+im`2b mb2/ 7Q` 2H2K2Mib Qi?2` i?M i?2 THv2`X Ai
+QMiBMb- 7`QK H27i iQ `B;?i- i?2 rHH iBH2- i?2 Hp iBH2- M/ i?2 bT`Bi2 7Q`

jRd
 +QBMX

"+F;`QmM/ iBH2b `2 ky #v ky TBt2Hb- bBM+2 r2 rBHH mb2 i?2 bK2 b+H2
i?i r2 mb2/ BM DOMDisplayX h?mb- i?2 Qzb2i 7Q` Hp iBH2b Bb ky Ui?2 pHm2
Q7 i?2 scale p`B#H2V- M/ i?2 Qzb2i 7Q` rHHb Bb yX
q2 /QMǶi #Qi?2` rBiBM; 7Q` i?2 bT`Bi2 BK;2 iQ HQ/X *HHBM; drawImage
rBi? M BK;2 i?i ?bMǶi #22M HQ/2/ v2i rBHH bBKTHv /Q MQi?BM;X h?mb-
r2 KB;?i 7BH iQ /`r i?2 ;K2 T`QT2`Hv 7Q` i?2 }`bi 72r 7`K2b- r?BH2
i?2 BK;2 Bb biBHH HQ/BM;- #mi i?i Bb MQi  b2`BQmb T`Q#H2KX aBM+2 r2
F22T mT/iBM; i?2 b+`22M- i?2 +Q``2+i b+2M2 rBHH TT2` b bQQM b i?2
HQ/BM; }MBb?2bX
h?2 rHFBM; +?`+i2` b?QrM 2`HB2` rBHH #2 mb2/ iQ `2T`2b2Mi i?2
THv2`X h?2 +Q/2 i?i /`rb Bi M22/b iQ TB+F i?2 `B;?i bT`Bi2 M/ /B`2+@
iBQM #b2/ QM i?2 THv2`Ƕb +m``2Mi KQiBQMX h?2 }`bi 2B;?i bT`Bi2b +QMiBM
 rHFBM; MBKiBQMX q?2M i?2 THv2` Bb KQpBM; HQM;  ~QQ`- r2 +v+H2
i?`Qm;? i?2K #b2/ QM i?2 /BbTHvǶb animationTime T`QT2`ivX h?Bb Bb K2@
bm`2/ BM b2+QM/b- M/ r2 rMi iQ brBi+? 7`K2b Rk iBK2b T2` b2+QM/- bQ
i?2 iBK2 Bb KmHiBTHB2/ #v Rk }`biX q?2M i?2 THv2` Bb biM/BM; biBHH- r2
/`r i?2 MBMi? bT`Bi2X .m`BM; DmKTb- r?B+? `2 `2+Q;MBx2/ #v i?2 7+i
i?i i?2 p2`iB+H bT22/ Bb MQi x2`Q- r2 mb2 i?2 i2Mi?- `B;?iKQbi bT`Bi2X
"2+mb2 i?2 bT`Bi2b `2 bHB;?iHv rB/2` i?M i?2 THv2` Q#D2+iěk9 BM@
bi2/ Q7 Re TBt2Hb- iQ HHQr bQK2 bT+2 7Q` 722i M/ `Kběi?2 K2i?Q/ ?b
iQ /Dmbi i?2 t@+QQ`/BMi2 M/ rB/i? #v  ;Bp2M KQmMi UplayerXOverlapVX
var playerSprites = document . createElement (" img ") ;
playerSprites . src = " img / player . png ";
var playerXOverlap = 4;

CanvasDisplay . prototype . drawPlayer = function (x , y , width ,


height ) {
var sprite = 8 , player = this . level . player ;
width += playerXOverlap * 2;
x -= playerXOverlap ;
if ( player . speed . x != 0)
this . flipPlayer = player . speed .x < 0;

if ( player . speed . y != 0)

jR3
sprite = 9;
else if ( player . speed .x != 0)
sprite = Math . floor ( this . animationTime * 12) % 8;

this . cx . save () ;
if ( this . flipPlayer )
flipHorizontally ( this . cx , x + width / 2) ;

this . cx . drawImage ( playerSprites ,


sprite * width , 0 , width , height ,
x, y , width , height ) ;

this . cx . restore () ;
};

h?2 drawPlayer K2i?Q/ Bb +HH2/ #v drawActors- r?B+? Bb `2bTQMbB#H2 7Q`


/`rBM; HH i?2 +iQ`b BM i?2 ;K2X
CanvasDisplay . prototype . drawActors = function () {
this . level . actors . forEach ( function ( actor ) {
var width = actor . size .x * scale ;
var height = actor . size . y * scale ;
var x = ( actor . pos . x - this . viewport . left ) * scale ;
var y = ( actor . pos . y - this . viewport . top ) * scale ;
if ( actor . type == " player ") {
this . drawPlayer (x , y , width , height ) ;
} else {
var tileX = ( actor . type == " coin " ? 2 : 1) * scale ;
this . cx . drawImage ( otherSprites ,
tileX , 0 , width , height ,
x, y , width , height ) ;
}
} , this ) ;
};

q?2M /`rBM; bQK2i?BM; i?i Bb MQi i?2 THv2`- r2 HQQF i Bib ivT2 iQ
}M/ i?2 Qzb2i Q7 i?2 +Q``2+i bT`Bi2X h?2 Hp iBH2 Bb 7QmM/ i Qzb2i ky-
M/ i?2 +QBM bT`Bi2 Bb 7QmM/ i 9y UirQ iBK2b scaleVX
q2 ?p2 iQ bm#i`+i i?2 pB2rTQ`iǶb TQbBiBQM r?2M +QKTmiBM; i?2 +@
iQ`Ƕb TQbBiBQM bBM+2 Uy-yV QM Qm` +Mpb +Q``2bTQM/b iQ i?2 iQT H27i Q7 i?2
pB2rTQ`i- MQi i?2 iQT H27i Q7 i?2 H2p2HX q2 +QmH/ HbQ ?p2 mb2/ translate
7Q` i?BbX 1Bi?2` rv rQ`FbX

jRN
h?i +QM+Hm/2b i?2 M2r /BbTHv bvbi2KX h?2 `2bmHiBM; ;K2 HQQFb
bQK2i?BM; HBF2 i?Bb,

*?QQbBM;  ;`T?B+b BMi2`7+2


q?2M2p2` vQm M22/ iQ ;2M2`i2 ;`T?B+b BM i?2 #`Qrb2`- vQm +M +?QQb2
#2ir22M THBM >hJG- ao:- M/ +MpbX h?2`2 Bb MQ bBM;H2 #2bi TT`Q+?
i?i rQ`Fb BM HH bBimiBQMbX 1+? QTiBQM ?b bi`2M;i?b M/ r2FM2bb2bX
SHBM >hJG ?b i?2 /pMi;2 Q7 #2BM; bBKTH2X Ai HbQ BMi2;`i2b r2HH
rBi? i2tiX "Qi? ao: M/ +Mpb HHQr vQm iQ /`r i2ti- #mi i?2v rQMǶi
?2HT vQm TQbBiBQM i?i i2ti Q` r`T Bi r?2M Bi iF2b mT KQ`2 i?M QM2
HBM2X AM M >hJG@#b2/ TB+im`2- Bi Bb 2bv iQ BM+Hm/2 #HQ+Fb Q7 i2tiX
ao: +M #2 mb2/ iQ T`Q/m+2 +`BbT ;`T?B+b i?i HQQF ;QQ/ i Mv xQQK
H2p2HX Ai Bb KQ`2 /B{+mHi iQ mb2 i?M THBM >hJG #mi HbQ Km+? KQ`2
TQr2`7mHX
"Qi? ao: M/ >hJG #mBH/ mT  /i bi`m+im`2 Ui?2 .PJV i?i
`2T`2b2Mib i?2 TB+im`2X h?Bb KF2b Bi TQbbB#H2 iQ KQ/B7v 2H2K2Mib 7i2`
i?2v `2 /`rMX A7 vQm M22/ iQ `2T2i2/Hv +?M;2  bKHH T`i Q7  #B;
TB+im`2 BM `2bTQMb2 iQ r?i i?2 mb2` Bb /QBM; Q` b T`i Q7 M MBKiBQM-
/QBM; Bi BM  +Mpb +M #2 M22/H2bbHv 2tT2MbBp2X h?2 .PJ HbQ HHQrb
mb iQ `2;Bbi2` KQmb2 2p2Mi ?M/H2`b QM 2p2`v 2H2K2Mi BM i?2 TB+im`2 U2p2M
QM b?T2b /`rM rBi? ao:VX uQm +MǶi /Q i?i rBi? +MpbX
"mi +MpbǶb TBt2H@Q`B2Mi2/ TT`Q+? +M #2 M /pMi;2 r?2M /`r@

jky
BM;  ?m;2 KQmMi Q7 iBMv 2H2K2MibX h?2 7+i i?i Bi /Q2b MQi #mBH/ mT
 /i bi`m+im`2 #mi QMHv `2T2i2/Hv /`rb QMiQ i?2 bK2 TBt2H bm`7+2
;Bp2b +Mpb  HQr2` +Qbi T2` b?T2X
h?2`2 `2 HbQ 2z2+ib- bm+? b `2M/2`BM;  b+2M2 QM2 TBt2H i  iBK2 U7Q`
2tKTH2- mbBM;  `v i`+2`V Q` TQbiT`Q+2bbBM; M BK;2 rBi? Cpa+`BTi
U#Hm``BM; Q` /BbiQ`iBM; BiV- i?i +M QMHv #2 `2HBbiB+HHv ?M/H2/ #v 
TBt2H@#b2/ i2+?MB[m2X
AM bQK2 +b2b- vQm Kv rMi iQ +QK#BM2 b2p2`H Q7 i?2b2 i2+?MB[m2bX
6Q` 2tKTH2- vQm KB;?i /`r  ;`T? rBi? ao: Q` +Mpb #mi b?Qr i2t@
imH BM7Q`KiBQM #v TQbBiBQMBM; M >hJG 2H2K2Mi QM iQT Q7 i?2 TB+im`2X
6Q` MQM/2KM/BM; TTHB+iBQMb- Bi `2HHv /Q2bMǶi Kii2` Km+? r?B+?
BMi2`7+2 vQm +?QQb2X h?2 b2+QM/ /BbTHv r2 #mBHi 7Q` Qm` ;K2 BM i?Bb
+?Ti2` +QmH/ ?p2 #22M BKTH2K2Mi2/ mbBM; Mv Q7 i?2b2 i?`22 ;`T?B+b
i2+?MQHQ;B2b bBM+2 Bi /Q2b MQi M22/ iQ /`r i2ti- ?M/H2 KQmb2 BMi2`+@
iBQM- Q` rQ`F rBi? M 2ti`Q`/BM`BHv H`;2 KQmMi Q7 2H2K2MibX

amKK`v
AM i?Bb +?Ti2`- r2 /Bb+mbb2/ i2+?MB[m2b 7Q` /`rBM; ;`T?B+b BM i?2
#`Qrb2`- 7Q+mbBM; QM i?2 <canvas> 2H2K2MiX
 +Mpb MQ/2 `2T`2b2Mib M `2 BM  /Q+mK2Mi i?i Qm` T`Q;`K
Kv /`r QMX h?Bb /`rBM; Bb /QM2 i?`Qm;?  /`rBM; +QMi2ti Q#D2+i-
+`2i2/ rBi? i?2 getContext K2i?Q/X
h?2 k. /`rBM; BMi2`7+2 HHQrb mb iQ }HH M/ bi`QF2 p`BQmb b?T2bX
h?2 +QMi2tiǶb fillStyle T`QT2`iv /2i2`KBM2b ?Qr b?T2b `2 }HH2/X h?2
strokeStyle M/ lineWidth T`QT2`iB2b +QMi`QH i?2 rv HBM2b `2 /`rMX
_2+iM;H2b M/ TB2+2b Q7 i2ti +M #2 /`rM rBi?  bBM;H2 K2i?Q/ +HHX
h?2 fillRect M/ strokeRect K2i?Q/b /`r `2+iM;H2b- M/ i?2 fillText
M/ strokeText K2i?Q/b /`r i2tiX hQ +`2i2 +mbiQK b?T2b- r2 Kmbi
}`bi #mBH/ mT  Ti?X
*HHBM; beginPath bi`ib  M2r Ti?X  MmK#2` Q7 Qi?2` K2i?Q/b //
HBM2b M/ +m`p2b iQ i?2 +m``2Mi Ti?X 6Q` 2tKTH2- lineTo +M // 
bi`B;?i HBM2X q?2M  Ti? Bb }MBb?2/- Bi +M #2 }HH2/ rBi? i?2 fill
K2i?Q/ Q` bi`QF2/ rBi? i?2 stroke K2i?Q/X
JQpBM; TBt2Hb 7`QK M BK;2 Q` MQi?2` +Mpb QMiQ Qm` +Mpb Bb /QM2
rBi? i?2 drawImage K2i?Q/X "v /27mHi- i?Bb K2i?Q/ /`rb i?2 r?QH2

jkR
bQm`+2 BK;2- #mi #v ;BpBM; Bi KQ`2 T`K2i2`b- vQm +M +QTv  bT2+B}+
`2 Q7 i?2 BK;2X q2 mb2/ i?Bb 7Q` Qm` ;K2 #v +QTvBM; BM/BpB/mH TQb2b
Q7 i?2 ;K2 +?`+i2` Qmi Q7 M BK;2 i?i +QMiBM2/ KMv bm+? TQb2bX
h`Mb7Q`KiBQMb HHQr vQm iQ /`r  b?T2 BM KmHiBTH2 Q`B2MiiBQMbX 
k. /`rBM; +QMi2ti ?b  +m``2Mi i`Mb7Q`KiBQM i?i +M #2 +?M;2/
rBi? i?2 translate- scale- M/ rotate K2i?Q/bX h?2b2 rBHH z2+i HH bm#@
b2[m2Mi /`rBM; QT2`iBQMbX  i`Mb7Q`KiBQM bii2 +M #2 bp2/ rBi?
i?2 save K2i?Q/ M/ `2biQ`2/ rBi? i?2 restore K2i?Q/X
q?2M /`rBM; M MBKiBQM QM  +Mpb- i?2 clearRect K2i?Q/ +M #2
mb2/ iQ +H2` T`i Q7 i?2 +Mpb #27Q`2 `2/`rBM; BiX

1t2`+Bb2b
a?T2b
q`Bi2  T`Q;`K i?i /`rb i?2 7QHHQrBM; b?T2b QM  +Mpb,

RX  i`T2xQB/ U `2+iM;H2 i?i Bb rB/2` QM QM2 bB/2V

kX  `2/ /BKQM/ U `2+iM;H2 `Qii2/ 98 /2;`22b Q` 14 π `/BMbV

jX  xB;x;;BM; HBM2

9X  bTB`H K/2 mT Q7 Ryy bi`B;?i HBM2 b2;K2Mib

8X  v2HHQr bi`

q?2M /`rBM; i?2 Hbi irQ- vQm Kv rMi iQ `272` iQ i?2 2tTHMiBQM Q7
Math.cos M/ Math.sin BM *?Ti2` Rj- r?B+? /2b+`B#2b ?Qr iQ ;2i +QQ`/B@
Mi2b QM  +B`+H2 mbBM; i?2b2 7mM+iBQMbX
A `2+QKK2M/ +`2iBM;  7mM+iBQM 7Q` 2+? b?T2X Sbb i?2 TQbBiBQM- M/
QTiBQMHHv Qi?2` T`QT2`iB2b- bm+? b i?2 bBx2 Q` i?2 MmK#2` Q7 TQBMib- b

jkk
T`K2i2`bX h?2 Hi2`MiBp2- r?B+? Bb iQ ?`/@+Q/2 MmK#2`b HH Qp2`
vQm` +Q/2- i2M/b iQ KF2 i?2 +Q/2 M22/H2bbHv ?`/ iQ `2/ M/ KQ/B7vX

h?2 TB2 +?`i


1`HB2` BM i?2 +?Ti2`- r2 br M 2tKTH2 T`Q;`K i?i /`2r  TB2 +?`iX
JQ/B7v i?Bb T`Q;`K bQ i?i i?2 MK2 Q7 2+? +i2;Q`v Bb b?QrM M2ti
iQ i?2 bHB+2 i?i `2T`2b2Mib BiX h`v iQ }M/  TH2bBM;@HQQFBM; rv iQ
miQKiB+HHv TQbBiBQM i?Bb i2ti- r?B+? rQmH/ rQ`F 7Q` Qi?2` /i b2ib
b r2HHX uQm Kv bbmK2 i?i +i2;Q`B2b `2 MQ bKHH2` i?M 8 T2`+2Mi
Ui?i Bb- i?2`2 rQMǶi #2  #mM+? Q7 iBMv QM2b M2ti iQ 2+? Qi?2`VX
uQm KB;?i ;BM M22/ Math.sin M/ Math.cos- b /2b+`B#2/ BM i?2 T`2pBQmb
2t2`+Bb2X

 #QmM+BM; #HH
lb2 i?2 requestAnimationFrame i2+?MB[m2 i?i r2 br BM *?Ti2` Rj M/
*?Ti2` R8 iQ /`r  #Qt rBi?  #QmM+BM; #HH BM BiX h?2 #HH KQp2b i
 +QMbiMi bT22/ M/ #QmM+2b Qz i?2 #QtǶb bB/2b r?2M Bi ?Bib i?2KX

S`2+QKTmi2/ KB``Q`BM;
PM2 mM7Q`imMi2 i?BM; #Qmi i`Mb7Q`KiBQMb Bb i?i i?2v bHQr /QrM
/`rBM; Q7 #BiKTbX 6Q` p2+iQ` ;`T?B+b- i?2 2z2+i Bb H2bb b2`BQmb bBM+2
QMHv  72r TQBMib U7Q` 2tKTH2- i?2 +2Mi2` Q7  +B`+H2V M22/ iQ #2 i`Mb@
7Q`K2/- 7i2` r?B+? /`rBM; +M ?TT2M b MQ`KHX 6Q`  #BiKT BK;2-
i?2 TQbBiBQM Q7 2+? TBt2H ?b iQ #2 i`Mb7Q`K2/- M/ i?Qm;? Bi Bb TQbbB#H2
i?i #`Qrb2`b rBHH ;2i KQ`2 +H2p2` #Qmi i?Bb BM i?2 7mim`2- i?Bb +m``2MiHv
+mb2b  K2bm`#H2 BM+`2b2 BM i?2 iBK2 Bi iF2b iQ /`r  #BiKTX
AM  ;K2 HBF2 Qm`b- r?2`2 r2 `2 /`rBM; QMHv  bBM;H2 i`Mb7Q`K2/
bT`Bi2- i?Bb Bb  MQMBbbm2X "mi BK;BM2 i?i r2 M22/ iQ /`r ?mM/`2/b
Q7 +?`+i2`b Q` i?QmbM/b Q7 `QiiBM; T`iB+H2b 7`QK M 2tTHQbBQMX
h?BMF Q7  rv iQ HHQr mb iQ /`r M BMp2`i2/ +?`+i2` rBi?Qmi
HQ/BM; //BiBQMH BK;2 }H2b M/ rBi?Qmi ?pBM; iQ KF2 i`Mb7Q`K2/
drawImage +HHb 2p2`v 7`K2X

jkj
dzh?2 /`2K #2?BM/ i?2 q2# Bb Q7  +QKKQM BM7Q`KiBQM bT+2
BM r?B+? r2 +QKKmMB+i2 #v b?`BM; BM7Q`KiBQMX Aib
mMBp2`bHBiv Bb 2bb2MiBH, i?2 7+i i?i  ?vT2`i2ti HBMF +M
TQBMi iQ Mvi?BM;- #2 Bi T2`bQMH- HQ+H Q` ;HQ#H- #2 Bi /`7i Q`
?B;?Hv TQHBb?2/XǴ
ěhBK "2`M2`b@G22- h?2 qQ`H/ qB/2 q2#,  p2`v b?Q`i
T2`bQMH ?BbiQ`v

Rd >hhS
h?2 >vT2`i2ti h`Mb72` S`QiQ+QH- H`2/v K2MiBQM2/ BM *?Ti2` Rk- Bb
i?2 K2+?MBbK i?`Qm;? r?B+? /i Bb `2[m2bi2/ M/ T`QpB/2/ QM i?2
qQ`H/ qB/2 q2#X h?Bb +?Ti2` /2b+`B#2b i?2 T`QiQ+QH BM KQ`2 /2iBH
M/ 2tTHBMb i?2 rv #`Qrb2` Cpa+`BTi ?b ++2bb iQ BiX

h?2 T`QiQ+QH
A7 vQm ivT2 2HQ[m2MiDpb+`BTiXM2ifRdn?iiTX?iKH BMiQ vQm` #`Qrb2`Ƕb /@
/`2bb #`- i?2 #`Qrb2` }`bi HQQFb mT i?2 //`2bb Q7 i?2 b2`p2` bbQ+Bi2/
rBi? 2HQ[m2MiDpb+`BTiXM2i M/ i`B2b iQ QT2M  h*S +QMM2+iBQM iQ Bi
QM TQ`i 3y- i?2 /27mHi TQ`i 7Q` >hhS i`{+X A7 i?2 b2`p2` 2tBbib M/
++2Tib i?2 +QMM2+iBQM- i?2 #`Qrb2` b2M/b bQK2i?BM; HBF2 i?Bb,
GET /17 _http . html HTTP /1.1
Host : eloquentjavascript . net
User - Agent : Your browser s name

h?2M i?2 b2`p2` `2bTQM/b- i?`Qm;? i?i bK2 +QMM2+iBQMX


HTTP /1.1 200 OK
Content - Length : 65585
Content - Type : text / html
Last - Modified : Wed , 09 Apr 2014 10:48:09 GMT

<! doctype html >


... the rest of the document

h?2 #`Qrb2` i?2M iF2b i?2 T`i Q7 i?2 `2bTQMb2 7i2` i?2 #HMF HBM2 M/
/BbTHvb Bi b M >hJG /Q+mK2MiX
h?2 BM7Q`KiBQM b2Mi #v i?2 +HB2Mi Bb +HH2/ i?2 `2[m2biX Ai bi`ib rBi?
i?Bb HBM2,
GET /17 _http . html HTTP /1.1

jk9
h?2 }`bi rQ`/ Bb i?2 K2i?Q/ Q7 i?2 `2[m2biX GET K2Mb i?i r2 rMi iQ
;2i i?2 bT2+B}2/ `2bQm`+2X Pi?2` +QKKQM K2i?Q/b `2 DELETE iQ /2H2i2 
`2bQm`+2- PUT iQ `2TH+2 Bi- M/ POST iQ b2M/ BM7Q`KiBQM iQ BiX LQi2 i?i
i?2 b2`p2` Bb MQi Q#HB;2/ iQ +``v Qmi 2p2`v `2[m2bi Bi ;2ibX A7 vQm rHF
mT iQ  `M/QK r2#bBi2 M/ i2HH Bi iQ DELETE Bib KBM T;2- BiǶHH T`Q##Hv
`27mb2X
h?2 T`i 7i2` i?2 K2i?Q/ MK2 Bb i?2 Ti? Q7 i?2 `2bQm`+2 i?2 `2@
[m2bi TTHB2b iQX AM i?2 bBKTH2bi +b2-  `2bQm`+2 Bb bBKTHv  }H2 QM i?2
b2`p2`- #mi i?2 T`QiQ+QH /Q2bMǶi `2[mB`2 Bi iQ #2X  `2bQm`+2 Kv #2
Mvi?BM; i?i +M #2 i`Mb72``2/ b B7 Bi Bb  }H2X JMv b2`p2`b ;2M@
2`i2 i?2 `2bTQMb2b i?2v T`Q/m+2 QM i?2 ~vX 6Q` 2tKTH2- B7 vQm QT2M
irBii2`X+QKfK`BDMD?- i?2 b2`p2` HQQFb BM Bib /i#b2 7Q`  mb2` MK2/
K`BDMD?- M/ B7 Bi }M/b QM2- Bi rBHH ;2M2`i2  T`Q}H2 T;2 7Q` i?i mb2`X
7i2` i?2 `2bQm`+2 Ti?- i?2 }`bi HBM2 Q7 i?2 `2[m2bi K2MiBQMb HTTP/1.1
iQ BM/B+i2 i?2 p2`bBQM Q7 i?2 >hhS T`QiQ+QH Bi Bb mbBM;X
h?2 b2`p2`Ƕb `2bTQMb2 rBHH bi`i rBi?  p2`bBQM b r2HH- 7QHHQr2/ #v i?2
biimb Q7 i?2 `2bTQMb2- }`bi b  i?`22@/B;Bi biimb +Q/2 M/ i?2M b 
?mKM@`2/#H2 bi`BM;X
HTTP /1.1 200 OK

aiimb +Q/2b bi`iBM; rBi?  k BM/B+i2 i?i i?2 `2[m2bi bm++22/2/X *Q/2b
bi`iBM; rBi? 9 K2M i?2`2 rb bQK2i?BM; r`QM; rBi? i?2 `2[m2biX 9y9
Bb T`Q##Hv i?2 KQbi 7KQmb >hhS biimb +Q/2ěBi K2Mb i?i i?2 `2@
bQm`+2 i?i rb `2[m2bi2/ +QmH/ MQi #2 7QmM/X *Q/2b i?i bi`i rBi? 8
K2M M 2``Q` ?TT2M2/ QM i?2 b2`p2` M/ i?2 `2[m2bi Bb MQi iQ #HK2X
h?2 }`bi HBM2 Q7  `2[m2bi Q` `2bTQMb2 Kv #2 7QHHQr2/ #v Mv MmK#2`
Q7 ?2/2`bX h?2b2 `2 HBM2b BM i?2 7Q`K dzMK2, pHm2Ǵ i?i bT2+B7v 2ti`
BM7Q`KiBQM #Qmi i?2 `2[m2bi Q` `2bTQMb2X h?2b2 ?2/2`b r2`2 T`i Q7
i?2 2tKTH2 `2bTQMb2,
Content - Length : 65585
Content - Type : text / html
Last - Modified : Wed , 09 Apr 2014 10:48:09 GMT

h?Bb i2HHb mb i?2 bBx2 M/ ivT2 Q7 i?2 `2bTQMb2 /Q+mK2MiX AM i?Bb +b2-
Bi Bb M >hJG /Q+mK2Mi Q7 e8-838 #vi2bX Ai HbQ i2HHb mb r?2M i?i
/Q+mK2Mi rb Hbi KQ/B}2/X

jk8
6Q` i?2 KQbi T`i-  +HB2Mi Q` b2`p2` /2+B/2b r?B+? ?2/2`b iQ BM+Hm/2 BM
 `2[m2bi Q` `2bTQMb2- i?Qm;?  72r ?2/2`b `2 `2[mB`2/X 6Q` 2tKTH2-
i?2 Host ?2/2`- r?B+? bT2+B}2b i?2 ?QbiMK2- b?QmH/ #2 BM+Hm/2/ BM 
`2[m2bi #2+mb2  b2`p2` KB;?i #2 b2`pBM; KmHiBTH2 ?QbiMK2b QM  bBM;H2
AS //`2bb- M/ rBi?Qmi i?i ?2/2`- i?2 b2`p2` rQMǶi FMQr r?B+? ?Qbi
i?2 +HB2Mi Bb i`vBM; iQ iHF iQX
7i2` i?2 ?2/2`b- #Qi? `2[m2bib M/ `2bTQMb2b Kv BM+Hm/2  #HMF
HBM2 7QHHQr2/ #v  #Q/v- r?B+? +QMiBMb i?2 /i #2BM; b2MiX GET M/
DELETE `2[m2bib /QMǶi b2M/ HQM; Mv /i- #mi PUT M/ POST `2[m2bib /QX
aBKBH`Hv- bQK2 `2bTQMb2 ivT2b- bm+? b 2``Q` `2bTQMb2b- /Q MQi `2[mB`2 
#Q/vX

"`Qrb2`b M/ >hhS


b r2 br BM i?2 2tKTH2-  #`Qrb2` rBHH KF2  `2[m2bi r?2M r2 2Mi2`
 l_G BM Bib //`2bb #`X q?2M i?2 `2bmHiBM; >hJG T;2 `272`2M+2b
Qi?2` }H2b- bm+? b BK;2b M/ Cpa+`BTi }H2b- i?Qb2 `2 HbQ 72i+?2/X
 KQ/2`i2Hv +QKTHB+i2/ r2#bBi2 +M 2bBHv BM+Hm/2 Mvr?2`2 7`QK Ry
iQ kyy `2bQm`+2bX hQ #2 #H2 iQ 72i+? i?Qb2 [mB+FHv- #`Qrb2`b rBHH KF2
b2p2`H `2[m2bib bBKmHiM2QmbHv- `i?2` i?M rBiBM; 7Q` i?2 `2bTQMb2b
QM2 i  iBK2X am+? /Q+mK2Mib `2 Hrvb 72i+?2/ mbBM; GET `2[m2bibX
>hJG T;2b Kv BM+Hm/2 7Q`Kb- r?B+? HHQr i?2 mb2` iQ }HH Qmi BM7Q`@
KiBQM M/ b2M/ Bi iQ i?2 b2`p2`X h?Bb Bb M 2tKTH2 Q7  7Q`K,
< form method =" GET " action =" example / message . html ">
<p > Name : < input type =" text " name =" name " > </p >
<p > Message : <br > < textarea name =" message " > </ textarea > </p >
<p > < button type =" submit "> Send </ button > </p >
</ form >

h?Bb +Q/2 /2b+`B#2b  7Q`K rBi? irQ }2H/b,  bKHH QM2 bFBM; 7Q` 
MK2 M/  H`;2` QM2 iQ r`Bi2  K2bb;2 BMX q?2M vQm +HB+F i?2 a2M/
#miiQM- i?2 BM7Q`KiBQM BM i?Qb2 }2H/b rBHH #2 2M+Q/2/ BMiQ  [m2`v bi`BM;X
q?2M i?2 <form> 2H2K2MiǶb method ii`B#mi2 Bb GET UQ` Bb QKBii2/V- i?i
[m2`v bi`BM; Bb i+F2/ QMiQ i?2 action l_G- M/ i?2 #`Qrb2` KF2b  GET
`2[m2bi iQ i?i l_GX
GET / example / message . html ? name = Jean & message = Yes %3 F HTTP /1.1

jke
h?2 bi`i Q7  [m2`v bi`BM; Bb BM/B+i2/ #v  [m2biBQM K`FX 7i2` i?i
7QHHQr TB`b Q7 MK2b M/ pHm2b- +Q``2bTQM/BM; iQ i?2 name ii`B#mi2 QM
i?2 7Q`K }2H/ 2H2K2Mib M/ i?2 +QMi2Mi Q7 i?Qb2 2H2K2Mib- `2bT2+iBp2HvX
M KT2`bM/ +?`+i2` U&V Bb mb2/ iQ b2T`i2 i?2 TB`bX
h?2 +imH K2bb;2 2M+Q/2/ BM i?2 T`2pBQmb l_G Bb dzu2b\Ǵ- 2p2M
i?Qm;? i?2 [m2biBQM K`F Bb `2TH+2/ #v  bi`M;2 +Q/2X aQK2 +?`+@
i2`b BM [m2`v bi`BM;b Kmbi #2 2b+T2/X h?2 [m2biBQM K`F- `2T`2b2Mi2/
b %3F- Bb QM2 Q7 i?Qb2X h?2`2 b22Kb iQ #2 M mMr`Bii2M `mH2 i?i 2p2`v
7Q`Ki M22/b Bib QrM rv Q7 2b+TBM; +?`+i2`bX h?Bb QM2- +HH2/ l_G
2M+Q/BM;- mb2b  T2`+2Mi bB;M 7QHHQr2/ #v irQ ?2t/2+BKH /B;Bib i?i
2M+Q/2 i?2 +?`+i2` +Q/2X AM i?Bb +b2- j6- r?B+? Bb ej BM /2+BKH MQi@
iBQM- Bb i?2 +Q/2 Q7  [m2biBQM K`F +?`+i2`X Cpa+`BTi T`QpB/2b i?2
encodeURIComponent M/ decodeURIComponent 7mM+iBQMb iQ 2M+Q/2 M/ /2+Q/2
i?Bb 7Q`KiX
console . log ( encodeURIComponent (" Hello & goodbye ") ) ;
// → Hello %20%26%20 goodbye
console . log ( decodeURIComponent (" Hello %20%26%20 goodbye ") ) ;
// → Hello & goodbye

A7 r2 +?M;2 i?2 method ii`B#mi2 Q7 i?2 >hJG 7Q`K BM i?2 2tKTH2 r2


br 2`HB2` iQ POST- i?2 >hhS `2[m2bi K/2 iQ bm#KBi i?2 7Q`K rBHH mb2
i?2 POST K2i?Q/ M/ Tmi i?2 [m2`v bi`BM; BM #Q/v Q7 i?2 `2[m2bi- `i?2`
i?M //BM; Bi iQ i?2 l_GX
POST / example / message . html HTTP /1.1
Content - length : 24
Content - type : application /x - www - form - urlencoded

name = Jean & message = Yes %3 F

"v +QMp2MiBQM- i?2 GET K2i?Q/ Bb mb2/ 7Q` `2[m2bib i?i /Q MQi ?p2 bB/2
2z2+ib- bm+? b /QBM;  b2`+?X _2[m2bib i?i +?M;2 bQK2i?BM; QM i?2
b2`p2`- bm+? b +`2iBM;  M2r ++QmMi Q` TQbiBM;  K2bb;2- b?QmH/ #2
2tT`2bb2/ rBi? Qi?2` K2i?Q/b- bm+? b POSTX *HB2Mi@bB/2 bQ7ir`2- bm+?
b  #`Qrb2`- FMQrb i?i Bi b?QmH/MǶi #HBM/Hv KF2 POST `2[m2bib #mi rBHH
Q7i2M BKTHB+BiHv KF2 GET `2[m2bibě7Q` 2tKTH2- iQ T`272i+?  `2bQm`+2
Bi #2HB2p2b i?2 mb2` rBHH bQQM M22/X
h?2 M2ti +?Ti2` rBHH `2im`M iQ 7Q`Kb M/ iHF #Qmi ?Qr r2 +M b+`BTi

jkd
i?2K rBi? Cpa+`BTiX

sJG>iiT_2[m2bi
h?2 BMi2`7+2 i?`Qm;? r?B+? #`Qrb2` Cpa+`BTi +M KF2 >hhS `2@
[m2bib Bb +HH2/ XMLHttpRequest UMQi2 i?2 BM+QMbBbi2Mi +TBiHBxiBQMVX Ai
rb /2bB;M2/ #v JB+`QbQ7i- 7Q` Bib AMi2`M2i 1tTHQ`2` #`Qrb2`- BM i?2 Hi2
RNNybX .m`BM; i?Bb iBK2- i?2 sJG }H2 7Q`Ki rb p2`v TQTmH` BM i?2
rQ`H/ Q7 #mbBM2bb bQ7ir`2ě rQ`H/ r?2`2 JB+`QbQ7i ?b Hrvb #22M i
?QK2X AM 7+i- Bi rb bQ TQTmH` i?i i?2 +`QMvK sJG rb i+F2/ QMiQ
i?2 7`QMi Q7 i?2 MK2 Q7 M BMi2`7+2 7Q` >hhS- r?B+? Bb BM MQ rv iB2/
iQ sJGX
h?2 MK2 BbMǶi +QKTH2i2Hv MQMb2MbB+H- i?Qm;?X h?2 BMi2`7+2 HHQrb
vQm iQ T`b2 `2bTQMb2 /Q+mK2Mib b sJG B7 vQm rMiX *QM~iBM; irQ
/BbiBM+i +QM+2Tib UKFBM;  `2[m2bi M/ T`bBM; i?2 `2bTQMb2V BMiQ 
bBM;H2 i?BM; Bb i2``B#H2 /2bB;M- Q7 +Qm`b2- #mi bQ Bi ;Q2bX
q?2M i?2 XMLHttpRequest BMi2`7+2 rb //2/ iQ AMi2`M2i 1tTHQ`2`- Bi
HHQr2/ T2QTH2 iQ /Q i?BM;b rBi? Cpa+`BTi i?i ?/ #22M p2`v ?`/
#27Q`2X 6Q` 2tKTH2- r2#bBi2b bi`i2/ b?QrBM; HBbib Q7 bm;;2biBQMb r?2M
i?2 mb2` rb ivTBM; bQK2i?BM; BMiQ  i2ti }2H/X h?2 b+`BTi rQmH/ b2M/
i?2 i2ti iQ i?2 b2`p2` Qp2` >hhS b i?2 mb2` ivT2/X h?2 b2`p2`- r?B+?
?/ bQK2 /i#b2 Q7 TQbbB#H2 BMTmib- rQmH/ Ki+? i?2 /i#b2 2Mi`B2b
;BMbi i?2 T`iBH BMTmi M/ b2M/ #+F TQbbB#H2 +QKTH2iBQMb iQ b?Qr i?2
mb2`X h?Bb rb +QMbB/2`2/ bT2+i+mH`ěT2QTH2 r2`2 mb2/ iQ rBiBM; 7Q`
 7mHH T;2 `2HQ/ 7Q` 2p2`v BMi2`+iBQM rBi?  r2#bBi2X
h?2 Qi?2` bB;MB}+Mi #`Qrb2` i i?i iBK2- JQxBHH UHi2` 6B`27QtV-
/B/ MQi rMi iQ #2 H27i #2?BM/X hQ HHQr T2QTH2 iQ /Q bBKBH`Hv M2i
i?BM;b BM Bib #`Qrb2`- JQxBHH +QTB2/ i?2 BMi2`7+2- BM+Hm/BM; i?2 #Q;mb
MK2X h?2 M2ti ;2M2`iBQM Q7 #`Qrb2`b 7QHHQr2/ i?Bb 2tKTH2- M/ iQ/v
XMLHttpRequest Bb  /2 7+iQ biM/`/ BMi2`7+2X

a2M/BM;  `2[m2bi
hQ KF2  bBKTH2 `2[m2bi- r2 +`2i2  `2[m2bi Q#D2+i rBi? i?2 XMLHttpRequest
+QMbi`m+iQ` M/ +HH Bib open M/ send K2i?Q/bX

jk3
var req = new XMLHttpRequest () ;
req . open (" GET " , " example / data . txt " , false );
req . send ( null ) ;
console . log ( req . responseText );
// → This is the content of data . txt

h?2 open K2i?Q/ +QM};m`2b i?2 `2[m2biX AM i?Bb +b2- r2 +?QQb2 iQ KF2
 GET `2[m2bi 7Q` i?2 2tKTH2f/iXiti }H2X l_Gb i?i /QMǶi bi`i rBi?
 T`QiQ+QH MK2 Ubm+? b ?iiT,V `2 `2HiBp2- r?B+? K2Mb i?i i?2v
`2 BMi2`T`2i2/ `2HiBp2 iQ i?2 +m``2Mi /Q+mK2MiX q?2M i?2v bi`i rBi?
 bHb? UfV- i?2v `2TH+2 i?2 +m``2Mi Ti?- r?B+? Bb i?2 T`i 7i2` i?2
b2`p2` MK2X q?2M i?2v /Q MQi- i?2 T`i Q7 i?2 +m``2Mi Ti? mT iQ M/
BM+Hm/BM; Bib Hbi bHb? +?`+i2` Bb Tmi BM 7`QMi Q7 i?2 `2HiBp2 l_GX
7i2` QT2MBM; i?2 `2[m2bi- r2 +M b2M/ Bi rBi? i?2 send K2i?Q/X h?2
`;mK2Mi iQ b2M/ Bb i?2 `2[m2bi #Q/vX 6Q` GET `2[m2bib- r2 +M Tbb nullX
A7 i?2 i?B`/ `;mK2Mi iQ open rb false- send rBHH `2im`M QMHv 7i2` i?2
`2bTQMb2 iQ Qm` `2[m2bi rb `2+2Bp2/X q2 +M `2/ i?2 `2[m2bi Q#D2+iǶb
responseText T`QT2`iv iQ ;2i i?2 `2bTQMb2 #Q/vX
h?2 Qi?2` BM7Q`KiBQM BM+Hm/2/ BM i?2 `2bTQMb2 +M HbQ #2 2ti`+i2/
7`QK i?Bb Q#D2+iX h?2 biimb +Q/2 Bb ++2bbB#H2 i?`Qm;? i?2 status T`QT@
2`iv- M/ i?2 ?mKM@`2/#H2 biimb i2ti Bb ++2bbB#H2 i?`Qm;? statusTextX
>2/2`b +M #2 `2/ rBi? getResponseHeaderX
var req = new XMLHttpRequest () ;
req . open (" GET " , " example / data . txt " , false );
req . send ( null ) ;
console . log ( req . status , req . statusText ) ;
// → 200 OK
console . log ( req . getResponseHeader (" content - type ") ) ;
// → text / plain

>2/2` MK2b `2 +b2@BMb2MbBiBp2X h?2v `2 mbmHHv r`Bii2M rBi? 


+TBiH H2ii2` i i?2 bi`i Q7 2+? rQ`/- bm+? b dz*QMi2Mi@hvT2Ǵ- #mi
dz+QMi2Mi@ivT2Ǵ M/ dz+PMh2Li@hvS2Ǵ `272` iQ i?2 bK2 ?2/2`X
h?2 #`Qrb2` rBHH miQKiB+HHv // bQK2 `2[m2bi ?2/2`b- bm+? b
dz>QbiǴ M/ i?Qb2 M22/2/ 7Q` i?2 b2`p2` iQ };m`2 Qmi i?2 bBx2 Q7 i?2 #Q/vX
"mi vQm +M // vQm` QrM ?2/2`b rBi? i?2 setRequestHeader K2i?Q/X
h?Bb Bb M22/2/ QMHv 7Q` /pM+2/ mb2b M/ `2[mB`2b i?2 +QQT2`iBQM Q7
i?2 b2`p2` vQm `2 iHFBM; iQě b2`p2` Bb 7`22 iQ B;MQ`2 ?2/2`b Bi /Q2b

jkN
MQi FMQr ?Qr iQ ?M/H2X

bvM+?`QMQmb _2[m2bib
AM i?2 2tKTH2b r2 br- i?2 `2[m2bi ?b }MBb?2/ r?2M i?2 +HH iQ send `2@
im`MbX h?Bb Bb +QMp2MB2Mi #2+mb2 Bi K2Mb T`QT2`iB2b bm+? b responseText
`2 pBH#H2 BKK2/Bi2HvX "mi Bi HbQ K2Mb i?i Qm` T`Q;`K Bb bmb@
T2M/2/ b HQM; b i?2 #`Qrb2` M/ b2`p2` `2 +QKKmMB+iBM;X q?2M
i?2 +QMM2+iBQM Bb #/- i?2 b2`p2` Bb bHQr- Q` i?2 }H2 Bb #B;- i?i KB;?i
iF2 [mBi2  r?BH2X qQ`b2- #2+mb2 MQ 2p2Mi ?M/H2`b +M }`2 r?BH2 Qm`
T`Q;`K Bb bmbT2M/2/- i?2 r?QH2 /Q+mK2Mi rBHH #2+QK2 mM`2bTQMbBp2X
A7 r2 Tbb true b i?2 i?B`/ `;mK2Mi iQ open- i?2 `2[m2bi Bb bvM@
+?`QMQmbX h?Bb K2Mb i?i r?2M r2 +HH send- i?2 QMHv i?BM; i?i ?T@
T2Mb `B;?i rv Bb i?i i?2 `2[m2bi Bb b+?2/mH2/ iQ #2 b2MiX Pm` T`Q;`K
+M +QMiBMm2- M/ i?2 #`Qrb2` rBHH iF2 +`2 Q7 i?2 b2M/BM; M/ `2+2BpBM;
Q7 /i BM i?2 #+F;`QmM/X
"mi b HQM; b i?2 `2[m2bi Bb `mMMBM;- r2 rQMǶi #2 #H2 iQ ++2bb i?2
`2bTQMb2X q2 M22/  K2+?MBbK i?i rBHH MQiB7v mb r?2M i?2 /i Bb
pBH#H2X
6Q` i?Bb- r2 Kmbi HBbi2M 7Q` i?2 "load" 2p2Mi QM i?2 `2[m2bi Q#D2+iX
var req = new XMLHttpRequest () ;
req . open (" GET " , " example / data . txt " , true );
req . addEventListener (" load " , function () {
console . log (" Done :" , req . status );
}) ;
req . send ( null ) ;

Cmbi HBF2 i?2 mb2 Q7 requestAnimationFrame BM *?Ti2` R8- i?Bb 7Q`+2b mb iQ


mb2 M bvM+?`QMQmb bivH2 Q7 T`Q;`KKBM;- r`TTBM; i?2 i?BM;b i?i
?p2 iQ #2 /QM2 7i2` i?2 `2[m2bi BM  7mM+iBQM M/ ``M;BM; 7Q` i?i iQ
#2 +HH2/ i i?2 TT`QT`Bi2 iBK2X q2 rBHH +QK2 #+F iQ i?Bb Hi2`X

62i+?BM; sJG .i


q?2M i?2 `2bQm`+2 `2i`B2p2/ #v M XMLHttpRequest Q#D2+i Bb M sJG /Q+m@
K2Mi- i?2 Q#D2+iǶb responseXML T`QT2`iv rBHH ?QH/  T`b2/ `2T`2b2MiiBQM

jjy
Q7 i?Bb /Q+mK2MiX h?Bb `2T`2b2MiiBQM rQ`Fb Km+? HBF2 i?2 .PJ /Bb@
+mbb2/ BM *?Ti2` Rj- 2t+2Ti i?i Bi /Q2bMǶi ?p2 >hJG@bT2+B}+ 7mM+@
iBQMHBiv HBF2 i?2 style T`QT2`ivX h?2 Q#D2+i i?i responseXML ?QH/b +Q`@
`2bTQM/b iQ i?2 document Q#D2+iX Aib documentElement T`QT2`iv `272`b iQ i?2
Qmi2` i; Q7 i?2 sJG /Q+mK2MiX AM i?2 7QHHQrBM; /Q+mK2Mi U2tK@
TH2f7`mBiXtKHV- i?i rQmH/ #2 i?2 <fruits> i;,
< fruits >
< fruit name =" banana " color =" yellow "/ >
< fruit name =" lemon " color =" yellow "/ >
< fruit name =" cherry " color =" red "/ >
</ fruits >

q2 +M `2i`B2p2 bm+?  }H2 HBF2 i?Bb,


var req = new XMLHttpRequest () ;
req . open (" GET " , " example / fruit . xml " , false );
req . send ( null ) ;
console . log ( req . responseXML . querySelectorAll (" fruit ") . length ) ;
// → 3

sJG /Q+mK2Mib +M #2 mb2/ iQ 2t+?M;2 bi`m+im`2/ BM7Q`KiBQM rBi?


i?2 b2`p2`X h?2B` 7Q`Kěi;b M2bi2/ BMbB/2 Qi?2` i;běH2M/b Bib2H7 r2HH
iQ biQ`BM; KQbi ivT2b Q7 /i- Q` i H2bi #2ii2` i?M ~i i2ti }H2bX
h?2 .PJ BMi2`7+2 Bb `i?2` +HmKbv 7Q` 2ti`+iBM; BM7Q`KiBQM- i?Qm;?-
M/ sJG /Q+mK2Mib i2M/ iQ #2 p2`#Qb2X Ai Bb Q7i2M  #2ii2` B/2 iQ
+QKKmMB+i2 mbBM; CaPL /i- r?B+? Bb 2bB2` iQ `2/ M/ r`Bi2- #Qi?
7Q` T`Q;`Kb M/ 7Q` ?mKMbX
var req = new XMLHttpRequest () ;
req . open (" GET " , " example / fruit . json ", false );
req . send ( null ) ;
console . log ( JSON . parse ( req . responseText ) ) ;
// → { banana : " yellow " , lemon : " yellow ", cherry : " red "}

>hhS bM/#QtBM;
JFBM; >hhS `2[m2bib BM r2# T;2 b+`BTib QM+2 ;BM `Bb2b +QM+2`Mb
#Qmi b2+m`BivX h?2 T2`bQM r?Q +QMi`QHb i?2 b+`BTi KB;?i MQi ?p2 i?2

jjR
bK2 BMi2`2bib b i?2 T2`bQM QM r?Qb2 +QKTmi2` Bi Bb `mMMBM;X JQ`2
bT2+B}+HHv- B7 A pBbBi i?2K}XQ`;- A /Q MQi rMi Bib b+`BTib iQ #2 #H2
iQ KF2  `2[m2bi iQ Kv#MFX+QK- mbBM; B/2MiB7vBM; BM7Q`KiBQM 7`QK
Kv #`Qrb2`- rBi? BMbi`m+iBQMb iQ i`Mb72` HH Kv KQM2v iQ bQK2 `M/QK
K} ++QmMiX
Ai Bb TQbbB#H2 7Q` r2#bBi2b iQ T`Qi2+i i?2Kb2Hp2b ;BMbi bm+? ii+Fb-
#mi i?i `2[mB`2b 2zQ`i- M/ KMv r2#bBi2b 7BH iQ /Q BiX 6Q` i?Bb `2bQM-
#`Qrb2`b T`Qi2+i mb #v /BbHHQrBM; b+`BTib iQ KF2 >hhS `2[m2bib iQ
Qi?2` /QKBMb UMK2b bm+? b i?2K}XQ`; M/ Kv#MFX+QKVX
h?Bb +M #2 M MMQvBM; T`Q#H2K r?2M #mBH/BM; bvbi2Kb i?i rMi
iQ ++2bb b2p2`H /QKBMb 7Q` H2;BiBKi2 `2bQMbX 6Q`imMi2Hv- b2`p2`b
+M BM+Hm/2  ?2/2` HBF2 i?Bb BM i?2B` `2bTQMb2 iQ 2tTHB+BiHv BM/B+i2 iQ
#`Qrb2`b i?i Bi Bb QFv 7Q` i?2 `2[m2bi iQ +QK2 7`QK Qi?2` /QKBMb,
Access - Control - Allow - Origin : *

#bi`+iBM; `2[m2bib
AM *?Ti2` Ry- BM Qm` BKTH2K2MiiBQM Q7 i?2 J. KQ/mH2 bvbi2K- r2
mb2/  ?vTQi?2iB+H 7mM+iBQM +HH2/ backgroundReadFileX Ai iQQF  }H2MK2
M/  7mM+iBQM M/ +HH2/ i?i 7mM+iBQM rBi? i?2 +QMi2Mib Q7 i?2 }H2
r?2M Bi ?/ }MBb?2/ 72i+?BM; BiX >2`2Ƕb  bBKTH2 BKTH2K2MiiBQM Q7 i?i
7mM+iBQM,
function backgroundReadFile ( url , callback ) {
var req = new XMLHttpRequest () ;
req . open (" GET " , url , true ) ;
req . addEventListener (" load ", function () {
if ( req . status < 400)
callback ( req . responseText ) ;
}) ;
req . send ( null ) ;
}

h?Bb bBKTH2 #bi`+iBQM KF2b Bi 2bB2` iQ mb2 XMLHttpRequest 7Q` bBKTH2


GET `2[m2bibX A7 vQm `2 r`BiBM;  T`Q;`K i?i ?b iQ KF2 >hhS
`2[m2bib- Bi Bb  ;QQ/ B/2 iQ mb2  ?2HT2` 7mM+iBQM bQ i?i vQm /QMǶi 2M/
mT `2T2iBM; i?2 m;Hv XMLHttpRequest Tii2`M HH i?`Qm;? vQm` +Q/2X

jjk
h?2 7mM+iBQM `;mK2MiǶb MK2- callback- Bb  i2`K i?i Bb Q7i2M mb2/ iQ
/2b+`B#2 7mM+iBQMb HBF2 i?BbX  +HH#+F 7mM+iBQM Bb ;Bp2M iQ Qi?2` +Q/2
iQ T`QpB/2 i?i +Q/2 rBi?  rv iQ dz+HH mb #+FǴ Hi2`X
Ai Bb MQi ?`/ iQ r`Bi2 M >hhS miBHBiv 7mM+iBQM- iBHQ`2/ iQ r?i vQm`
TTHB+iBQM Bb /QBM;X h?2 T`2pBQmb QM2 /Q2b QMHv GET `2[m2bib M/ /Q2bMǶi
;Bp2 mb +QMi`QH Qp2` i?2 ?2/2`b Q` i?2 `2[m2bi #Q/vX uQm +QmH/ r`Bi2
MQi?2` p`BMi 7Q` POST `2[m2bib Q`  KQ`2 ;2M2`B+ QM2 i?i bmTTQ`ib p`@
BQmb FBM/b Q7 `2[m2bibX JMv Cpa+`BTi HB#``B2b HbQ T`QpB/2 r`TT2`b
7Q` XMLHttpRequestX
h?2 KBM T`Q#H2K rBi? i?2 T`2pBQmb r`TT2` Bb Bib ?M/HBM; Q7 7BHm`2X
q?2M i?2 `2[m2bi `2im`Mb  biimb +Q/2 i?i BM/B+i2b M 2``Q` U9yy M/
mTV- Bi /Q2b MQi?BM;X h?Bb KB;?i #2 QFv- BM bQK2 +B`+mKbiM+2b- #mi
BK;BM2 r2 Tmi  dzHQ/BM;Ǵ BM/B+iQ` QM i?2 T;2 iQ BM/B+i2 i?i r2 `2
72i+?BM; BM7Q`KiBQMX A7 i?2 `2[m2bi 7BHb #2+mb2 i?2 b2`p2` +`b?2/ Q` i?2
+QMM2+iBQM Bb #`B2~v BMi2``mTi2/- i?2 T;2 rBHH Dmbi bBi i?2`2- KBbH2/BM;Hv
HQQFBM; HBF2 Bi Bb /QBM; bQK2i?BM;X h?2 mb2` rBHH rBi 7Q`  r?BH2- ;2i
BKTiB2Mi- M/ +QMbB/2` i?2 bBi2 mb2H2bbHv ~FvX
q2 b?QmH/ HbQ ?p2 M QTiBQM iQ #2 MQiB}2/ r?2M i?2 `2[m2bi 7BHb bQ
i?i r2 +M iF2 TT`QT`Bi2 +iBQMX 6Q` 2tKTH2- r2 +QmH/ `2KQp2 i?2
dzHQ/BM;Ǵ K2bb;2 M/ BM7Q`K i?2 mb2` i?i bQK2i?BM; r2Mi r`QM;X
1``Q` ?M/HBM; BM bvM+?`QMQmb +Q/2 Bb 2p2M i`B+FB2` i?M 2``Q` ?M@
/HBM; BM bvM+?`QMQmb +Q/2X "2+mb2 r2 Q7i2M M22/ iQ /272` T`i Q7 Qm`
rQ`F- TmiiBM; Bi BM  +HH#+F 7mM+iBQM- i?2 b+QT2 Q7  try #HQ+F #2+QK2b
K2MBM;H2bbX AM i?2 7QHHQrBM; +Q/2- i?2 2t+2TiBQM rBHH MQi #2 +m;?i
#2+mb2 i?2 +HH iQ backgroundReadFile `2im`Mb BKK2/Bi2HvX *QMi`QH i?2M
H2p2b i?2 try #HQ+F- M/ i?2 7mM+iBQM Bi rb ;Bp2M rQMǶi #2 +HH2/ mMiBH
Hi2`X
try {
backgroundReadFile (" example / data . txt ", function ( text ) {
if ( text != " expected ")
throw new Error (" That was unexpected ") ;
}) ;
} catch (e ) {
console . log (" Hello from the catch block ") ;
}

jjj
hQ ?M/H2 7BHBM; `2[m2bib- r2 ?p2 iQ HHQr M //BiBQMH 7mM+iBQM iQ #2
Tbb2/ iQ Qm` r`TT2` M/ +HH i?i r?2M  `2[m2bi ;Q2b r`QM;X Hi2`M@
iBp2Hv- r2 +M mb2 i?2 +QMp2MiBQM i?i B7 i?2 `2[m2bi 7BHb- M //BiBQMH
`;mK2Mi /2b+`B#BM; i?2 T`Q#H2K Bb Tbb2/ iQ i?2 `2;mH` +HH#+F 7mM+@
iBQMX >2`2Ƕb M 2tKTH2,
function getURL ( url , callback ) {
var req = new XMLHttpRequest () ;
req . open (" GET " , url , true ) ;
req . addEventListener (" load ", function () {
if ( req . status < 400)
callback ( req . responseText ) ;
else
callback ( null , new Error (" Request failed : " +
req . statusText ));
}) ;
req . addEventListener (" error ", function () {
callback ( null , new Error (" Network error ") );
}) ;
req . send ( null ) ;
}

q2 ?p2 //2/  ?M/H2` 7Q` i?2 "error" 2p2Mi- r?B+? rBHH #2 bB;MH2/
r?2M i?2 `2[m2bi 7BHb 2MiB`2HvX q2 HbQ +HH i?2 +HH#+F 7mM+iBQM rBi?
M 2``Q` `;mK2Mi r?2M i?2 `2[m2bi +QKTH2i2b rBi?  biimb +Q/2 i?i
BM/B+i2b M 2``Q`X
*Q/2 mbBM; getURL Kmbi i?2M +?2+F r?2i?2` M 2``Q` rb ;Bp2M M/- B7
Bi }M/b QM2- ?M/H2 BiX
getURL (" data / nonsense . txt ", function ( content , error ) {
if ( error != null )
console . log (" Failed to fetch nonsense . txt : " + error ) ;
else
console . log (" nonsense . txt : " + content ) ;
}) ;

h?Bb /Q2b MQi ?2HT r?2M Bi +QK2b iQ 2t+2TiBQMbX q?2M +?BMBM; b2p2`H
bvM+?`QMQmb +iBQMb iQ;2i?2`- M 2t+2TiBQM i Mv TQBMi Q7 i?2 +?BM
rBHH biBHH UmMH2bb vQm r`T 2+? ?M/HBM; 7mM+iBQM BM Bib QrM try/catch
#HQ+FV HM/ i i?2 iQT H2p2H M/ #Q`i vQm` +?BM Q7 +iBQMbX

jj9
S`QKBb2b
6Q` +QKTHB+i2/ T`QD2+ib- r`BiBM; bvM+?`QMQmb +Q/2 BM THBM +HH#+F
bivH2 Bb ?`/ iQ /Q +Q``2+iHvX Ai Bb 2bv iQ 7Q`;2i iQ +?2+F 7Q` M 2``Q` Q` iQ
HHQr M mM2tT2+i2/ 2t+2TiBQM iQ +mi i?2 T`Q;`K b?Q`i BM  +`m/2 rvX
//BiBQMHHv- ``M;BM; 7Q` +Q``2+i 2``Q` ?M/HBM; r?2M i?2 2``Q` ?b iQ
~Qr i?`Qm;? KmHiBTH2 +HH#+F 7mM+iBQMb M/ catch #HQ+Fb Bb i2/BQmbX
h?2`2 ?p2 #22M  HQi Q7 ii2KTib iQ bQHp2 i?Bb rBi? 2ti` #bi`+iBQMbX
PM2 Q7 i?2 KQ`2 bm++2bb7mH QM2b Bb +HH2/ T`QKBb2bX S`QKBb2b r`T M
bvM+?`QMQmb +iBQM BM M Q#D2+i- r?B+? +M #2 Tbb2/ `QmM/ M/ iQH/
iQ /Q +2`iBM i?BM;b r?2M i?2 +iBQM }MBb?2b Q` 7BHbX h?Bb BMi2`7+2 Bb
b2i iQ #2+QK2 T`i Q7 i?2 M2ti p2`bBQM Q7 i?2 Cpa+`BTi HM;m;2 #mi
+M H`2/v #2 mb2/ b  HB#``vX
h?2 BMi2`7+2 7Q` T`QKBb2b BbMǶi 2MiB`2Hv BMimBiBp2- #mi Bi Bb TQr2`7mHX
h?Bb +?Ti2` rBHH QMHv `Qm;?Hv /2b+`B#2 BiX uQm +M }M/  KQ`2 i?Q`Qm;?
i`2iK2Mi i rrrXT`QKBb2DbXQ`;X
hQ +`2i2  T`QKBb2 Q#D2+i- r2 +HH i?2 Promise +QMbi`m+iQ`- ;BpBM; Bi 
7mM+iBQM i?i BMBiBHBx2b i?2 bvM+?`QMQmb +iBQMX h?2 +QMbi`m+iQ` +HHb
i?i 7mM+iBQM- TbbBM; Bi irQ `;mK2Mib- r?B+? `2 i?2Kb2Hp2b 7mM+iBQMbX
h?2 }`bi b?QmH/ #2 +HH2/ r?2M i?2 +iBQM }MBb?2b bm++2bb7mHHv- M/ i?2
b2+QM/ b?QmH/ #2 +HH2/ r?2M Bi 7BHbX
PM+2 ;BM- ?2`2 Bb Qm` r`TT2` 7Q` GET `2[m2bib- i?Bb iBK2 `2im`MBM; 
T`QKBb2X q2ǶHH bBKTHv +HH Bi get i?Bb iBK2X
function get ( url ) {
return new Promise ( function ( succeed , fail ) {
var req = new XMLHttpRequest () ;
req . open (" GET " , url , true ) ;
req . addEventListener (" load " , function () {
if ( req . status < 400)
succeed ( req . responseText ) ;
else
fail ( new Error (" Request failed : " + req . statusText ) ) ;
}) ;
req . addEventListener (" error " , function () {
fail ( new Error (" Network error ") ) ;
}) ;
req . send ( null ) ;
}) ;

jj8
}

LQi2 i?i i?2 BMi2`7+2 iQ i?2 7mM+iBQM Bib2H7 Bb MQr  HQi bBKTH2`X uQm
;Bp2 Bi  l_G- M/ Bi `2im`Mb  T`QKBb2X h?i T`QKBb2 +ib b  ?M/H2
iQ i?2 `2[m2biǶb Qmi+QK2X Ai ?b  then K2i?Q/ i?i vQm +M +HH rBi?
irQ 7mM+iBQMb, QM2 iQ ?M/H2 bm++2bb M/ QM2 iQ ?M/H2 7BHm`2X
get (" example / data . txt ") . then ( function ( text ) {
console . log (" data . txt : " + text );
}, function ( error ) {
console . log (" Failed to fetch data . txt : " + error ) ;
}) ;

aQ 7`- i?Bb Bb Dmbi MQi?2` rv iQ 2tT`2bb i?2 bK2 i?BM; r2 H`2/v 2t@
T`2bb2/X Ai Bb QMHv r?2M vQm M22/ iQ +?BM +iBQMb iQ;2i?2` i?i T`QKBb2b
KF2  bB;MB}+Mi /Bz2`2M+2X
*HHBM; then T`Q/m+2b  M2r T`QKBb2- r?Qb2 `2bmHi Ui?2 pHm2 Tbb2/
iQ bm++2bb ?M/H2`bV /2T2M/b QM i?2 `2im`M pHm2 Q7 i?2 }`bi 7mM+iBQM r2
Tbb2/ iQ thenX h?Bb 7mM+iBQM Kv `2im`M MQi?2` T`QKBb2 iQ BM/B+i2
i?i KQ`2 bvM+?`QMQmb rQ`F Bb #2BM; /QM2X AM i?Bb +b2- i?2 T`QKBb2
`2im`M2/ #v then Bib2H7 rBHH rBi 7Q` i?2 T`QKBb2 `2im`M2/ #v i?2 ?M/H2`
7mM+iBQM- bm++22/BM; Q` 7BHBM; rBi? i?2 bK2 pHm2 r?2M Bi Bb `2bQHp2/X
q?2M i?2 ?M/H2` 7mM+iBQM `2im`Mb  MQMT`QKBb2 pHm2- i?2 T`QKBb2
`2im`M2/ #v then BKK2/Bi2Hv bm++22/b rBi? i?i pHm2 b Bib `2bmHiX
h?Bb K2Mb vQm +M mb2 then iQ i`Mb7Q`K i?2 `2bmHi Q7  T`QKBb2X 6Q`
2tKTH2- i?Bb `2im`Mb  T`QKBb2 r?Qb2 `2bmHi Bb i?2 +QMi2Mi Q7 i?2 ;Bp2M
l_G- T`b2/ b CaPL,
function getJSON ( url ) {
return get ( url ) . then ( JSON . parse );
}

h?i Hbi +HH iQ then /B/ MQi bT2+B7v  7BHm`2 ?M/H2`X h?Bb Bb HHQr2/X
h?2 2``Q` rBHH #2 Tbb2/ iQ i?2 T`QKBb2 `2im`M2/ #v then- r?B+? Bb 2t+iHv
r?i r2 rMiěgetJSON /Q2b MQi FMQr r?i iQ /Q r?2M bQK2i?BM; ;Q2b
r`QM;- #mi ?QT27mHHv Bib +HH2` /Q2bX
b M 2tKTH2 i?i b?Qrb i?2 mb2 Q7 T`QKBb2b- r2 rBHH #mBH/  T`Q;`K
i?i 72i+?2b  MmK#2` Q7 CaPL }H2b 7`QK i?2 b2`p2` M/- r?BH2 Bi Bb /QBM;
i?i- b?Qrb i?2 rQ`/ HQ/BM;X h?2 CaPL }H2b +QMiBM BM7Q`KiBQM #Qmi
T2QTH2- rBi? HBMFb iQ }H2b i?i `2T`2b2Mi Qi?2` T2QTH2 BM T`QT2`iB2b bm+?

jje
b father- mother- Q` spouseX
q2 rMi iQ ;2i i?2 MK2 Q7 i?2 KQi?2` Q7 i?2 bTQmb2 Q7 2tKTH2f#2`iXDbQMX
M/ B7 bQK2i?BM; ;Q2b r`QM;- r2 rMi iQ `2KQp2 i?2 HQ/BM; i2ti M/
b?Qr M 2``Q` K2bb;2 BMbi2/X >2`2 Bb ?Qr i?i KB;?i #2 /QM2 rBi?
T`QKBb2b,
< script >
function showMessage ( msg ) {
var elt = document . createElement (" div ") ;
elt . textContent = msg ;
return document . body . appendChild ( elt ) ;
}

var loading = showMessage (" Loading ...") ;


getJSON (" example / bert . json ") . then ( function ( bert ) {
return getJSON ( bert . spouse ) ;
}) . then ( function ( spouse ) {
return getJSON ( spouse . mother );
}) . then ( function ( mother ) {
showMessage (" The name is " + mother . name ) ;
}) . catch ( function ( error ) {
showMessage ( String ( error )) ;
}) . then ( function () {
document . body . removeChild ( loading );
}) ;
</ script >

h?2 `2bmHiBM; T`Q;`K Bb `2HiBp2Hv +QKT+i M/ `2/#H2X h?2 catch


K2i?Q/ Bb bBKBH` iQ then- 2t+2Ti i?i Bi QMHv 2tT2+ib  7BHm`2 ?M/H2`
M/ rBHH Tbb i?`Qm;? i?2 `2bmHi mMKQ/B}2/ BM +b2 Q7 bm++2bbX Jm+?
HBF2 rBi? i?2 catch +Hmb2 7Q` i?2 try bii2K2Mi- +QMi`QH rBHH +QMiBMm2
b MQ`KH 7i2` i?2 7BHm`2 Bb +m;?iX h?i rv- i?2 }MH then- r?B+?
`2KQp2b i?2 HQ/BM; K2bb;2- Bb Hrvb 2t2+mi2/- 2p2M B7 bQK2i?BM; r2Mi
r`QM;X
uQm +M i?BMF Q7 i?2 T`QKBb2 BMi2`7+2 b BKTH2K2MiBM; Bib QrM HM@
;m;2 7Q` bvM+?`QMQmb +QMi`QH ~QrX h?2 2ti` K2i?Q/ +HHb M/ 7mM+@
iBQM 2tT`2bbBQMb M22/2/ iQ +?B2p2 i?Bb KF2 i?2 +Q/2 HQQF bQK2r?i
rFr`/ #mi MQi `2KQi2Hv b rFr`/ b Bi rQmH/ HQQF B7 r2 iQQF +`2
Q7 HH i?2 2``Q` ?M/HBM; Qm`b2Hp2bX

jjd
TT`2+BiBM; >hhS
q?2M #mBH/BM;  bvbi2K i?i `2[mB`2b +QKKmMB+iBQM #2ir22M  Cpa+`BTi
T`Q;`K `mMMBM; BM i?2 #`Qrb2` U+HB2Mi@bB/2V M/  T`Q;`K QM  b2`p2`
Ub2`p2`@bB/2V- i?2`2 `2 b2p2`H /Bz2`2Mi rvb iQ KQ/2H i?Bb +QKKmMB+@
iBQMX
 +QKKQMHv mb2/ KQ/2H Bb i?i Q7 `2KQi2 T`Q+2/m`2 +HHbX AM i?Bb
KQ/2H- +QKKmMB+iBQM 7QHHQrb i?2 Tii2`Mb Q7 MQ`KH 7mM+iBQM +HHb- 2t@
+2Ti i?i i?2 7mM+iBQM Bb +imHHv `mMMBM; QM MQi?2` K+?BM2X *HHBM;
Bi BMpQHp2b KFBM;  `2[m2bi iQ i?2 b2`p2` i?i BM+Hm/2b i?2 7mM+iBQMǶb
MK2 M/ `;mK2MibX h?2 `2bTQMb2 iQ i?i `2[m2bi +QMiBMb i?2 `2im`M2/
pHm2X
q?2M i?BMFBM; BM i2`Kb Q7 `2KQi2 T`Q+2/m`2 +HHb- >hhS Bb Dmbi 
p2?B+H2 7Q` +QKKmMB+iBQM- M/ vQm rBHH KQbi HBF2Hv r`Bi2 M #bi`+iBQM
Hv2` i?i ?B/2b Bi 2MiB`2HvX
MQi?2` TT`Q+? Bb iQ #mBH/ vQm` +QKKmMB+iBQM `QmM/ i?2 +QM+2Ti
Q7 `2bQm`+2b M/ >hhS K2i?Q/bX AMbi2/ Q7  `2KQi2 T`Q+2/m`2 +HH2/
addUser- vQm mb2  PUT `2[m2bi iQ /users/larryX AMbi2/ Q7 2M+Q/BM; i?i
mb2`Ƕb T`QT2`iB2b BM 7mM+iBQM `;mK2Mib- vQm /2}M2  /Q+mK2Mi 7Q`Ki Q`
mb2 M 2tBbiBM; 7Q`Ki i?i `2T`2b2Mib  mb2`X h?2 #Q/v Q7 i?2 PUT `2[m2bi
iQ +`2i2  M2r `2bQm`+2 Bb i?2M bBKTHv bm+?  /Q+mK2MiX  `2bQm`+2
Bb 72i+?2/ #v KFBM;  GET `2[m2bi iQ i?2 `2bQm`+2Ƕb l_G U7Q` 2tKTH2-
/user/larryV- r?B+? `2im`Mb i?2 /Q+mK2Mi `2T`2b2MiBM; i?2 `2bQm`+2X
h?Bb b2+QM/ TT`Q+? KF2b Bi 2bB2` iQ mb2 bQK2 Q7 i?2 72im`2b i?i
>hhS T`QpB/2b- bm+? b bmTTQ`i 7Q` ++?BM; `2bQm`+2b UF22TBM;  +QTv
QM i?2 +HB2Mi bB/2VX Ai +M HbQ ?2HT i?2 +Q?2`2M+2 Q7 vQm` BMi2`7+2 bBM+2
`2bQm`+2b `2 2bB2` iQ `2bQM #Qmi i?M  DmK#H2 Q7 7mM+iBQMbX

a2+m`Biv M/ >hhSa


.i i`p2HBM; Qp2` i?2 AMi2`M2i i2M/b iQ 7QHHQr  HQM;- /M;2`Qmb `Q/X
hQ ;2i iQ Bib /2biBMiBQM- Bi Kmbi ?QT i?`Qm;? Mvi?BM; 7`QK +Qz22@b?QT
qB@6B M2irQ`Fb iQ M2irQ`Fb +QMi`QHH2/ #v p`BQmb +QKTMB2b M/ bii2bX
i Mv TQBMi HQM; Bib `Qmi2 Bi Kv #2 BMbT2+i2/ Q` 2p2M KQ/B}2/X
A7 Bi Bb BKTQ`iMi i?i bQK2i?BM; `2KBM b2+`2i- bm+? b i?2 TbbrQ`/
iQ vQm` 2KBH ++QmMi- Q` i?i Bi ``Bp2 i Bib /2biBMiBQM mMKQ/B}2/-

jj3
bm+? b i?2 ++QmMi MmK#2` vQm i`Mb72` KQM2v iQ 7`QK vQm` #MFǶb
r2#bBi2- THBM >hhS Bb MQi ;QQ/ 2MQm;?X
h?2 b2+m`2 >hhS T`QiQ+QH- r?Qb2 l_Gb bi`i rBi? ?iiTb,ff- r`Tb
>hhS i`{+ BM  rv i?i KF2b Bi ?`/2` iQ `2/ M/ iKT2` rBi?X
6B`bi- i?2 +HB2Mi p2`B}2b i?i i?2 b2`p2` Bb r?Q Bi +HBKb iQ #2 #v `2[mB`BM;
i?i b2`p2` iQ T`Qp2 i?i Bi ?b  +`vTiQ;`T?B+ +2`iB}+i2 Bbbm2/ #v  +2`@
iB}+i2 mi?Q`Biv i?i i?2 #`Qrb2` `2+Q;MBx2bX L2ti- HH /i ;QBM; Qp2`
i?2 +QMM2+iBQM Bb 2M+`vTi2/ BM  rv i?i b?QmH/ T`2p2Mi 2p2b/`QTTBM;
M/ iKT2`BM;X
h?mb- r?2M Bi rQ`Fb `B;?i- >hhSa T`2p2Mib #Qi? i?2 bQK2QM2 BK@
T2`bQMiBM; i?2 r2#bBi2 vQm r2`2 i`vBM; iQ iHF iQ M/ i?2 bQK2QM2
bMQQTBM; QM vQm` +QKKmMB+iBQMX Ai Bb MQi T2`72+i- M/ i?2`2 ?p2 #22M
p`BQmb BM+B/2Mib r?2`2 >hhSa 7BH2/ #2+mb2 Q7 7Q`;2/ Q` biQH2M +2`@
iB}+i2b M/ #`QF2M bQ7ir`2X aiBHH- THBM >hhS Bb i`BpBH iQ K2bb rBi?-
r?2`2b #`2FBM; >hhSa `2[mB`2b i?2 FBM/ Q7 2zQ`i i?i QMHv bii2b Q`
bQT?BbiB+i2/ +`BKBMH Q`;MBxiBQMb +M ?QT2 iQ KF2X

amKK`v
AM i?Bb +?Ti2`- r2 br i?i >hhS Bb  T`QiQ+QH 7Q` ++2bbBM; `2bQm`+2b
Qp2` i?2 AMi2`M2iX  +HB2Mi b2M/b  `2[m2bi- r?B+? +QMiBMb  K2i?Q/
UmbmHHv GETV M/  Ti? i?i B/2MiB}2b  `2bQm`+2X h?2 b2`p2` i?2M
/2+B/2b r?i iQ /Q rBi? i?2 `2[m2bi M/ `2bTQM/b rBi?  biimb +Q/2
M/  `2bTQMb2 #Q/vX "Qi? `2[m2bib M/ `2bTQMb2b Kv +QMiBM ?2/2`b
i?i T`QpB/2 //BiBQMH BM7Q`KiBQMX
"`Qrb2`b KF2 GET `2[m2bib iQ 72i+? i?2 `2bQm`+2b M22/2/ iQ /BbTHv 
r2# T;2X  r2# T;2 Kv HbQ +QMiBM 7Q`Kb- r?B+? HHQr BM7Q`KiBQM
2Mi2`2/ #v i?2 mb2` iQ #2 b2Mi HQM; BM i?2 `2[m2bi K/2 r?2M i?2 7Q`K
Bb bm#KBii2/X uQm rBHH H2`M KQ`2 #Qmi i?i BM i?2 M2ti +?Ti2`X
h?2 BMi2`7+2 i?`Qm;? r?B+? #`Qrb2` Cpa+`BTi +M KF2 >hhS `2@
[m2bib Bb +HH2/ XMLHttpRequestX uQm +M mbmHHv B;MQ`2 i?2 dzsJGǴ T`i
Q7 i?i MK2 U#mi vQm biBHH ?p2 iQ ivT2 BiVX h?2`2 `2 irQ rvb BM
r?B+? Bi +M #2 mb2/ěbvM+?`QMQmb- r?B+? #HQ+Fb 2p2`vi?BM; mMiBH i?2
`2[m2bi }MBb?2b- M/ bvM+?`QMQmb- r?B+? `2[mB`2b M 2p2Mi ?M/H2` iQ
MQiB+2 i?i i?2 `2bTQMb2 +K2 BMX AM HKQbi HH +b2b- bvM+?`QMQmb Bb
T`272`#H2X JFBM;  `2[m2bi HQQFb HBF2 i?Bb,

jjN
var req = new XMLHttpRequest () ;
req . open (" GET " , " example / data . txt " , true );
req . addEventListener (" load " , function () {
console . log ( req . status ) ;
}) ;
req . send ( null ) ;

bvM+?`QMQmb T`Q;`KKBM; Bb i`B+FvX S`QKBb2b `2 M BMi2`7+2 i?i


KF2b Bi bHB;?iHv 2bB2` #v ?2HTBM; `Qmi2 2``Q` +QM/BiBQMb M/ 2t+2TiBQMb
iQ i?2 `B;?i ?M/H2` M/ #v #bi`+iBM; rv bQK2 Q7 i?2 KQ`2 `2T2iBiBp2
M/ 2``Q`@T`QM2 2H2K2Mib BM i?Bb bivH2 Q7 T`Q;`KKBM;X

1t2`+Bb2b
*QMi2Mi M2;QiBiBQM
PM2 Q7 i?2 i?BM;b i?i >hhS +M /Q- #mi i?i r2 ?p2 MQi /Bb+mbb2/
BM i?Bb +?Ti2`- Bb +HH2/ +QMi2Mi M2;QiBiBQMX h?2 Accept ?2/2` 7Q` 
`2[m2bi +M #2 mb2/ iQ i2HH i?2 b2`p2` r?i ivT2 Q7 /Q+mK2Mi i?2 +HB2Mi
rQmH/ HBF2 iQ ;2iX JMv b2`p2`b B;MQ`2 i?Bb ?2/2`- #mi r?2M  b2`p2`
FMQrb Q7 p`BQmb rvb iQ 2M+Q/2  `2bQm`+2- Bi +M HQQF i i?Bb ?2/2`
M/ b2M/ i?2 QM2 i?i i?2 +HB2Mi T`272`bX
h?2 l_G 2HQ[m2MiDpb+`BTiXM2ifmi?Q` Bb +QM};m`2/ iQ `2bTQM/ rBi?
2Bi?2` THBMi2ti- >hJG- Q` CaPL- /2T2M/BM; QM r?i i?2 +HB2Mi bFb 7Q`X
h?2b2 7Q`Kib `2 B/2MiB}2/ #v i?2 biM/`/Bx2/ K2/B ivT2b text/plain-
text/html- M/ application/jsonX
a2M/ `2[m2bib iQ 72i+? HH i?`22 7Q`Kib Q7 i?Bb `2bQm`+2X lb2 i?2
setRequestHeader K2i?Q/ Q7 vQm` XMLHttpRequest Q#D2+i iQ b2i i?2 ?2/2`
MK2/ Accept iQ QM2 Q7 i?2 K2/B ivT2b ;Bp2M 2`HB2`X JF2 bm`2 vQm b2i
i?2 ?2/2` 7i2` +HHBM; open #mi #27Q`2 +HHBM; sendX
6BMHHv- i`v bFBM; 7Q` i?2 K2/B ivT2 application/rainbows+unicorns M/
b22 r?i ?TT2MbX

qBiBM; 7Q` KmHiBTH2 T`QKBb2b


h?2 Promise +QMbi`m+iQ` ?b M all K2i?Q/ i?i- ;Bp2M M ``v Q7 T`QKBb2b-
`2im`Mb  T`QKBb2 i?i rBib 7Q` HH Q7 i?2 T`QKBb2b BM i?2 ``v iQ }MBb?X
Ai i?2M bm++22/b- vB2H/BM; M ``v Q7 `2bmHi pHm2bX A7 Mv Q7 i?2 T`QKBb2b

j9y
BM i?2 ``v 7BH- i?2 T`QKBb2 `2im`M2/ #v all 7BHb iQQ UrBi? i?2 7BHm`2
pHm2 7`QK i?2 7BHBM; T`QKBb2VX
h`v iQ BKTH2K2Mi bQK2i?BM; HBF2 i?Bb vQm`b2H7 b  `2;mH` 7mM+iBQM
+HH2/ allX
LQi2 i?i 7i2`  T`QKBb2 Bb `2bQHp2/ U?b bm++22/2/ Q` 7BH2/V- Bi +MǶi
bm++22/ Q` 7BH ;BM- M/ 7m`i?2` +HHb iQ i?2 7mM+iBQMb i?i `2bQHp2 Bi `2
B;MQ`2/X h?Bb +M bBKTHB7v i?2 rv vQm ?M/H2 7BHm`2 Q7 vQm` T`QKBb2X

j9R
dzA b?HH i?Bb p2`v /v- i .Q+iQ`Ƕb 72bi-
Jv #QmM/2M b2`pB+2 /mHv Tv i?22X
"mi QM2 i?BM;5ě6Q` BMbm`M+2Ƕ bF2- A T`v i?22-
:`Mi K2  HBM2 Q` irQ- i H2biXǴ
ěJ2T?BbiQT?2H2b- BM :Q2i?2Ƕb 6mbi

R3 6Q`Kb M/ 6Q`K 6B2H/b


6Q`Kb r2`2 BMi`Q/m+2/ #`B2~v BM i?2 T`2pBQmb +?Ti2` b  rv iQ bm#KBi
BM7Q`KiBQM T`QpB/2/ #v i?2 mb2` Qp2` >hhSX h?2v r2`2 /2bB;M2/ 7Q` 
T`2@Cpa+`BTi q2#- bbmKBM; i?i BMi2`+iBQM rBi? i?2 b2`p2` Hrvb
?TT2Mb #v MpB;iBM; iQ  M2r T;2X
"mi i?2B` 2H2K2Mib `2 T`i Q7 i?2 .PJ HBF2 i?2 `2bi Q7 i?2 T;2-
M/ i?2 .PJ 2H2K2Mib i?i `2T`2b2Mi 7Q`K }2H/b bmTTQ`i  MmK#2` Q7
T`QT2`iB2b M/ 2p2Mib i?i `2 MQi T`2b2Mi QM Qi?2` 2H2K2MibX h?2b2
KF2 Bi TQbbB#H2 iQ BMbT2+i M/ +QMi`QH bm+? BMTmi }2H/b rBi? Cpa+`BTi
T`Q;`Kb M/ /Q i?BM;b bm+? b //BM; 7mM+iBQMHBiv iQ  i`/BiBQMH 7Q`K
Q` mbBM; 7Q`Kb M/ }2H/b b #mBH/BM; #HQ+Fb BM  Cpa+`BTi TTHB+iBQMX

6B2H/b
 r2# 7Q`K +QMbBbib Q7 Mv MmK#2` Q7 BMTmi }2H/b ;`QmT2/ BM  <form>
i;X >hJG HHQrb  MmK#2` Q7 /Bz2`2Mi bivH2b Q7 }2H/b- `M;BM; 7`QK
bBKTH2 QMfQz +?2+F#Qt2b iQ /`QT@/QrM K2Mmb M/ }2H/b 7Q` i2ti BMTmiX
h?Bb #QQF rQMǶi i`v iQ +QKT`2?2MbBp2Hv /Bb+mbb HH }2H/ ivT2b- #mi r2
rBHH bi`i rBi?  `Qm;? Qp2`pB2rX
 HQi Q7 }2H/ ivT2b mb2 i?2 <input> i;X h?Bb i;Ƕb type ii`B#mi2 Bb mb2/
iQ b2H2+i i?2 }2H/Ƕb bivH2X h?2b2 `2 bQK2 +QKKQMHv mb2/ <input> ivT2b,
text  bBM;H2@HBM2 i2ti }2H/
password aK2 b text #mi ?B/2b i?2 i2ti i?i Bb ivT2/
checkbox M QMfQz brBi+?
radio US`i Q7V  KmHiBTH2@+?QB+2 }2H/
file HHQrb i?2 mb2` iQ +?QQb2  }H2 7`QK i?2B` +QKTmi2`
6Q`K }2H/b /Q MQi M2+2bb`BHv ?p2 iQ TT2` BM  <form> i;X uQm +M
Tmi i?2K Mvr?2`2 BM  T;2X am+? }2H/b +MMQi #2 bm#KBii2/ UQMHv 
7Q`K b  r?QH2 +MV- #mi r?2M `2bTQM/BM; iQ BMTmi rBi? Cpa+`BTi- r2
Q7i2M /Q MQi rMi iQ bm#KBi Qm` }2H/b MQ`KHHv MvrvX

j9k
<p > < input type =" text " value =" abc " > ( text ) </p >
<p > < input type =" password " value =" abc " > ( password ) </p >
<p > < input type =" checkbox " checked > ( checkbox ) </p >
<p > < input type =" radio " value =" A" name =" choice " >
< input type =" radio " value =" B" name =" choice " checked >
< input type =" radio " value =" C" name =" choice " > ( radio ) </p >
<p > < input type =" file " > ( file ) </p >

h?2 }2H/b +`2i2/ rBi? i?Bb >hJG +Q/2 HQQF HBF2 i?Bb,

h?2 Cpa+`BTi BMi2`7+2 7Q` bm+? 2H2K2Mib /Bz2`b rBi? i?2 ivT2 Q7 i?2
2H2K2MiX q2ǶHH ;Q Qp2` 2+? Q7 i?2K Hi2` BM i?2 +?Ti2`X
JmHiBHBM2 i2ti }2H/b ?p2 i?2B` QrM i;- <textarea>- KQbiHv #2+mb2 mb@
BM; M ii`B#mi2 iQ bT2+B7v  KmHiBHBM2 bi`iBM; pHm2 rQmH/ #2 rFr`/X
h?2 <textarea> `2[mB`2b  Ki+?BM; </textarea> +HQbBM; i; M/ mb2b i?2
i2ti #2ir22M i?Qb2 irQ- BMbi2/ Q7 mbBM; Bib value ii`B#mi2- b bi`iBM;
i2tiX
< textarea >
one
two
three
</ textarea >

6BMHHv- i?2 <select> i; Bb mb2/ iQ +`2i2  }2H/ i?i HHQrb i?2 mb2` iQ
b2H2+i 7`QK  MmK#2` Q7 T`2/2}M2/ QTiBQMbX
< select >
< option > Pancakes </ option >
< option > Pudding </ option >
< option > Ice cream </ option >
</ select >

j9j
am+?  }2H/ HQQFb HBF2 i?Bb,

q?2M2p2` i?2 pHm2 Q7  7Q`K }2H/ +?M;2b- Bi }`2b  "change" 2p2MiX

6Q+mb
lMHBF2 KQbi 2H2K2Mib BM M >hJG /Q+mK2Mi- 7Q`K }2H/b +M ;2i F2v@
#Q`/ 7Q+mbX q?2M +HB+F2/ěQ` +iBpi2/ BM bQK2 Qi?2` rvěi?2v #2@
+QK2 i?2 +m``2MiHv +iBp2 2H2K2Mi- i?2 KBM `2+BTB2Mi Q7 F2v#Q`/ BMTmiX
A7  /Q+mK2Mi ?b  i2ti }2H/- i2ti ivT2/ rBHH 2M/ mT BM i?2`2 QMHv r?2M
i?2 }2H/ Bb 7Q+mb2/X Pi?2` }2H/b `2bTQM/ /Bz2`2MiHv iQ F2v#Q`/ 2p2MibX
6Q` 2tKTH2-  <select> K2Mm i`B2b iQ KQp2 iQ i?2 QTiBQM i?i +QMiBMb
i?2 i2ti i?2 mb2` ivT2/ M/ `2bTQM/b iQ i?2 ``Qr F2vb #v KQpBM; Bib
b2H2+iBQM mT M/ /QrMX
q2 +M +QMi`QH 7Q+mb 7`QK Cpa+`BTi rBi? i?2 focus M/ blur K2i?Q/bX
h?2 }`bi KQp2b 7Q+mb iQ i?2 .PJ 2H2K2Mi Bi Bb +HH2/ QM- M/ i?2 b2+QM/
`2KQp2b 7Q+mbX h?2 pHm2 BM document.activeElement +Q``2bTQM/b iQ i?2
+m``2MiHv 7Q+mb2/ 2H2K2MiX
< input type =" text " >
< script >
document . querySelector (" input ") . focus () ;
console . log ( document . activeElement . tagName ) ;
// → INPUT
document . querySelector (" input ") . blur () ;
console . log ( document . activeElement . tagName ) ;
// → BODY
</ script >

6Q` bQK2 T;2b- i?2 mb2` Bb 2tT2+i2/ iQ rMi iQ BMi2`+i rBi?  7Q`K
}2H/ BKK2/Bi2HvX Cpa+`BTi +M #2 mb2/ iQ 7Q+mb i?Bb }2H/ r?2M i?2
/Q+mK2Mi Bb HQ/2/- #mi >hJG HbQ T`QpB/2b i?2 autofocus ii`B#mi2-
r?B+? T`Q/m+2b i?2 bK2 2z2+i #mi H2ib i?2 #`Qrb2` FMQr r?i r2 `2
i`vBM; iQ +?B2p2X h?Bb KF2b Bi TQbbB#H2 7Q` i?2 #`Qrb2` iQ /Bb#H2 i?2
#2?pBQ` r?2M Bi Bb MQi TT`QT`Bi2- bm+? b r?2M i?2 mb2` ?b 7Q+mb2/

j99
bQK2i?BM; 2Hb2X
< input type =" text " autofocus >

"`Qrb2`b i`/BiBQMHHv HbQ HHQr i?2 mb2` iQ KQp2 i?2 7Q+mb i?`Qm;?
i?2 /Q+mK2Mi #v T`2bbBM; i?2 h# F2vX q2 +M BM~m2M+2 i?2 Q`/2` BM
r?B+? 2H2K2Mib `2+2Bp2 7Q+mb rBi? i?2 tabindex ii`B#mi2X h?2 7QHHQrBM;
2tKTH2 /Q+mK2Mi rBHH H2i 7Q+mb DmKT 7`QK i?2 i2ti BMTmi iQ i?2 PE
#miiQM- `i?2` i?M ;QBM; i?`Qm;? i?2 ?2HT HBMF }`bi,
< input type =" text " tabindex =1 > <a href ="." >( help ) </a >
< button onclick =" console . log ( ok ) " tabindex =2 > OK </ button >

"v /27mHi- KQbi ivT2b Q7 >hJG 2H2K2Mib +MMQi #2 7Q+mb2/X "mi vQm
+M //  tabindex ii`B#mi2 iQ Mv 2H2K2Mi- r?B+? rBHH KF2 Bi 7Q+mb#H2X

.Bb#H2/ }2H/b
HH 7Q`K }2H/b +M #2 /Bb#H2/ i?`Qm;? i?2B` disabled ii`B#mi2- r?B+?
HbQ 2tBbib b  T`QT2`iv QM i?2 2H2K2MiǶb .PJ Q#D2+iX
< button >I m all right </ button >
< button disabled >I m out </ button >

.Bb#H2/ }2H/b +MMQi #2 7Q+mb2/ Q` +?M;2/- M/ mMHBF2 +iBp2 }2H/b-


i?2v mbmHHv HQQF ;`v M/ 7/2/X

q?2M  T`Q;`K Bb BM i?2 T`Q+2bb Q7 ?M/HBM; M +iBQM +mb2/ #v bQK2


#miiQM Q` Qi?2` +QMi`QH- r?B+? KB;?i `2[mB`2 +QKKmMB+iBQM rBi? i?2
b2`p2` M/ i?mb iF2  r?BH2- Bi +M #2  ;QQ/ B/2 iQ /Bb#H2 i?2 +QMi`QH
mMiBH i?2 +iBQM }MBb?2bX h?i rv- r?2M i?2 mb2` ;2ib BKTiB2Mi M/
+HB+Fb Bi ;BM- i?2v /QMǶi ++B/2MiHHv `2T2i i?2B` +iBQMX

h?2 7Q`K b  r?QH2


q?2M  }2H/ Bb +QMiBM2/ BM  <form> 2H2K2Mi- Bib .PJ 2H2K2Mi rBHH
?p2  T`QT2`iv form HBMFBM; #+F iQ i?2 7Q`KǶb .PJ 2H2K2MiX h?2 <

j98
form> 2H2K2Mi- BM im`M- ?b  T`QT2`iv +HH2/ elements i?i +QMiBMb M
``v@HBF2 +QHH2+iBQM Q7 i?2 }2H/b BMbB/2 BiX
h?2 name ii`B#mi2 Q7  7Q`K }2H/ /2i2`KBM2b i?2 rv Bib pHm2 rBHH #2
B/2MiB}2/ r?2M i?2 7Q`K Bb bm#KBii2/X Ai +M HbQ #2 mb2/ b  T`QT2`iv
MK2 r?2M ++2bbBM; i?2 7Q`KǶb elements T`QT2`iv- r?B+? +ib #Qi? b M
``v@HBF2 Q#D2+i U++2bbB#H2 #v MmK#2`V M/  KT U++2bbB#H2 #v MK2VX
< form action =" example / submit . html " >
Name : < input type =" text " name =" name " > < br >
Password : < input type =" password " name =" password "><br >
< button type =" submit " > Log in </ button >
</ form >
< script >
var form = document . querySelector (" form ") ;
console . log ( form . elements [1]. type ) ;
// → password
console . log ( form . elements . password . type ) ;
// → password
console . log ( form . elements . name . form == form ) ;
// → true
</ script >

 #miiQM rBi?  type ii`B#mi2 Q7 submit rBHH- r?2M T`2bb2/- +mb2 i?2
7Q`K iQ #2 bm#KBii2/X S`2bbBM; 1Mi2` r?2M  7Q`K }2H/ Bb 7Q+mb2/ ?b
i?2 bK2 2z2+iX
am#KBiiBM;  7Q`K MQ`KHHv K2Mb i?i i?2 #`Qrb2` MpB;i2b iQ i?2
T;2 BM/B+i2/ #v i?2 7Q`KǶb action ii`B#mi2- mbBM; 2Bi?2`  GET Q`  POST
`2[m2biX "mi #27Q`2 i?i ?TT2Mb-  "submit" 2p2Mi Bb }`2/X h?Bb 2p2Mi
+M #2 ?M/H2/ #v Cpa+`BTi- M/ i?2 ?M/H2` +M T`2p2Mi i?2 /27mHi
#2?pBQ` #v +HHBM; preventDefault QM i?2 2p2Mi Q#D2+iX
< form action =" example / submit . html " >
Value : < input type =" text " name =" value ">
< button type =" submit " > Save </ button >
</ form >
< script >
var form = document . querySelector (" form ") ;
form . addEventListener (" submit " , function ( event ) {
console . log (" Saving value " , form . elements . value . value ) ;
event . preventDefault () ;
}) ;

j9e
</ script >

AMi2`+2TiBM; "submit" 2p2Mib BM Cpa+`BTi ?b p`BQmb mb2bX q2 +M r`Bi2


+Q/2 iQ p2`B7v i?i i?2 pHm2b i?2 mb2` 2Mi2`2/ KF2 b2Mb2 M/ BKK2/B@
i2Hv b?Qr M 2``Q` K2bb;2 BMbi2/ Q7 bm#KBiiBM; i?2 7Q`K r?2M i?2v
/QMǶiX P` r2 +M /Bb#H2 i?2 `2;mH` rv Q7 bm#KBiiBM; i?2 7Q`K 2MiB`2Hv-
b BM i?2 T`2pBQmb 2tKTH2- M/ ?p2 Qm` T`Q;`K ?M/H2 i?2 BMTmi- TQb@
bB#Hv mbBM; XMLHttpRequest iQ b2M/ Bi Qp2` iQ  b2`p2` rBi?Qmi `2HQ/BM; i?2
T;2X

h2ti }2H/b
6B2H/b +`2i2/ #v <input> i;b rBi?  ivT2 Q7 text Q` password- b r2HH b
textarea i;b- b?`2  +QKKQM BMi2`7+2X h?2B` .PJ 2H2K2Mib ?p2 
value T`QT2`iv i?i ?QH/b i?2B` +m``2Mi +QMi2Mi b  bi`BM; pHm2X a2iiBM;
i?Bb T`QT2`iv iQ MQi?2` bi`BM; +?M;2b i?2 }2H/Ƕb +QMi2MiX
h?2 selectionStart M/ selectionEnd T`QT2`iB2b Q7 i2ti }2H/b ;Bp2 mb BM@
7Q`KiBQM #Qmi i?2 +m`bQ` M/ b2H2+iBQM BM i?2 i2tiX q?2M MQi?BM; Bb
b2H2+i2/- i?2b2 irQ T`QT2`iB2b ?QH/ i?2 bK2 MmK#2`- BM/B+iBM; i?2 TQ@
bBiBQM Q7 i?2 +m`bQ`X 6Q` 2tKTH2- y BM/B+i2b i?2 bi`i Q7 i?2 i2ti- M/
Ry BM/B+i2b i?2 +m`bQ` Bb 7i2` i?2 Ryi? +?`+i2`X q?2M T`i Q7 i?2 }2H/
Bb b2H2+i2/- i?2 irQ T`QT2`iB2b rBHH /Bz2`- ;BpBM; mb i?2 bi`i M/ 2M/ Q7
i?2 b2H2+i2/ i2tiX GBF2 value- i?2b2 T`QT2`iB2b Kv HbQ #2 r`Bii2M iQX
b M 2tKTH2- BK;BM2 vQm `2 r`BiBM; M `iB+H2 #Qmi E?b2F?2Krv
#mi ?p2 bQK2 i`Qm#H2 bT2HHBM; ?Bb MK2X h?2 7QHHQrBM; +Q/2 rB`2b mT
 <textarea> i; rBi? M 2p2Mi ?M/H2` i?i- r?2M vQm T`2bb 6k- BMb2`ib
i?2 bi`BM; dzE?b2F?2KrvǴ 7Q` vQmX
< textarea > </ textarea >
< script >
var textarea = document . querySelector (" textarea ") ;
textarea . addEventListener (" keydown ", function ( event ) {
// The key code for F2 happens to be 113
if ( event . keyCode == 113) {
replaceSelection ( textarea , " Khasekhemwy ") ;
event . preventDefault () ;
}
}) ;

j9d
function replaceSelection ( field , word ) {
var from = field . selectionStart , to = field . selectionEnd ;
field . value = field . value . slice (0 , from ) + word +
field . value . slice ( to );
// Put the cursor after the word
field . selectionStart = field . selectionEnd =
from + word . length ;
}
</ script >

h?2 replaceSelection 7mM+iBQM `2TH+2b i?2 +m``2MiHv b2H2+i2/ T`i Q7 


i2ti }2H/Ƕb +QMi2Mi rBi? i?2 ;Bp2M rQ`/ M/ i?2M KQp2b i?2 +m`bQ` 7i2`
i?i rQ`/ bQ i?i i?2 mb2` +M +QMiBMm2 ivTBM;X
h?2 "change" 2p2Mi 7Q`  i2ti }2H/ /Q2b MQi }`2 2p2`v iBK2 bQK2i?BM;
Bb ivT2/X _i?2`- Bi }`2b r?2M i?2 }2H/ HQb2b 7Q+mb 7i2` Bib +QMi2Mi rb
+?M;2/X hQ `2bTQM/ BKK2/Bi2Hv iQ +?M;2b BM  i2ti }2H/- vQm b?QmH/
`2;Bbi2`  ?M/H2` 7Q` i?2 "input" 2p2Mi BMbi2/- r?B+? }`2b 7Q` 2p2`v iBK2
i?2 mb2` ivT2b  +?`+i2`- /2H2i2b i2ti- Q` Qi?2`rBb2 KMBTmHi2b i?2
}2H/Ƕb +QMi2MiX
h?2 7QHHQrBM; 2tKTH2 b?Qrb  i2ti }2H/ M/  +QmMi2` b?QrBM; i?2
+m``2Mi H2M;i? Q7 i?2 i2ti 2Mi2`2/,
< input type =" text " > length : < span id =" length " >0 </ span >
< script >
var text = document . querySelector (" input ") ;
var output = document . querySelector ("# length ") ;
text . addEventListener (" input ", function () {
output . textContent = text . value . length ;
}) ;
</ script >

*?2+F#Qt2b M/ `/BQ #miiQMb


 +?2+F#Qt }2H/ Bb  bBKTH2 #BM`v iQ;;H2X Aib pHm2 +M #2 2ti`+i2/ Q`
+?M;2/ i?`Qm;? Bib checked T`QT2`iv- r?B+? ?QH/b  "QQH2M pHm2X
< input type =" checkbox " id =" purple " >
< label for =" purple " > Make this page purple </ label >
< script >

j93
var checkbox = document . querySelector ("# purple ") ;
checkbox . addEventListener (" change ", function () {
document . body . style . background =
checkbox . checked ? " mediumpurple " : "";
}) ;
</ script >

h?2 <label> i; Bb mb2/ iQ bbQ+Bi2  TB2+2 Q7 i2ti rBi? M BMTmi }2H/X
Aib for ii`B#mi2 b?QmH/ `272` iQ i?2 id Q7 i?2 }2H/X *HB+FBM; i?2 H#2H
rBHH +iBpi2 i?2 }2H/- r?B+? 7Q+mb2b Bi M/ iQ;;H2b Bib pHm2 r?2M Bi Bb 
+?2+F#Qt Q` `/BQ #miiQMX
 `/BQ #miiQM Bb bBKBH` iQ  +?2+F#Qt- #mi BiǶb BKTHB+BiHv HBMF2/ iQ
Qi?2` `/BQ #miiQMb rBi? i?2 bK2 name ii`B#mi2 bQ i?i QMHv QM2 Q7 i?2K
+M #2 +iBp2 i Mv iBK2X
Color :
< input type =" radio " name =" color " value =" mediumpurple " > Purple
< input type =" radio " name =" color " value =" lightgreen " > Green
< input type =" radio " name =" color " value =" lightblue " > Blue
< script >
var buttons = document . getElementsByName (" color ") ;
function setColor ( event ) {
document . body . style . background = event . target . value ;
}
for ( var i = 0; i < buttons . length ; i ++)
buttons [ i ]. addEventListener (" change " , setColor ) ;
</ script >

h?2 document.getElementsByName K2i?Q/ ;Bp2b mb HH 2H2K2Mib rBi?  ;Bp2M


name ii`B#mi2X h?2 2tKTH2 HQQTb Qp2` i?Qb2 UrBi?  `2;mH` for HQQT- MQi
forEach- #2+mb2 i?2 `2im`M2/ +QHH2+iBQM Bb MQi  `2H ``vV M/ `2;Bbi2`b
M 2p2Mi ?M/H2` 7Q` 2+? 2H2K2MiX _2K2K#2` i?i 2p2Mi Q#D2+ib ?p2
 target T`QT2`iv `272``BM; iQ i?2 2H2K2Mi i?i i`B;;2`2/ i?2 2p2MiX h?Bb
Bb Q7i2M mb27mH BM 2p2Mi ?M/H2`b HBF2 i?Bb QM2- r?B+? rBHH #2 +HH2/ QM
/Bz2`2Mi 2H2K2Mib M/ M22/ bQK2 rv iQ ++2bb i?2 +m``2Mi i`;2iX

a2H2+i }2H/b
a2H2+i }2H/b `2 +QM+2TimHHv bBKBH` iQ `/BQ #miiQMběi?2v HbQ HHQr
i?2 mb2` iQ +?QQb2 7`QK  b2i Q7 QTiBQMbX "mi r?2`2  `/BQ #miiQM Tmib

j9N
i?2 HvQmi Q7 i?2 QTiBQMb mM/2` Qm` +QMi`QH- i?2 TT2`M+2 Q7  <select>
i; Bb /2i2`KBM2/ #v i?2 #`Qrb2`X
a2H2+i }2H/b HbQ ?p2  p`BMi i?i Bb KQ`2 FBM iQ  HBbi Q7 +?2+F#Qt2b-
`i?2` i?M `/BQ #Qt2bX q?2M ;Bp2M i?2 multiple ii`B#mi2-  <select>
i; rBHH HHQr i?2 mb2` iQ b2H2+i Mv MmK#2` Q7 QTiBQMb- `i?2` i?M Dmbi
 bBM;H2 QTiBQMX
< select multiple >
< option > Pancakes </ option >
< option > Pudding </ option >
< option > Ice cream </ option >
</ select >

h?Bb rBHH- BM KQbi #`Qrb2`b- b?Qr mT /Bz2`2MiHv i?M  MQM@multiple b2H2+i


}2H/- r?B+? Bb +QKKQMHv /`rM b  /`QT@/QrM +QMi`QH i?i b?Qrb i?2
QTiBQMb QMHv r?2M vQm QT2M BiX

h?2 size ii`B#mi2 iQ i?2 <select> i; Bb mb2/ iQ b2i i?2 MmK#2` Q7 QTiBQMb
i?i `2 pBbB#H2 i i?2 bK2 iBK2- r?B+? ;Bp2b vQm 2tTHB+Bi +QMi`QH Qp2`
i?2 /`QT@/QrMǶb TT2`M+2X 6Q` 2tKTH2- b2iiBM; i?2 size ii`B#mi2 iQ
"3" rBHH KF2 i?2 }2H/ b?Qr i?`22 HBM2b- r?2i?2` Bi ?b i?2 multiple QTiBQM
2M#H2/ Q` MQiX
1+? <option> i; ?b  pHm2X h?Bb pHm2 +M #2 /2}M2/ rBi?  value
ii`B#mi2- #mi r?2M i?i Bb MQi ;Bp2M- i?2 i2ti BMbB/2 i?2 QTiBQM rBHH
+QmMi b i?2 QTiBQMǶb pHm2X h?2 value T`QT2`iv Q7  <select> 2H2K2Mi
`2~2+ib i?2 +m``2MiHv b2H2+i2/ QTiBQMX 6Q`  multiple }2H/- i?Qm;?- i?Bb
T`QT2`iv /Q2bMǶi K2M Km+? bBM+2 Bi rBHH ;Bp2 i?2 pHm2 Q7 QMHv QM2 Q7
i?2 +m``2MiHv b2H2+i2/ QTiBQMbX
h?2 <option> i;b 7Q`  <select> }2H/ +M #2 ++2bb2/ b M ``v@HBF2
Q#D2+i i?`Qm;? i?2 }2H/Ƕb options T`QT2`ivX 1+? QTiBQM ?b  T`QT2`iv
+HH2/ selected- r?B+? BM/B+i2b r?2i?2` i?i QTiBQM Bb +m``2MiHv b2H2+i2/X
h?2 T`QT2`iv +M HbQ #2 r`Bii2M iQ b2H2+i Q` /2b2H2+i M QTiBQMX
h?2 7QHHQrBM; 2tKTH2 2ti`+ib i?2 b2H2+i2/ pHm2b 7`QK  multiple b2@
H2+i }2H/ M/ mb2b i?2K iQ +QKTQb2  #BM`v MmK#2` 7`QK BM/BpB/mH
#BibX >QH/ *i`H UQ` *QKKM/ QM  J+V iQ b2H2+i KmHiBTH2 QTiBQMbX

j8y
< select multiple >
< option value ="1" >0001 </ option >
< option value ="2" >0010 </ option >
< option value ="4" >0100 </ option >
< option value ="8" >1000 </ option >
</ select > = < span id =" output " >0 </ span >
< script >
var select = document . querySelector (" select ") ;
var output = document . querySelector ("# output ") ;
select . addEventListener (" change " , function () {
var number = 0;
for ( var i = 0; i < select . options . length ; i ++) {
var option = select . options [ i ];
if ( option . selected )
number += Number ( option . value ) ;
}
output . textContent = number ;
}) ;
</ script >

6BH2 }2H/b
6BH2 }2H/b r2`2 Q`B;BMHHv /2bB;M2/ b  rv iQ mTHQ/ }H2b 7`QK i?2
#`Qrb2`Ƕb K+?BM2 i?`Qm;?  7Q`KX AM KQ/2`M #`Qrb2`b- i?2v HbQ T`Q@
pB/2  rv iQ `2/ bm+? }H2b 7`QK Cpa+`BTi T`Q;`KbX h?2 }2H/ +ib b
 KMM2` Q7 ;i2F22T2`X h?2 b+`BTi +MMQi bBKTHv bi`i `2/BM; T`Bpi2
}H2b 7`QK i?2 mb2`Ƕb +QKTmi2`- #mi B7 i?2 mb2` b2H2+ib  }H2 BM bm+?  }2H/-
i?2 #`Qrb2` BMi2`T`2ib i?i +iBQM iQ K2M i?i i?2 b+`BTi Kv `2/ i?2
}H2X
 }H2 }2H/ mbmHHv HQQFb HBF2  #miiQM H#2H2/ rBi? bQK2i?BM; HBF2
dz+?QQb2 }H2Ǵ Q` dz#`Qrb2Ǵ- rBi? BM7Q`KiBQM #Qmi i?2 +?Qb2M }H2 M2ti iQ
BiX
< input type =" file " >
< script >
var input = document . querySelector (" input ") ;
input . addEventListener (" change ", function () {
if ( input . files . length > 0) {
var file = input . files [0];

j8R
console . log (" You chose " , file . name ) ;
if ( file . type )
console . log (" It has type ", file . type ) ;
}
}) ;
</ script >

h?2 files T`QT2`iv Q7  }H2 }2H/ 2H2K2Mi Bb M ``v@HBF2 Q#D2+i U;BM-


MQi  `2H ``vV +QMiBMBM; i?2 }H2b +?Qb2M BM i?2 }2H/X Ai Bb BMBiBHHv
2KTivX h?2 `2bQM i?2`2 BbMǶi bBKTHv  file T`QT2`iv Bb i?i }H2 }2H/b HbQ
bmTTQ`i  multiple ii`B#mi2- r?B+? KF2b Bi TQbbB#H2 iQ b2H2+i KmHiBTH2
}H2b i i?2 bK2 iBK2X
P#D2+ib BM i?2 files T`QT2`iv ?p2 T`QT2`iB2b bm+? b name Ui?2 }H2@
MK2V- size Ui?2 }H2Ƕb bBx2 BM #vi2bV- M/ type Ui?2 K2/B ivT2 Q7 i?2 }H2-
bm+? b text/plain Q` image/jpegVX
q?i Bi /Q2b MQi ?p2 Bb  T`QT2`iv i?i +QMiBMb i?2 +QMi2Mi Q7 i?2
}H2X :2iiBM; i i?i Bb  HBiiH2 KQ`2 BMpQHp2/X aBM+2 `2/BM;  }H2 7`QK
/BbF +M iF2 iBK2- i?2 BMi2`7+2 rBHH ?p2 iQ #2 bvM+?`QMQmb iQ pQB/
7`22xBM; i?2 /Q+mK2MiX uQm +M i?BMF Q7 i?2 FileReader +QMbi`m+iQ` b
#2BM; bBKBH` iQ XMLHttpRequest #mi 7Q` }H2bX
< input type =" file " multiple >
< script >
var input = document . querySelector (" input ") ;
input . addEventListener (" change ", function () {
Array . prototype . forEach . call ( input . files , function ( file ) {
var reader = new FileReader () ;
reader . addEventListener (" load ", function () {
console . log (" File " , file . name , " starts with " ,
reader . result . slice (0 , 20) ) ;
}) ;
reader . readAsText ( file );
}) ;
}) ;
</ script >

_2/BM;  }H2 Bb /QM2 #v +`2iBM;  FileReader Q#D2+i- `2;Bbi2`BM;  "load


" 2p2Mi ?M/H2` 7Q` Bi- M/ +HHBM; Bib readAsText K2i?Q/- ;BpBM; Bi i?2
}H2 r2 rMi iQ `2/X PM+2 HQ/BM; }MBb?2b- i?2 `2/2`Ƕb result T`QT2`iv
+QMiBMb i?2 }H2Ƕb +QMi2MiX

j8k
h?2 2tKTH2 mb2b Array.prototype.forEach iQ Bi2`i2 Qp2` i?2 ``v bBM+2
BM  MQ`KH HQQT Bi rQmH/ #2 rFr`/ iQ ;2i i?2 +Q``2+i file M/ reader
Q#D2+ib 7`QK i?2 2p2Mi ?M/H2`X h?2 p`B#H2b rQmH/ #2 b?`2/ #v HH
Bi2`iBQMb Q7 i?2 HQQTX
FileReaderb HbQ }`2 M "error" 2p2Mi r?2M `2/BM; i?2 }H2 7BHb 7Q` Mv
`2bQMX h?2 2``Q` Q#D2+i Bib2H7 rBHH 2M/ mT BM i?2 `2/2`Ƕb error T`QT2`ivX
A7 vQm /QMǶi rMi iQ `2K2K#2` i?2 /2iBHb Q7 v2i MQi?2` BM+QMbBbi2Mi
bvM+?`QMQmb BMi2`7+2- vQm +QmH/ r`T Bi BM  Promise Ub22 *?Ti2` RdV
HBF2 i?Bb,
function readFile ( file ) {
return new Promise ( function ( succeed , fail ) {
var reader = new FileReader () ;
reader . addEventListener (" load " , function () {
succeed ( reader . result );
}) ;
reader . addEventListener (" error ", function () {
fail ( reader . error );
}) ;
reader . readAsText ( file );
}) ;
}

Ai Bb TQbbB#H2 iQ `2/ QMHv T`i Q7  }H2 #v +HHBM; slice QM Bi M/ TbbBM;


i?2 `2bmHi U bQ@+HH2/ #HQ# Q#D2+iV iQ i?2 }H2 `2/2`X

aiQ`BM; /i +HB2Mi@bB/2


aBKTH2 >hJG T;2b rBi?  #Bi Q7 Cpa+`BTi +M #2  ;`2i K2/BmK
7Q` dzKBMB TTHB+iBQMbǴěbKHH ?2HT2` T`Q;`Kb i?i miQKi2 2p2`v/v
i?BM;bX "v +QMM2+iBM;  72r 7Q`K }2H/b rBi? 2p2Mi ?M/H2`b- vQm +M
/Q Mvi?BM; 7`QK +QMp2`iBM; #2ir22M /2;`22b *2HbBmb M/ 6?`2M?2Bi iQ
+QKTmiBM; TbbrQ`/b 7`QK  Kbi2` TbbrQ`/ M/  r2#bBi2 MK2X
q?2M bm+? M TTHB+iBQM M22/b iQ `2K2K#2` bQK2i?BM; #2ir22M b2b@
bBQMb- vQm +MMQi mb2 Cpa+`BTi p`B#H2b bBM+2 i?Qb2 `2 i?`QrM rv
2p2`v iBK2  T;2 Bb +HQb2/X uQm +QmH/ b2i mT  b2`p2`- +QMM2+i Bi iQ i?2
AMi2`M2i- M/ ?p2 vQm` TTHB+iBQM biQ`2 bQK2i?BM; i?2`2X q2 rBHH b22
?Qr iQ /Q i?i BM *?Ti2` kyX "mi i?Bb //b  HQi Q7 2ti` rQ`F M/

j8j
+QKTH2tBivX aQK2iBK2b Bi Bb 2MQm;? iQ Dmbi F22T i?2 /i BM i?2 #`Qrb2`X
"mi ?Qr\
uQm +M biQ`2 bi`BM; /i BM  rv i?i bm`pBp2b T;2 `2HQ/b #v TmiiBM;
Bi BM i?2 localStorage Q#D2+iX h?Bb Q#D2+i HHQrb vQm iQ }H2 bi`BM; pHm2b
mM/2` MK2b UHbQ bi`BM;bV- b BM i?Bb 2tKTH2,
localStorage . setItem (" username " , " marijn ") ;
console . log ( localStorage . getItem (" username ") ) ;
// → marijn
localStorage . removeItem (" username ") ;

 pHm2 BM localStorage biB+Fb `QmM/ mMiBH Bi Bb Qp2`r`Bii2M- Bi Bb `2KQp2/


rBi? removeItem- Q` i?2 mb2` +H2`b i?2B` HQ+H /iX
aBi2b 7`QK /Bz2`2Mi /QKBMb ;2i /Bz2`2Mi biQ`;2 +QKT`iK2MibX h?i
K2Mb /i biQ`2/ BM localStorage #v  ;Bp2M r2#bBi2 +M- BM T`BM+BTH2-
QMHv #2 `2/ UM/ Qp2`r`Bii2MV #v b+`BTib QM i?i bK2 bBi2X
"`Qrb2`b HbQ 2M7Q`+2  HBKBi QM i?2 bBx2 Q7 i?2 /i  bBi2 +M biQ`2 BM
localStorage- ivTB+HHv QM i?2 Q`/2` Q7  72r K2;#vi2bX h?i `2bi`B+iBQM-
HQM; rBi? i?2 7+i i?i }HHBM; mT T2QTH2Ƕb ?`/ /`Bp2b rBi? DmMF Bb MQi
`2HHv T`Q}i#H2- T`2p2Mib i?Bb 72im`2 7`QK 2iBM; mT iQQ Km+? bT+2X
h?2 7QHHQrBM; +Q/2 BKTH2K2Mib  bBKTH2 MQi2@iFBM; TTHB+iBQMX Ai
F22Tb i?2 mb2`Ƕb MQi2b b M Q#D2+i- bbQ+BiBM; MQi2 iBiH2b rBi? +QMi2Mi
bi`BM;bX h?Bb Q#D2+i Bb 2M+Q/2/ b CaPL M/ biQ`2/ BM localStorageX h?2
mb2` +M b2H2+i  MQi2 7`QK  <select> }2H/ M/ +?M;2 i?i MQi2Ƕb i2ti
BM  <textarea>X  MQi2 +M #2 //2/ #v +HB+FBM;  #miiQMX
Notes : < select id =" list " > </ select >
< button onclick =" addNote () " > new </ button ><br >
< textarea id =" currentnote " style =" width : 100%; height : 10 em " >
</ textarea >

< script >


var list = document . querySelector ("# list ") ;
function addToList ( name ) {
var option = document . createElement (" option ") ;
option . textContent = name ;
list . appendChild ( option ) ;
}

// Initialize the list from localStorage

j89
var notes = JSON . parse ( localStorage . getItem (" notes ") ) ||
{" shopping list ": ""};
for ( var name in notes )
if ( notes . hasOwnProperty ( name ) )
addToList ( name ) ;

function saveToStorage () {
localStorage . setItem (" notes ", JSON . stringify ( notes ) ) ;
}

var current = document . querySelector ("# currentnote ") ;


current . value = notes [ list . value ];

list . addEventListener (" change " , function () {


current . value = notes [ list . value ];
}) ;
current . addEventListener (" change " , function () {
notes [ list . value ] = current . value ;
saveToStorage () ;
}) ;

function addNote () {
var name = prompt (" Note name ", "") ;
if (! name ) return ;
if (! notes . hasOwnProperty ( name )) {
notes [ name ] = "";
addToList ( name ) ;
saveToStorage () ;
}
list . value = name ;
current . value = notes [ name ];
}
</ script >

h?2 b+`BTi BMBiBHBx2b i?2 notes p`B#H2 iQ i?2 pHm2 biQ`2/ BM localStorage
Q`- B7 i?i Bb KBbbBM;- iQ  bBKTH2 Q#D2+i rBi? QMHv M 2KTiv "shopping
list" MQi2 BM BiX _2/BM;  }2H/ i?i /Q2b MQi 2tBbi 7`QK localStorage rBHH
vB2H/ nullX SbbBM; null iQ JSON.parse rBHH KF2 Bi T`b2 i?2 bi`BM; "null"
M/ `2im`M nullX h?mb- i?2 || QT2`iQ` +M #2 mb2/ iQ T`QpB/2  /27mHi
pHm2 BM  bBimiBQM HBF2 i?BbX
q?2M2p2` i?2 MQi2 /i +?M;2b Ur?2M  M2r MQi2 Bb //2/ Q` M

j88
2tBbiBM; MQi2 +?M;2/V- i?2 saveToStorage 7mM+iBQM Bb +HH2/ iQ mT/i2 i?2
biQ`;2 }2H/X A7 i?Bb TTHB+iBQM rb BMi2M/2/ iQ ?M/H2 i?QmbM/b Q7
MQi2b- `i?2` i?M  ?M/7mH- i?Bb rQmH/ #2 iQQ 2tT2MbBp2- M/ r2Ƕ/
?p2 iQ +QK2 mT rBi?  KQ`2 +QKTHB+i2/ rv iQ biQ`2 i?2K- bm+? b
;BpBM; 2+? MQi2 Bib QrM biQ`;2 }2H/X
q?2M i?2 mb2` //b  M2r MQi2- i?2 +Q/2 Kmbi mT/i2 i?2 i2ti }2H/
2tTHB+BiHv- 2p2M i?Qm;? i?2 <select> }2H/ ?b  "change" ?M/H2` i?i /Q2b
i?2 bK2 i?BM;X h?Bb Bb M2+2bb`v #2+mb2 "change" 2p2Mib }`2 QMHv r?2M
i?2 mb2` +?M;2b i?2 }2H/Ƕb pHm2- MQi r?2M  b+`BTi /Q2b BiX
h?2`2 Bb MQi?2` Q#D2+i bBKBH` iQ localStorage +HH2/ sessionStorageX h?2
/Bz2`2M+2 #2ir22M i?2 irQ Bb i?i i?2 +QMi2Mi Q7 sessionStorage Bb 7Q`;Qi@
i2M i i?2 2M/ Q7 2+? b2bbBQM- r?B+? 7Q` KQbi #`Qrb2`b K2Mb r?2M2p2`
i?2 #`Qrb2` Bb +HQb2/X

amKK`v
>hJG +M 2tT`2bb p`BQmb ivT2b Q7 7Q`K }2H/b- bm+? b i2ti }2H/b- +?2+F@
#Qt2b- KmHiBTH2@+?QB+2 }2H/b- M/ }H2 TB+F2`bX
am+? }2H/b +M #2 BMbT2+i2/ M/ KMBTmHi2/ rBi? Cpa+`BTiX h?2v
}`2 i?2 "change" 2p2Mi r?2M +?M;2/- i?2 "input" 2p2Mi r?2M i2ti Bb ivT2/-
M/ p`BQmb F2v#Q`/ 2p2MibX h?2b2 2p2Mib HHQr mb iQ MQiB+2 r?2M i?2
mb2` Bb BMi2`+iBM; rBi? i?2 }2H/bX S`QT2`iB2b HBF2 value U7Q` i2ti M/
b2H2+i }2H/bV Q` checked U7Q` +?2+F#Qt2b M/ `/BQ #miiQMbV `2 mb2/ iQ
`2/ Q` b2i i?2 }2H/Ƕb +QMi2MiX
q?2M  7Q`K Bb bm#KBii2/- Bib "submit" 2p2Mi }`2bX  Cpa+`BTi ?M@
/H2` +M +HH preventDefault QM i?i 2p2Mi iQ T`2p2Mi i?2 bm#KBbbBQM 7`QK
?TT2MBM;X 6Q`K }2H/ 2H2K2Mib /Q MQi ?p2 iQ #2 r`TT2/ BM <form>
i;bX
q?2M i?2 mb2` ?b b2H2+i2/  }H2 7`QK i?2B` HQ+H }H2 bvbi2K BM  }H2
TB+F2` }2H/- i?2 FileReader BMi2`7+2 +M #2 mb2/ iQ ++2bb i?2 +QMi2Mi Q7
i?Bb }H2 7`QK  Cpa+`BTi T`Q;`KX
h?2 localStorage M/ sessionStorage Q#D2+ib +M #2 mb2/ iQ bp2 BM7Q`K@
iBQM BM  rv i?i bm`pBp2b T;2 `2HQ/bX h?2 }`bi bp2b i?2 /i 7Q`2p2`
UQ` mMiBH i?2 mb2` /2+B/2b iQ +H2` BiV- M/ i?2 b2+QM/ bp2b Bi mMiBH i?2
#`Qrb2` Bb +HQb2/X

j8e
1t2`+Bb2b
 Cpa+`BTi rQ`F#2M+?
"mBH/ M BMi2`7+2 i?i HHQrb T2QTH2 iQ ivT2 M/ `mM TB2+2b Q7 Cpa+`BTi
+Q/2X
Smi  #miiQM M2ti iQ  <textarea> }2H/- r?B+?- r?2M T`2bb2/- mb2b i?2
Function +QMbi`m+iQ` r2 br BM *?Ti2` Ry iQ r`T i?2 i2ti BM  7mM+iBQM
M/ +HH BiX *QMp2`i i?2 `2im`M pHm2 Q7 i?2 7mM+iBQM- Q` Mv 2``Q` Bi
`Bb2/- iQ  bi`BM; M/ /BbTHv Bi 7i2` i?2 i2ti }2H/X

miQ+QKTH2iBQM
1ti2M/  i2ti }2H/ bQ i?i r?2M i?2 mb2` ivT2b-  HBbi Q7 bm;;2bi2/ pHm2b
Bb b?QrM #2HQr i?2 }2H/X uQm ?p2 M ``v Q7 TQbbB#H2 pHm2b pBH#H2
M/ b?QmH/ b?Qr i?Qb2 i?i bi`i rBi? i?2 i2ti i?i rb ivT2/X q?2M 
bm;;2biBQM Bb +HB+F2/- `2TH+2 i?2 i2ti }2H/Ƕb +m``2Mi pHm2 rBi? BiX

*QMrvǶb :K2 Q7 GB72


*QMrvǶb :K2 Q7 GB72 Bb  bBKTH2 bBKmHiBQM i?i +`2i2b `iB}+BH dzHB72Ǵ
QM  ;`B/- 2+? +2HH Q7 r?B+? Bb 2Bi?2` HBp2 Q` MQiX 1+? ;2M2`iBQM Uim`MV-
i?2 7QHHQrBM; `mH2b `2 TTHB2/,

Ç Mv HBp2 +2HH rBi? 72r2` i?M irQ Q` KQ`2 i?M i?`22 HBp2 M2B;?#Q`b
/B2bX
Ç Mv HBp2 +2HH rBi? irQ Q` i?`22 HBp2 M2B;?#Q`b HBp2b QM iQ i?2 M2ti
;2M2`iBQMX
Ç Mv /2/ +2HH rBi? 2t+iHv i?`22 HBp2 M2B;?#Q`b #2+QK2b  HBp2 +2HHX

 M2B;?#Q` Bb /2}M2/ b Mv /D+2Mi +2HH- BM+Hm/BM; /B;QMHHv /D+2Mi


QM2bX
LQi2 i?i i?2b2 `mH2b `2 TTHB2/ iQ i?2 r?QH2 ;`B/ i QM+2- MQi QM2
b[m`2 i  iBK2X h?i K2Mb i?2 +QmMiBM; Q7 M2B;?#Q`b Bb #b2/ QM
i?2 bBimiBQM i i?2 bi`i Q7 i?2 ;2M2`iBQM- M/ +?M;2b ?TT2MBM; iQ
M2B;?#Q` +2HHb /m`BM; i?Bb ;2M2`iBQM b?QmH/ MQi BM~m2M+2 i?2 M2r bii2
Q7  ;Bp2M +2HHX

j8d
AKTH2K2Mi i?Bb ;K2 mbBM; r?B+?2p2` /i bi`m+im`2 vQm }M/ TT`QT`B@
i2X lb2 Math.random iQ TQTmHi2 i?2 ;`B/ rBi?  `M/QK Tii2`M BMBiBHHvX
.BbTHv Bi b  ;`B/ Q7 +?2+F#Qt }2H/b- rBi?  #miiQM M2ti iQ Bi iQ /@
pM+2 iQ i?2 M2ti ;2M2`iBQMX q?2M i?2 mb2` +?2+Fb Q` mM+?2+Fb i?2
+?2+F#Qt2b- i?2B` +?M;2b b?QmH/ #2 BM+Hm/2/ r?2M +QKTmiBM; i?2 M2ti
;2M2`iBQMX

j83
RN S`QD2+i,  SBMi S`Q;`K
A HQQF i i?2 KMv +QHQ`b #27Q`2 K2X A HQQF i Kv #HMF +MpbX
h?2M- A i`v iQ TTHv +QHQ`b HBF2 rQ`/b i?i b?T2 TQ2Kb- HBF2
MQi2b i?i b?T2 KmbB+X
ěCQM JB`Q
h?2 Ki2`BH 7`QK i?2 T`2pBQmb +?Ti2`b ;Bp2b vQm HH i?2 2H2K2Mib vQm
M22/ iQ #mBH/  bBKTH2 r2# TTHB+iBQMX AM i?Bb +?Ti2`- r2 rBHH /Q Dmbi
i?iX
Pm` TTHB+iBQM rBHH #2  r2#@#b2/ /`rBM; T`Q;`K- HQM; i?2 HBM2b
Q7 JB+`QbQ7i SBMiX uQm +M mb2 Bi iQ QT2M BK;2 }H2b- b+`B##H2 QM i?2K
rBi? vQm` KQmb2- M/ bp2 i?2KX h?Bb Bb r?i Bi rBHH HQQF HBF2,

j8N
SBMiBM; QM  +QKTmi2` Bb ;`2iX uQm /QMǶi M22/ iQ rQ``v #Qmi Ki2@
`BHb- bFBHH- Q` iH2MiX uQm Dmbi bi`i bK2`BM;X

AKTH2K2MiiBQM
h?2 BMi2`7+2 7Q` i?2 TBMi T`Q;`K b?Qrb  #B; <canvas> 2H2K2Mi QM iQT-
rBi?  MmK#2` Q7 7Q`K }2H/b #2HQr BiX h?2 mb2` /`rb QM i?2 TB+im`2
#v b2H2+iBM;  iQQH 7`QK  <select> }2H/ M/ i?2M +HB+FBM; Q` /`;;BM;
+`Qbb i?2 +MpbX h?2`2 `2 iQQHb 7Q` /`rBM; HBM2b- 2`bBM; T`ib Q7 i?2
TB+im`2- //BM; i2ti- M/ bQ QMX
*HB+FBM; i?2 +Mpb rBHH ?M/ Qz i?2 "mousedown" 2p2Mi iQ i?2 +m``2MiHv
b2H2+i2/ iQQH- r?B+? +M ?M/H2 Bi BM r?B+?2p2` rv Bi +?QQb2bX h?2
HBM2 /`rBM; iQQH- 7Q` 2tKTH2- rBHH HBbi2M 7Q` "mousemove" 2p2Mib mMiBH i?2
KQmb2 #miiQM Bb `2H2b2/ M/ /`r HBM2b HQM; i?2 KQmb2Ƕb Ti? mbBM;
i?2 +m``2Mi +QHQ` M/ #`mb? bBx2X
*QHQ` M/ #`mb? bBx2 `2 b2H2+i2/ rBi? //BiBQMH 7Q`K }2H/bX h?2b2 `2
?QQF2/ mT iQ mT/i2 i?2 +Mpb /`rBM; +QMi2tiǶb fillStyle- strokeStyle-
M/ lineWidth r?2M2p2` i?2v `2 +?M;2/X
uQm +M HQ/ M BK;2 BMiQ i?2 T`Q;`K BM irQ rvbX h?2 }`bi mb2b 
}H2 }2H/- r?2`2 i?2 mb2` +M b2H2+i  }H2 QM i?2B` QrM }H2 bvbi2KX h?2
b2+QM/ bFb 7Q`  l_G M/ rBHH 72i+? M BK;2 7`QK i?2 q2#X
AK;2b `2 bp2/ BM  bQK2r?i ivTB+H rvX h?2 bp2 HBMF i i?2
`B;?i bB/2 TQBMib i i?2 +m``2Mi BK;2X Ai +M #2 7QHHQr2/- b?`2/- Q`
bp2/X A rBHH 2tTHBM ?Qr i?Bb Bb +?B2p2/ BM  KQK2MiX

"mBH/BM; i?2 .PJ


Pm` T`Q;`KǶb BMi2`7+2 Bb #mBHi 7`QK KQ`2 i?M jy .PJ 2H2K2MibX q2
M22/ iQ +QMbi`m+i i?2b2 bQK2?QrX
>hJG Bb i?2 KQbi Q#pBQmb 7Q`Ki 7Q` /2}MBM; +QKTH2t .PJ bi`m+@
im`2bX "mi b2T`iBM; i?2 T`Q;`K BMiQ  TB2+2 Q7 >hJG M/  b+`BTi Bb
K/2 /B{+mHi #v i?2 7+i i?i KMv Q7 i?2 .PJ 2H2K2Mib M22/ 2p2Mi
?M/H2`b Q` ?p2 iQ #2 iQm+?2/ #v i?2 b+`BTi BM bQK2 Qi?2` rvX h?mb-
Qm` b+`BTi rQmH/ ?p2 iQ KF2 HQib Q7 querySelector UQ` bBKBH`V +HHb BM
Q`/2` iQ }M/ i?2 .PJ 2H2K2Mib i?i Bi M22/b iQ +i QMX

jey
Ai rQmH/ #2 MB+2 B7 i?2 .PJ bi`m+im`2 7Q` 2+? T`i Q7 Qm` BMi2`7+2 Bb
/2}M2/ +HQb2 iQ i?2 Cpa+`BTi +Q/2 i?i /`Bp2b BiX h?mb- AǶp2 +?Qb2M iQ
/Q HH +`2iBQM Q7 .PJ MQ/2b BM Cpa+`BTiX b r2 br BM *?Ti2` Rj-
i?2 #mBHi@BM BMi2`7+2 7Q` #mBH/BM; mT  .PJ bi`m+im`2 Bb ?Q``2M/QmbHv
p2`#Qb2X A7 r2 `2 ;QBM; iQ /Q  HQi Q7 .PJ +QMbi`m+iBQM- r2 M22/ 
?2HT2` 7mM+iBQMX
h?Bb ?2HT2` 7mM+iBQM Bb M 2ti2M/2/ p2`bBQM Q7 i?2 elt 7mM+iBQM 7`QK
*?Ti2` RjX Ai +`2i2b M 2H2K2Mi rBi? i?2 ;Bp2M MK2 M/ ii`B#mi2b
M/ TT2M/b HH 7m`i?2` `;mK2Mib Bi ;2ib b +?BH/ MQ/2b- miQKiB+HHv
+QMp2`iBM; bi`BM;b iQ i2ti MQ/2bX
function elt ( name , attributes ) {
var node = document . createElement ( name ) ;
if ( attributes ) {
for ( var attr in attributes )
if ( attributes . hasOwnProperty ( attr ) )
node . setAttribute ( attr , attributes [ attr ]) ;
}
for ( var i = 2; i < arguments . length ; i ++) {
var child = arguments [i ];
if ( typeof child == " string ")
child = document . createTextNode ( child );
node . appendChild ( child ) ;
}
return node ;
}

h?Bb HHQrb mb iQ +`2i2 2H2K2Mib 2bBHv- rBi?Qmi KFBM; Qm` bQm`+2 +Q/2
b HQM; M/ /mHH b  +Q`TQ`i2 2M/@mb2` ;`22K2MiX

h?2 7QmM/iBQM
h?2 +Q`2 Q7 Qm` T`Q;`K Bb i?2 createPaint 7mM+iBQM- r?B+? TT2M/b i?2
TBMi BMi2`7+2 iQ i?2 .PJ 2H2K2Mi Bi Bb ;Bp2M b M `;mK2MiX "2+mb2
r2 rMi iQ #mBH/ Qm` T`Q;`K TB2+2 #v TB2+2- r2 /2}M2 M Q#D2+i +HH2/
controls- r?B+? rBHH ?QH/ 7mM+iBQMb iQ BMBiBHBx2 i?2 p`BQmb +QMi`QHb #2HQr
i?2 BK;2X
var controls = Object . create ( null );

jeR
function createPaint ( parent ) {
var canvas = elt (" canvas ", { width : 500 , height : 300}) ;
var cx = canvas . getContext ("2 d ") ;
var toolbar = elt (" div " , { class : " toolbar "}) ;
for ( var name in controls )
toolbar . appendChild ( controls [ name ]( cx ) ) ;

var panel = elt (" div " , { class : " picturepanel "} , canvas ) ;
parent . appendChild ( elt (" div " , null , panel , toolbar ) ) ;
}

1+? +QMi`QH ?b ++2bb iQ i?2 +Mpb /`rBM; +QMi2ti M/- i?`Qm;? i?i
+QMi2tiǶb canvas T`QT2`iv- iQ i?2 <canvas> 2H2K2MiX JQbi Q7 i?2 T`Q;`KǶb
bii2 HBp2b BM i?Bb +MpběBi +QMiBMb i?2 +m``2Mi TB+im`2 b r2HH b i?2
b2H2+i2/ +QHQ` UBM Bib fillStyle T`QT2`ivV M/ #`mb? bBx2 UBM Bib lineWidth
T`QT2`ivVX
q2 r`T i?2 +Mpb M/ i?2 +QMi`QHb BM <div> 2H2K2Mib rBi? +Hbb2b bQ
r2 +M // bQK2 bivHBM;- bm+? b  ;`v #Q`/2` `QmM/ i?2 TB+im`2X

hQQH b2H2+iBQM
h?2 }`bi +QMi`QH r2 // Bb i?2 <select> 2H2K2Mi i?i HHQrb i?2 mb2` iQ
TB+F  /`rBM; iQQHX b rBi? controls- r2 rBHH mb2 M Q#D2+i iQ +QHH2+i
i?2 p`BQmb iQQHb bQ i?i r2 /Q MQi ?p2 iQ ?`/@+Q/2 i?2K HH BM QM2
TH+2 M/ +M // KQ`2 iQQHb Hi2`X h?Bb Q#D2+i bbQ+Bi2b i?2 MK2b Q7
i?2 iQQHb rBi? i?2 7mM+iBQM i?i b?QmH/ #2 +HH2/ r?2M i?2v `2 b2H2+i2/
M/ i?2 +Mpb Bb +HB+F2/X
var tools = Object . create ( null ) ;

controls . tool = function ( cx ) {


var select = elt (" select ") ;
for ( var name in tools )
select . appendChild ( elt (" option ", null , name ) ) ;

cx . canvas . addEventListener (" mousedown " , function ( event ) {


if ( event . which == 1) {
tools [ select . value ]( event , cx );
event . preventDefault () ;
}

jek
}) ;

return elt (" span " , null , " Tool : ", select ) ;
};

h?2 iQQH }2H/ Bb TQTmHi2/ rBi? <option> 2H2K2Mib 7Q` HH iQQHb i?i ?p2
#22M /2}M2/- M/  "mousedown" ?M/H2` QM i?2 +Mpb 2H2K2Mi iF2b +`2
Q7 +HHBM; i?2 7mM+iBQM 7Q` i?2 +m``2Mi iQQH- TbbBM; Bi #Qi? i?2 2p2Mi
Q#D2+i M/ i?2 /`rBM; +QMi2ti b `;mK2MibX Ai HbQ +HHb preventDefault
bQ i?i ?QH/BM; i?2 KQmb2 #miiQM M/ /`;;BM; /Q2b MQi +mb2 i?2
#`Qrb2` iQ b2H2+i T`ib Q7 i?2 T;2X
h?2 KQbi #bB+ iQQH Bb i?2 HBM2 iQQH- r?B+? HHQrb i?2 mb2` iQ /`r
HBM2b rBi? i?2 KQmb2X hQ Tmi i?2 HBM2 2M/b BM i?2 `B;?i TH+2- r2 M22/ iQ
#2 #H2 iQ }M/ i?2 +Mpb@`2HiBp2 +QQ`/BMi2b i?i  ;Bp2M KQmb2 2p2Mi
+Q``2bTQM/b iQX h?2 getBoundingClientRect K2i?Q/- #`B2~v K2MiBQM2/ BM
*?Ti2` Rj- +M ?2HT mb ?2`2X Ai i2HHb mb r?2`2 M 2H2K2Mi Bb b?QrM-
`2HiBp2 iQ i?2 iQT@H27i +Q`M2` Q7 i?2 b+`22MX h?2 clientX M/ clientY
T`QT2`iB2b QM KQmb2 2p2Mib `2 HbQ `2HiBp2 iQ i?Bb +Q`M2`- bQ r2 +M
bm#i`+i i?2 iQT@H27i +Q`M2` Q7 i?2 +Mpb 7`QK i?2K iQ ;2i  TQbBiBQM
`2HiBp2 iQ i?i +Q`M2`X
function relativePos ( event , element ) {
var rect = element . getBoundingClientRect () ;
return { x : Math . floor ( event . clientX - rect . left ) ,
y: Math . floor ( event . clientY - rect . top ) };
}

a2p2`H Q7 i?2 /`rBM; iQQHb M22/ iQ HBbi2M 7Q` "mousemove" 2p2Mib b HQM;
b i?2 KQmb2 #miiQM Bb ?2H/ /QrMX h?2 trackDrag 7mM+iBQM iF2b +`2 Q7
i?2 2p2Mi `2;Bbi`iBQM M/ mM`2;Bbi`iBQM 7Q` bm+? bBimiBQMbX
function trackDrag ( onMove , onEnd ) {
function end ( event ) {
removeEventListener (" mousemove " , onMove ) ;
removeEventListener (" mouseup ", end ) ;
if ( onEnd )
onEnd ( event ) ;
}
addEventListener (" mousemove ", onMove );
addEventListener (" mouseup ", end );
}

jej
h?Bb 7mM+iBQM iF2b irQ `;mK2MibX PM2 Bb  7mM+iBQM iQ +HH 7Q` 2+?
"mousemove" 2p2Mi- M/ i?2 Qi?2` Bb  7mM+iBQM iQ +HH r?2M i?2 KQmb2 #mi@
iQM Bb `2H2b2/X 1Bi?2` `;mK2Mi +M #2 QKBii2/ r?2M Bi Bb MQi M22/2/X
h?2 HBM2 iQQH mb2b i?2b2 irQ ?2HT2`b iQ /Q i?2 +imH /`rBM;X
tools . Line = function ( event , cx , onEnd ) {
cx . lineCap = " round ";

var pos = relativePos ( event , cx . canvas ) ;


trackDrag ( function ( event ) {
cx . beginPath () ;
cx . moveTo ( pos .x , pos .y) ;
pos = relativePos ( event , cx . canvas );
cx . lineTo ( pos .x , pos .y) ;
cx . stroke () ;
} , onEnd ) ;
};

h?2 7mM+iBQM bi`ib #v b2iiBM; i?2 /`rBM; +QMi2tiǶb lineCap T`QT2`iv iQ


"round"- r?B+? +mb2b #Qi? 2M/b Q7  bi`QF2/ Ti? iQ #2 `QmM/ `i?2`
i?M i?2 /27mHi b[m`2 7Q`KX h?Bb Bb  i`B+F iQ KF2 bm`2 i?i KmHiBTH2
b2T`i2 HBM2b- /`rM BM `2bTQMb2 iQ b2T`i2 2p2Mib- HQQF HBF2  bBM;H2-
+Q?2`2Mi HBM2X qBi? #B;;2` HBM2 rB/i?b- vQm rBHH b22 ;Tb i +Q`M2`b B7
vQm mb2 i?2 /27mHi ~i HBM2 +TbX
h?2M- 7Q` 2p2`v "mousemove" 2p2Mi i?i Q++m`b b HQM; b i?2 KQmb2
#miiQM Bb /QrM-  bBKTH2 HBM2 b2;K2Mi Bb /`rM #2ir22M i?2 KQmb2Ƕb QH/
M/ M2r TQbBiBQM- mbBM; r?i2p2` strokeStyle M/ lineWidth ?TT2M iQ #2
+m``2MiHv b2iX
h?2 onEnd `;mK2Mi iQ tools.Line Bb bBKTHv Tbb2/ i?`Qm;? iQ trackDragX
h?2 MQ`KH rv iQ `mM iQQHb rQMǶi Tbb  i?B`/ `;mK2Mi- bQ r?2M mbBM;
i?2 HBM2 iQQH- i?i `;mK2Mi rBHH ?QH/ undefined- M/ MQi?BM; ?TT2Mb
i i?2 2M/ Q7 i?2 KQmb2 /`;X h?2 `;mK2Mi Bb i?2`2 iQ HHQr mb iQ
BKTH2K2Mi i?2 2`b2 iQQH QM iQT Q7 i?2 HBM2 iQQH rBi? p2`v HBiiH2 //BiBQMH
+Q/2X
tools . Erase = function ( event , cx ) {
cx . globalCompositeOperation = " destination - out ";
tools . Line ( event , cx , function () {
cx . globalCompositeOperation = " source - over ";
}) ;

je9
};

h?2 globalCompositeOperation T`QT2`iv BM~m2M+2b i?2 rv /`rBM; QT2`@


iBQMb QM  +Mpb +?M;2 i?2 +QHQ` Q7 i?2 TBt2Hb i?2v iQm+?X "v /27mHi-
i?2 T`QT2`ivǶb pHm2 Bb "source-over"- r?B+? K2Mb i?i i?2 /`rM +QHQ`
Bb Qp2`HB/ QM i?2 2tBbiBM; +QHQ` i i?i bTQiX A7 i?2 +QHQ` Bb QT[m2- Bi
rBHH bBKTHv `2TH+2 i?2 QH/ +QHQ`- #mi B7 Bi Bb T`iBHHv i`MbT`2Mi- i?2
irQ rBHH #2 KBt2/X
h?2 2`b2 iQQH b2ib globalCompositeOperation iQ "destination-out"- r?B+?
?b i?2 2z2+i Q7 2`bBM; i?2 TBt2Hb r2 iQm+?- KFBM; i?2K i`MbT`2Mi
;BMX
h?i ;Bp2b mb irQ iQQHb BM Qm` TBMi T`Q;`KX q2 +M /`r #H+F HBM2b
 bBM;H2 TBt2H rB/2 Ui?2 /27mHi strokeStyle M/ lineWidth 7Q`  +MpbV M/
2`b2 i?2K ;BMX Ai Bb  rQ`FBM;- H#2Bi `i?2` HBKBi2/- TBMi T`Q;`KX

*QHQ` M/ #`mb? bBx2


bbmKBM; i?i mb2`b rBHH rMi iQ /`r BM +QHQ`b Qi?2` i?M #H+F M/
mb2 /Bz2`2Mi #`mb? bBx2b- H2iǶb // +QMi`QHb 7Q` i?Qb2 irQ b2iiBM;bX
AM *?Ti2` R3- A /Bb+mbb2/  MmK#2` Q7 /Bz2`2Mi 7Q`K }2H/bX *QHQ`
}2H/b r2`2 MQi KQM; i?Qb2X h`/BiBQMHHv- #`Qrb2`b /QMǶi ?p2 #mBHi@BM
bmTTQ`i 7Q` +QHQ` TB+F2`b- #mi BM i?2 Tbi 72r v2`b-  MmK#2` Q7 M2r 7Q`K
}2H/ ivT2b ?p2 #22M biM/`/Bx2/X PM2 Q7 i?Qb2 Bb <input type="color">
X Pi?2`b BM+Hm/2 "date"- "email"- "url"- M/ "number"X LQi HH #`Qrb2`b
bmTTQ`i i?2K v2iěi i?2 iBK2 Q7 r`BiBM;- MQ p2`bBQM Q7 AMi2`M2i 1tTHQ`2`
bmTTQ`ib +QHQ` }2H/bX h?2 /27mHi ivT2 Q7 M <input> i; Bb "text"- M/
r?2M M mMbmTTQ`i2/ ivT2 Bb mb2/- #`Qrb2`b rBHH i`2i Bi b  i2ti }2H/X
h?Bb K2Mb i?i AMi2`M2i 1tTHQ`2` mb2`b `mMMBM; Qm` TBMi T`Q;`K rBHH
?p2 iQ ivT2 BM i?2 MK2 Q7 i?2 +QHQ` i?2v rMi- `i?2` i?M b2H2+i Bi
7`QK  +QMp2MB2Mi rB/;2iX
h?Bb Bb r?i  +QHQ` TB+F2` Kv HQQF HBF2,

je8
controls . color = function ( cx ) {
var input = elt (" input " , { type : " color "}) ;
input . addEventListener (" change ", function () {
cx . fillStyle = input . value ;
cx . strokeStyle = input . value ;
}) ;
return elt (" span " , null , " Color : " , input ) ;
};

q?2M2p2` i?2 pHm2 Q7 i?2 +QHQ` }2H/ +?M;2b- i?2 /`rBM; +QMi2tiǶb
fillStyle M/ strokeStyle `2 mT/i2/ iQ ?QH/ i?2 M2r pHm2X
h?2 }2H/ 7Q` +QM};m`BM; i?2 #`mb? bBx2 rQ`Fb bBKBH`HvX
controls . brushSize = function ( cx ) {
var select = elt (" select ") ;
var sizes = [1 , 2 , 3 , 5, 8 , 12 , 25 , 35 , 50 , 75 , 100];
sizes . forEach ( function ( size ) {
select . appendChild ( elt (" option ", { value : size } ,
size + " pixels ") ) ;
}) ;
select . addEventListener (" change " , function () {
cx . lineWidth = select . value ;
}) ;
return elt (" span " , null , " Brush size : " , select ) ;

jee
};

h?2 +Q/2 ;2M2`i2b QTiBQMb 7`QK M ``v Q7 #`mb? bBx2b- M/ ;BM 2M@
bm`2b i?i i?2 +MpbǶ lineWidth Bb mT/i2/ r?2M  #`mb? bBx2 Bb +?Qb2MX

apBM;
hQ 2tTHBM i?2 BKTH2K2MiiBQM Q7 i?2 bp2 HBMF- A Kmbi }`bi i2HH vQm #Qmi
/i l_GbX  /i l_G Bb  l_G rBi? /i, b Bib T`QiQ+QHX lMHBF2
`2;mH` ?iiT, M/ ?iiTb, l_Gb- /i l_Gb /QMǶi TQBMi i  `2bQm`+2
#mi `i?2` +QMiBM i?2 2MiB`2 `2bQm`+2 BM i?2KX h?Bb Bb  /i l_G
+QMiBMBM;  bBKTH2 >hJG /Q+mK2Mi,
data : text / html , < h1 style =" color : red "> Hello ! </ h1 >

.i l_Gb `2 mb27mH 7Q` p`BQmb ibFb- bm+? b BM+Hm/BM; bKHH BK;2b
/B`2+iHv BM  bivH2 b?22i }H2X h?2v HbQ HHQr mb iQ HBMF iQ }H2b i?i r2
+`2i2/ QM i?2 +HB2Mi bB/2- BM i?2 #`Qrb2`- rBi?Qmi }`bi KQpBM; i?2K iQ
bQK2 b2`p2`X
*Mpb 2H2K2Mib ?p2  +QMp2MB2Mi K2i?Q/- +HH2/ toDataURL- r?B+? rBHH
`2im`M  /i l_G i?i +QMiBMb i?2 TB+im`2 QM i?2 +Mpb b M BK;2
}H2X q2 /QMǶi rMi iQ mT/i2 Qm` bp2 HBMF 2p2`v iBK2 i?2 TB+im`2 Bb
+?M;2/- ?Qr2p2`X 6Q` #B; TB+im`2b- i?i BMpQHp2b KQpBM; [mBi2  HQi Q7
/i BMiQ  HBMF M/ rQmH/ #2 MQiB+2#Hv bHQrX AMbi2/- r2 `B; i?2 HBMF
iQ mT/i2 Bib href ii`B#mi2 r?2M2p2` Bi Bb 7Q+mb2/ rBi? i?2 F2v#Q`/ Q`
i?2 KQmb2 Bb KQp2/ Qp2` BiX
controls . save = function ( cx ) {
var link = elt (" a " , { href : "/"} , " Save ") ;
function update () {
try {
link . href = cx . canvas . toDataURL () ;
} catch ( e ) {
if ( e instanceof SecurityError )
link . href = " javascript : alert (" +
JSON . stringify (" Can t save : " + e . toString () ) + ") ";
else
throw e ;
}
}

jed
link . addEventListener (" mouseover " , update ) ;
link . addEventListener (" focus ", update ) ;
return link ;
};

h?mb- i?2 HBMF Dmbi [mB2iHv bBib i?2`2- TQBMiBM; i i?2 r`QM; i?BM;- #mi
r?2M i?2 mb2` TT`Q+?2b Bi- Bi K;B+HHv mT/i2b Bib2H7 iQ TQBMi i i?2
+m``2Mi TB+im`2X
A7 vQm HQ/  #B; BK;2- bQK2 #`Qrb2`b rBHH +?QF2 QM i?2 ;BMi /i
l_Gb i?i i?Bb T`Q/m+2bX 6Q` bKHH TB+im`2b- i?Bb TT`Q+? rQ`Fb rBi?@
Qmi T`Q#H2KX
"mi ?2`2 r2 QM+2 ;BM `mM BMiQ i?2 bm#iH2iB2b Q7 #`Qrb2` bM/#QtBM;X
q?2M M BK;2 Bb HQ/2/ 7`QK  l_G QM MQi?2` /QKBM- B7 i?2 b2`p2`Ƕb
`2bTQMb2 /Q2bMǶi BM+Hm/2  ?2/2` i?i i2HHb i?2 #`Qrb2` i?2 `2bQm`+2
Kv #2 mb2/ 7`QK Qi?2` /QKBMb Ub22 *?Ti2` RdV- i?2M i?2 +Mpb rBHH
+QMiBM BM7Q`KiBQM i?i i?2 mb2` Kv HQQF i #mi i?i i?2 b+`BTi Kv
MQiX
q2 Kv ?p2 `2[m2bi2/  TB+im`2 i?i +QMiBMb T`Bpi2 BM7Q`KiBQM
U7Q` 2tKTH2-  ;`T? b?QrBM; i?2 mb2`Ƕb #MF ++QmMi #HM+2V mbBM;
i?2 mb2`Ƕb b2bbBQMX A7 b+`BTib +QmH/ ;2i BM7Q`KiBQM Qmi Q7 i?i TB+im`2-
i?2v +QmH/ bMQQT QM i?2 mb2` BM mM/2bB`#H2 rvbX
hQ T`2p2Mi i?2b2 FBM/b Q7 BM7Q`KiBQM H2Fb- #`Qrb2`b rBHH K`F  +M@
pb b iBMi2/ r?2M M BK;2 i?i i?2 b+`BTi Kv MQi b22 Bb /`rM QMiQ
BiX SBt2H /i- BM+Hm/BM; /i l_Gb- Kv MQi #2 2ti`+i2/ 7`QK  iBMi2/
+MpbX uQm +M r`Bi2 iQ Bi- #mi vQm +M MQ HQM;2` `2/ BiX
h?Bb Bb r?v r2 M22/ i?2 try/catch bii2K2Mi BM i?2 update 7mM+iBQM 7Q`
i?2 bp2 HBMFX q?2M i?2 +Mpb ?b #2+QK2 iBMi2/- +HHBM; toDataURL
rBHH `Bb2 M 2t+2TiBQM i?i Bb M BMbiM+2 Q7 SecurityErrorX q?2M i?i
?TT2Mb- r2 b2i i?2 HBMF iQ TQBMi i v2i MQi?2` FBM/ Q7 l_G- mbBM; i?2
Dpb+`BTi, T`QiQ+QHX am+? HBMFb bBKTHv 2t2+mi2 i?2 b+`BTi ;Bp2M 7i2` i?2
+QHQM r?2M i?2v `2 7QHHQr2/ bQ i?i i?2 HBMF rBHH b?Qr M alert rBM/Qr
BM7Q`KBM; i?2 mb2` Q7 i?2 T`Q#H2K r?2M Bi Bb +HB+F2/X

GQ/BM; BK;2 }H2b


h?2 }MH irQ +QMi`QHb `2 mb2/ iQ HQ/ BK;2b 7`QK HQ+H }H2b M/ 7`QK
l_GbX q2ǶHH M22/ i?2 7QHHQrBM; ?2HT2` 7mM+iBQM- r?B+? i`B2b iQ HQ/ M

je3
BK;2 }H2 7`QK  l_G M/ `2TH+2 i?2 +QMi2Mib Q7 i?2 +Mpb rBi? Bi,
function loadImageURL ( cx , url ) {
var image = document . createElement (" img ") ;
image . addEventListener (" load " , function () {
var color = cx . fillStyle , size = cx . lineWidth ;
cx . canvas . width = image . width ;
cx . canvas . height = image . height ;
cx . drawImage ( image , 0, 0) ;
cx . fillStyle = color ;
cx . strokeStyle = color ;
cx . lineWidth = size ;
}) ;
image . src = url ;
}

q2 rMi iQ +?M;2 i?2 bBx2 Q7 i?2 +Mpb iQ T`2+Bb2Hv }i i?2 BK;2X 6Q`
bQK2 `2bQM- +?M;BM; i?2 bBx2 Q7  +Mpb rBHH +mb2 Bib /`rBM; +QMi2ti
iQ 7Q`;2i +QM};m`iBQM T`QT2`iB2b bm+? b fillStyle M/ lineWidth- bQ i?2
7mM+iBQM bp2b i?Qb2 M/ `2biQ`2b i?2K 7i2` Bi ?b mT/i2/ i?2 +Mpb
bBx2X
h?2 +QMi`QH 7Q` HQ/BM;  HQ+H }H2 mb2b i?2 FileReader i2+?MB[m2 7`QK
*?Ti2` R3X T`i 7`QK i?2 readAsText K2i?Q/ r2 mb2/ i?2`2- bm+? `2/2`
Q#D2+ib HbQ ?p2  K2i?Q/ +HH2/ readAsDataURL- r?B+? Bb 2t+iHv r?i r2
M22/ ?2`2X q2 HQ/ i?2 }H2 i?i i?2 mb2` +?Qb2 b  /i l_G M/ Tbb
Bi iQ loadImageURL iQ Tmi Bi BMiQ i?2 +MpbX
controls . openFile = function ( cx ) {
var input = elt (" input " , { type : " file "}) ;
input . addEventListener (" change ", function () {
if ( input . files . length == 0) return ;
var reader = new FileReader () ;
reader . addEventListener (" load " , function () {
loadImageURL ( cx , reader . result ) ;
}) ;
reader . readAsDataURL ( input . files [0]) ;
}) ;
return elt (" div " , null , " Open file : " , input ) ;
};

GQ/BM;  }H2 7`QK  l_G Bb 2p2M bBKTH2`X "mi rBi?  i2ti }2H/- Bi Bb
H2bb +H2` r?2M i?2 mb2` ?b }MBb?2/ r`BiBM; i?2 l_G- bQ r2 +MǶi bBKTHv

jeN
HBbi2M 7Q` "change" 2p2MibX AMbi2/- r2 rBHH r`T i?2 }2H/ BM  7Q`K M/
`2bTQM/ r?2M i?2 7Q`K Bb bm#KBii2/- 2Bi?2` #2+mb2 i?2 mb2` T`2bb2/
1Mi2` Q` #2+mb2 i?2v +HB+F2/ i?2 HQ/ #miiQMX
controls . openURL = function ( cx ) {
var input = elt (" input " , { type : " text "}) ;
var form = elt (" form " , null ,
" Open URL : " , input ,
elt (" button " , { type : " submit "} , " load ") ) ;
form . addEventListener (" submit " , function ( event ) {
event . preventDefault () ;
loadImageURL ( cx , input . value );
}) ;
return form ;
};

q2 ?p2 MQr /2}M2/ HH i?2 +QMi`QHb i?i Qm` bBKTH2 TBMi T`Q;`K
M22/b- #mi Bi +QmH/ biBHH mb2  72r KQ`2 iQQHbX

6BMBb?BM; mT
q2 +M 2bBHv //  i2ti iQQH i?i mb2b prompt iQ bF i?2 mb2` r?B+? bi`BM;
Bi b?QmH/ /`rX
tools . Text = function ( event , cx ) {
var text = prompt (" Text :" , "") ;
if ( text ) {
var pos = relativePos ( event , cx . canvas );
cx . font = Math . max (7 , cx . lineWidth ) + " px sans - serif ";
cx . fillText ( text , pos .x , pos .y) ;
}
};

uQm +QmH/ // 2ti` }2H/b 7Q` i?2 7QMi bBx2 M/ i?2 7QMi- #mi 7Q` bBKTHB+@
BivǶb bF2- r2 Hrvb mb2  bMb@b2`B7 7QMi M/ #b2 i?2 7QMi bBx2 QM i?2
+m``2Mi #`mb? bBx2X h?2 KBMBKmK bBx2 Bb d TBt2Hb #2+mb2 i2ti bKHH2`
i?M i?i Bb mM`2/#H2X
MQi?2` BM/BbT2Mb#H2 iQQH 7Q` /`rBM; Ki2m`Bb? +QKTmi2` ;`T?B+b
Bb i?2 bT`v TBMi iQQHX h?Bb QM2 /`rb /Qib BM `M/QK HQ+iBQMb mM/2`
i?2 #`mb? b HQM; b i?2 KQmb2 Bb ?2H/ /QrM- +`2iBM; /2Mb2` Q` H2bb /2Mb2

jdy
bT2+FHBM; #b2/ QM ?Qr 7bi Q` bHQr i?2 KQmb2 KQp2bX
tools . Spray = function ( event , cx ) {
var radius = cx . lineWidth / 2;
var area = radius * radius * Math . PI ;
var dotsPerTick = Math . ceil ( area / 30) ;

var currentPos = relativePos ( event , cx . canvas ) ;


var spray = setInterval ( function () {
for ( var i = 0; i < dotsPerTick ; i ++) {
var offset = randomPointInRadius ( radius );
cx . fillRect ( currentPos . x + offset .x ,
currentPos . y + offset .y , 1 , 1) ;
}
} , 25) ;
trackDrag ( function ( event ) {
currentPos = relativePos ( event , cx . canvas ) ;
} , function () {
clearInterval ( spray );
}) ;
};

h?2 bT`v iQQH mb2b setInterval iQ bTBi Qmi +QHQ`2/ /Qib 2p2`v k8 KBHHBb2+@
QM/b b HQM; b i?2 KQmb2 #miiQM Bb ?2H/ /QrMX h?2 trackDrag 7mM+iBQM
Bb mb2/ iQ F22T currentPos TQBMiBM; i i?2 +m``2Mi KQmb2 TQbBiBQM M/ iQ
im`M Qz i?2 BMi2`pH r?2M i?2 KQmb2 #miiQM Bb `2H2b2/X
hQ /2i2`KBM2 ?Qr KMv /Qib iQ /`r 2p2`v iBK2 i?2 BMi2`pH }`2b-
i?2 7mM+iBQM +QKTmi2b i?2 `2 Q7 i?2 +m``2Mi #`mb? M/ /BpB/2b i?i #v
jyX hQ }M/  `M/QK TQbBiBQM mM/2` i?2 #`mb?- i?2 randomPointInRadius
7mM+iBQM Bb mb2/X
function randomPointInRadius ( radius ) {
for (;;) {
var x = Math . random () * 2 - 1;
var y = Math . random () * 2 - 1;
if ( x * x + y * y <= 1)
return { x : x * radius , y : y * radius };
}
}

h?Bb 7mM+iBQM ;2M2`i2b TQBMib BM i?2 b[m`2 #2ir22M U@R-@RV M/ UR-RVX
lbBM; i?2 Svi?;Q`2M i?2Q`2K- Bi i2bib r?2i?2` i?2 ;2M2`i2/ TQBMi HB2b

jdR
rBi?BM  +B`+H2 Q7 `/Bmb RX b bQQM b i?2 7mM+iBQM }M/b bm+?  TQBMi- Bi
`2im`Mb i?2 TQBMi KmHiBTHB2/ #v i?2 radius `;mK2MiX
h?2 HQQT Bb M2+2bb`v 7Q`  mMB7Q`K /Bbi`B#miBQM Q7 /QibX h?2 bi`B;?i@
7Q`r`/ rv Q7 ;2M2`iBM;  `M/QK TQBMi rBi?BM  +B`+H2 rQmH/ #2 iQ mb2
 `M/QK M;H2 M/ /BbiM+2 M/ +HH Math.sin M/ Math.cos iQ +`2i2 i?2
+Q``2bTQM/BM; TQBMiX "mi rBi? i?i K2i?Q/- i?2 /Qib `2 KQ`2 HBF2Hv iQ
TT2` M2` i?2 +2Mi2` Q7 i?2 +B`+H2X h?2`2 `2 Qi?2` rvb `QmM/ i?i-
#mi i?2vǶ`2 KQ`2 +QKTHB+i2/ i?M i?2 T`2pBQmb HQQTX
q2 MQr ?p2  7mM+iBQMBM; TBMi T`Q;`KXU5BMi2`+iBp2 _mM i?2 +Q/2
#2HQr iQ i`v BiX5V

1t2`+Bb2b
h?2`2 Bb biBHH TH2Miv Q7 `QQK 7Q` BKT`Qp2K2Mi BM i?Bb T`Q;`KX G2iǶb //
 72r KQ`2 72im`2b b 2t2`+Bb2bX

_2+iM;H2b
.2}M2  iQQH +HH2/ Rectangle i?i }HHb  `2+iM;H2 Ub22 i?2 fillRect K2i?Q/
7`QK *?Ti2` ReV rBi? i?2 +m``2Mi +QHQ`X h?2 `2+iM;H2 b?QmH/ bTM 7`QK
i?2 TQBMi r?2`2 i?2 mb2` T`2bb2/ i?2 KQmb2 #miiQM iQ i?2 TQBMi r?2`2
i?2v `2H2b2/ BiX LQi2 i?i i?2 Hii2` KB;?i #2 #Qp2 Q` iQ i?2 H27i Q7
i?2 7Q`K2`X
PM+2 Bi rQ`Fb- vQmǶHH MQiB+2 i?i Bi Bb bQK2r?i D``BM; iQ MQi b22
i?2 `2+iM;H2 b vQm `2 /`;;BM; i?2 KQmb2 iQ b2H2+i Bib bBx2X *M
vQm +QK2 mT rBi?  rv iQ b?Qr bQK2 FBM/ Q7 `2+iM;H2 /m`BM; i?2
/`;;BM;- rBi?Qmi +imHHv /`rBM; iQ i?2 +Mpb mMiBH i?2 KQmb2 #miiQM
Bb `2H2b2/\
A7 MQi?BM; +QK2b iQ KBM/- i?BMF #+F iQ i?2 position: absolute bivH2
/Bb+mbb2/ BM *?Ti2` Rj- r?B+? +M #2 mb2/ iQ Qp2`Hv  MQ/2 QM i?2 `2bi
Q7 i?2 /Q+mK2MiX h?2 pageX M/ pageY T`QT2`iB2b Q7  KQmb2 2p2Mi +M
#2 mb2/ iQ TQbBiBQM M 2H2K2Mi T`2+Bb2Hv mM/2` i?2 KQmb2- #v b2iiBM; i?2
left- top- width- M/ height bivH2b iQ i?2 +Q``2+i TBt2H pHm2bX

jdk
*QHQ` TB+F2`
MQi?2` iQQH i?i Bb +QKKQMHv 7QmM/ BM ;`T?B+b T`Q;`Kb Bb  +QHQ`
TB+F2`- r?B+? HHQrb i?2 mb2` iQ +HB+F i?2 TB+im`2 M/ b2H2+ib i?2 +QHQ`
mM/2` i?2 KQmb2 TQBMi2`X "mBH/ i?BbX
6Q` i?Bb iQQH- r2 M22/  rv iQ ++2bb i?2 +QMi2Mi Q7 i?2 +MpbX h?2
toDataURL K2i?Q/ KQ`2 Q` H2bb /B/ i?i- #mi ;2iiBM; TBt2H BM7Q`KiBQM Qmi
Q7 bm+?  /i l_G Bb ?`/X AMbi2/- r2ǶHH mb2 i?2 getImageData K2i?Q/ QM
i?2 /`rBM; +QMi2ti- r?B+? `2im`Mb  `2+iM;mH` TB2+2 Q7 i?2 BK;2 b
M Q#D2+i rBi? width- height- M/ data T`QT2`iB2bX h?2 data T`QT2`iv ?QH/b
M ``v Q7 MmK#2`b 7`QK y iQ k88- mbBM; 7Qm` MmK#2`b iQ `2T`2b2Mi 2+?
TBt2HǶb `2/- ;`22M- #Hm2- M/ HT? UQT[m2M2bbV +QKTQM2MibX
h?Bb 2tKTH2 `2i`B2p2b i?2 MmK#2`b 7Q`  bBM;H2 TBt2H 7`QK  +Mpb
QM+2 r?2M i?2 +Mpb Bb #HMF UHH TBt2Hb `2 i`MbT`2Mi #H+FV M/
QM+2 r?2M i?2 TBt2H ?b #22M +QHQ`2/ `2/X
function pixelAt ( cx , x , y ) {
var data = cx . getImageData (x , y , 1 , 1) ;
console . log ( data . data ) ;
}

var canvas = document . createElement (" canvas ") ;


var cx = canvas . getContext ("2 d ") ;
pixelAt ( cx , 10 , 10) ;
// → [0 , 0 , 0 , 0]

cx . fillStyle = " red ";


cx . fillRect (10 , 10 , 1 , 1) ;
pixelAt ( cx , 10 , 10) ;
// → [255 , 0 , 0, 255]

h?2 `;mK2Mib iQ getImageData BM/B+i2 i?2 bi`iBM; t@ M/ v@+QQ`/BMi2b


Q7 i?2 `2+iM;H2 r2 rMi iQ `2i`B2p2- 7QHHQr2/ #v Bib rB/i? M/ ?2B;?iX
A;MQ`2 i`MbT`2M+v /m`BM; i?Bb 2t2`+Bb2 M/ HQQF QMHv i i?2 }`bi i?`22
pHm2b 7Q`  ;Bp2M TBt2HX HbQ- /Q MQi rQ``v #Qmi mT/iBM; i?2 +QHQ` }2H/
r?2M i?2 mb2` TB+Fb  +QHQ`X Cmbi KF2 bm`2 i?i i?2 /`rBM; +QMi2tiǶb
fillStyle M/ strokeStyle `2 b2i iQ i?2 +QHQ` mM/2` i?2 KQmb2 +m`bQ`X
_2K2K#2` i?i i?2b2 T`QT2`iB2b ++2Ti Mv +QHQ` i?i *aa mM/2`@
biM/b- r?B+? BM+Hm/2b i?2 rgb(R, G, B) bivH2 vQm br BM *?Ti2` R8X
h?2 getImageData K2i?Q/ Bb bm#D2+i iQ i?2 bK2 `2bi`B+iBQMb b toDataURL

jdj
ěBi rBHH `Bb2 M 2``Q` r?2M i?2 +Mpb +QMiBMb TBt2Hb i?i Q`B;BMi2
7`QK MQi?2` /QKBMX lb2  try/catch bii2K2Mi iQ `2TQ`i bm+? 2``Q`b
rBi? M alert /BHQ;X

6HQQ/ }HH
h?Bb Bb  KQ`2 /pM+2/ 2t2`+Bb2 i?M i?2 T`2+2/BM; irQ- M/ Bi rBHH
`2[mB`2 vQm iQ /2bB;M  MQMi`BpBH bQHmiBQM iQ  i`B+Fv T`Q#H2KX JF2
bm`2 vQm ?p2 TH2Miv Q7 iBK2 M/ TiB2M+2 #27Q`2 bi`iBM; iQ rQ`F QM i?Bb
2t2`+Bb2- M/ /Q MQi ;2i /Bb+Qm`;2/ #v BMBiBH 7BHm`2bX
 ~QQ/ }HH iQQH +QHQ`b i?2 TBt2H mM/2` i?2 KQmb2 M/ i?2 bm``QmM/@
BM; TBt2Hb Q7 i?2 bK2 +QHQ`X 6Q` i?2 Tm`TQb2 Q7 i?Bb 2t2`+Bb2- r2 rBHH
+QMbB/2` bm+?  ;`QmT iQ BM+Hm/2 HH TBt2Hb i?i +M #2 `2+?2/ 7`QK Qm`
bi`iBM; TBt2H #v KQpBM; BM bBM;H2@TBt2H ?Q`BxQMiH M/ p2`iB+H bi2Tb UMQi
/B;QMHV- rBi?Qmi 2p2` iQm+?BM;  TBt2H i?i ?b  +QHQ` /Bz2`2Mi 7`QK
i?2 bi`iBM; TBt2HX
h?2 7QHHQrBM; BK;2 BHHmbi`i2b i?2 b2i Q7 TBt2Hb +QHQ`2/ r?2M i?2 ~QQ/
}HH iQQH Bb mb2/ i i?2 K`F2/ TBt2H,

h?2 ~QQ/ }HH /Q2b MQi H2F i?`Qm;? /B;QMH ;Tb M/ /Q2b MQi iQm+?
TBt2Hb i?i `2 MQi `2+?#H2- 2p2M B7 i?2v ?p2 i?2 bK2 +QHQ` b i?2
i`;2i TBt2HX
uQm rBHH QM+2 ;BM M22/ getImageData iQ }M/ Qmi i?2 +QHQ` 7Q` 2+?
TBt2HX Ai Bb T`Q##Hv  ;QQ/ B/2 iQ 72i+? i?2 r?QH2 BK;2 BM QM2 ;Q
M/ i?2M TB+F Qmi TBt2H /i 7`QK i?2 `2bmHiBM; ``vX h?2 TBt2Hb `2
Q`;MBx2/ BM i?Bb ``v BM  bBKBH` rv iQ i?2 ;`B/ 2H2K2Mib BM *?Ti2`
d- QM2 `Qr i  iBK2- 2t+2Ti i?i 2+? TBt2H Bb `2T`2b2Mi2/ #v 7Qm` pHm2bX
h?2 }`bi pHm2 7Q` i?2 TBt2H i Ut-vV Bb i TQbBiBQM Ut Y v × rB/i?V × 9X
.Q BM+Hm/2 i?2 7Qm`i? UHT?V pHm2 i?Bb iBK2 bBM+2 r2 rMi iQ #2 #H2
iQ i2HH i?2 /Bz2`2M+2 #2ir22M 2KTiv M/ #H+F TBt2HbX

jd9
6BM/BM; HH /D+2Mi TBt2Hb rBi? i?2 bK2 +QHQ` `2[mB`2b vQm iQ dzrHFǴ
Qp2` i?2 TBt2H bm`7+2- QM2 TBt2H mT- /QrM- H27i- Q` `B;?i- b HQM; b M2r
bK2@+QHQ`2/ TBt2Hb +M #2 7QmM/X "mi vQm rQMǶi }M/ HH TBt2Hb BM 
;`QmT QM i?2 }`bi rHFX _i?2`- vQm ?p2 iQ /Q bQK2i?BM; bBKBH` iQ
i?2 #+Fi`+FBM; /QM2 #v i?2 `2;mH` 2tT`2bbBQM Ki+?2`- /2b+`B#2/ BM
*?Ti2` NX q?2M2p2` KQ`2 i?M QM2 TQbbB#H2 /B`2+iBQM iQ T`Q+22/ Bb
b22M- vQm Kmbi biQ`2 HH i?2 /B`2+iBQMb vQm /Q MQi iF2 BKK2/Bi2Hv M/
HQQF i i?2K Hi2`- r?2M vQm }MBb? vQm` +m``2Mi rHFX
AM  MQ`KH@bBx2/ TB+im`2- i?2`2 `2  HQi Q7 TBt2HbX h?mb- vQm Kmbi
iF2 +`2 iQ /Q i?2 KBMBKH KQmMi Q7 rQ`F `2[mB`2/ Q` vQm` T`Q;`K
rBHH iF2  p2`v HQM; iBK2 iQ `mMX 6Q` 2tKTH2- 2p2`v rHF Kmbi B;MQ`2
TBt2Hb b22M #v T`2pBQmb rHFb bQ i?i Bi /Q2b MQi `2/Q rQ`F i?i ?b
H`2/v #22M /QM2X
A `2+QKK2M/ +HHBM; fillRect 7Q` BM/BpB/mH TBt2Hb r?2M  TBt2H i?i
b?QmH/ #2 +QHQ`2/ Bb 7QmM/- M/ F22TBM; bQK2 /i bi`m+im`2 i?i i2HHb
vQm #Qmi HH i?2 TBt2Hb i?i ?p2 H`2/v #22M HQQF2/ iX

jd8
dz bim/2Mi bF2/ ǵh?2 T`Q;`KK2`b Q7 QH/ mb2/ QMHv bBKTH2
K+?BM2b M/ MQ T`Q;`KKBM; HM;m;2b- v2i i?2v K/2
#2miB7mH T`Q;`KbX q?v /Q r2 mb2 +QKTHB+i2/ K+?BM2b M/
T`Q;`KKBM; HM;m;2b\ǶX 6m@hxm `2THB2/ ǵh?2 #mBH/2`b Q7 QH/
mb2/ QMHv biB+Fb M/ +Hv- v2i i?2v K/2 #2miB7mH ?mibXǴǶ
ěJbi2` umM@J- h?2 "QQF Q7 S`Q;`KKBM;

ky LQ/2XDb
aQ 7`- vQm ?p2 H2`M2/ i?2 Cpa+`BTi HM;m;2 M/ mb2/ Bi rBi?BM 
bBM;H2 2MpB`QMK2Mi, i?2 #`Qrb2`X h?Bb +?Ti2` M/ i?2 M2ti QM2 rBHH
#`B2~v BMi`Q/m+2 vQm iQ LQ/2XDb-  T`Q;`K i?i HHQrb vQm iQ TTHv
vQm` Cpa+`BTi bFBHHb QmibB/2 Q7 i?2 #`Qrb2`X qBi? Bi- vQm +M #mBH/
Mvi?BM; 7`QK bBKTH2 +QKKM/@HBM2 iQQHb iQ /vMKB+ >hhS b2`p2`bX
h?2b2 +?Ti2`b BK iQ i2+? vQm i?2 BKTQ`iMi B/2b i?i LQ/2XDb
#mBH/b QM M/ iQ ;Bp2 vQm 2MQm;? BM7Q`KiBQM iQ r`Bi2 bQK2 mb27mH T`Q@
;`Kb 7Q` BiX h?2v /Q MQi i`v iQ #2  +QKTH2i2- Q` 2p2M  i?Q`Qm;?-
i`2iK2Mi Q7 LQ/2X
A7 vQm rMi iQ 7QHHQr HQM; M/ `mM i?2 +Q/2 BM i?Bb +?Ti2`- bi`i #v
;QBM; iQ MQ/2DbXQ`; M/ 7QHHQrBM; i?2 BMbiHHiBQM BMbi`m+iBQMb 7Q` vQm`
QT2`iBM; bvbi2KX HbQ `272` iQ i?i r2#bBi2 7Q` 7m`i?2` /Q+mK2MiiBQM
#Qmi LQ/2 M/ Bib #mBHi@BM KQ/mH2bX

"+F;`QmM/
PM2 Q7 i?2 KQ`2 /B{+mHi T`Q#H2Kb rBi? r`BiBM; bvbi2Kb i?i +QKKmMB@
+i2 Qp2` i?2 M2irQ`F Bb KM;BM; BMTmi M/ QmiTmiěi?i Bb- i?2 `2/BM;
M/ r`BiBM; Q7 /i iQ M/ 7`QK i?2 M2irQ`F- i?2 ?`/ /`Bp2- M/ Qi?2`
bm+? /2pB+2bX JQpBM; /i `QmM/ iF2b iBK2- M/ b+?2/mHBM; Bi +H2p2`Hv
+M KF2  #B; /Bz2`2M+2 BM ?Qr [mB+FHv  bvbi2K `2bTQM/b iQ i?2 mb2`
Q` iQ M2irQ`F `2[m2bibX
h?2 i`/BiBQMH rv iQ ?M/H2 BMTmi M/ QmiTmi Bb iQ ?p2  7mM+iBQM-
bm+? b readFile- bi`i `2/BM;  }H2 M/ `2im`M QMHv r?2M i?2 }H2 ?b #22M
7mHHv `2/X h?Bb Bb +HH2/ bvM+?`QMQmb AfP UAfP biM/b 7Q` BMTmifQmiTmiVX
LQ/2 rb BMBiBHHv +QM+2Bp2/ 7Q` i?2 Tm`TQb2 Q7 KFBM; bvM+?`QMQmb
AfP 2bv M/ +QMp2MB2MiX q2 ?p2 b22M bvM+?`QMQmb BMi2`7+2b #27Q`2-
bm+? b  #`Qrb2`Ƕb XMLHttpRequest Q#D2+i- /Bb+mbb2/ BM *?Ti2` RdX M
bvM+?`QMQmb BMi2`7+2 HHQrb i?2 b+`BTi iQ +QMiBMm2 `mMMBM; r?BH2 Bi /Q2b

jde
Bib rQ`F M/ +HHb  +HH#+F 7mM+iBQM r?2M BiǶb /QM2X h?Bb Bb i?2 rv
LQ/2 /Q2b HH Bib AfPX
Cpa+`BTi H2M/b Bib2H7 r2HH iQ  bvbi2K HBF2 LQ/2X Ai Bb QM2 Q7 i?2 72r
T`Q;`KKBM; HM;m;2b i?i /Q2b MQi ?p2  #mBHi@BM rv iQ /Q AfPX
h?mb- Cpa+`BTi +QmH/ #2 }i QMiQ LQ/2Ƕb `i?2` 2++2Mi`B+ TT`Q+? iQ
AfP rBi?Qmi 2M/BM; mT rBi? irQ BM+QMbBbi2Mi BMi2`7+2bX AM kyyN- r?2M
LQ/2 rb #2BM; /2bB;M2/- T2QTH2 r2`2 H`2/v /QBM; +HH#+F@#b2/ AfP
BM i?2 #`Qrb2`- bQ i?2 +QKKmMBiv `QmM/ i?2 HM;m;2 rb mb2/ iQ M
bvM+?`QMQmb T`Q;`KKBM; bivH2X

bvM+?`QMB+Biv
AǶHH i`v iQ BHHmbi`i2 bvM+?`QMQmb p2`bmb bvM+?`QMQmb AfP rBi?  bKHH
2tKTH2- r?2`2  T`Q;`K M22/b iQ 72i+? irQ `2bQm`+2b 7`QK i?2 AMi2`M2i
M/ i?2M /Q bQK2 bBKTH2 T`Q+2bbBM; rBi? i?2 `2bmHiX
AM  bvM+?`QMQmb 2MpB`QMK2Mi- i?2 Q#pBQmb rv iQ T2`7Q`K i?Bb ibF Bb
iQ KF2 i?2 `2[m2bib QM2 7i2` i?2 Qi?2`X h?Bb K2i?Q/ ?b i?2 /`r#+F
i?i i?2 b2+QM/ `2[m2bi rBHH #2 bi`i2/ QMHv r?2M i?2 }`bi ?b }MBb?2/X
h?2 iQiH iBK2 iF2M rBHH #2 i H2bi i?2 bmK Q7 i?2 irQ `2bTQMb2 iBK2bX
h?Bb Bb MQi M 2z2+iBp2 mb2 Q7 i?2 K+?BM2- r?B+? rBHH #2 KQbiHv B/H2
r?2M Bi Bb i`MbKBiiBM; M/ `2+2BpBM; /i Qp2` i?2 M2irQ`FX
h?2 bQHmiBQM iQ i?Bb T`Q#H2K- BM  bvM+?`QMQmb bvbi2K- Bb iQ bi`i
//BiBQMH i?`2/b Q7 +QMi`QHX U_272` iQ *?Ti2` R9 7Q`  T`2pBQmb /Bb@
+mbbBQM Q7 i?`2/bXV  b2+QM/ i?`2/ +QmH/ bi`i i?2 b2+QM/ `2[m2bi- M/
i?2M #Qi? i?`2/b rBi 7Q` i?2B` `2bmHib iQ +QK2 #+F- 7i2` r?B+? i?2v
`2bvM+?`QMBx2 iQ +QK#BM2 i?2B` `2bmHibX
AM i?2 7QHHQrBM; /B;`K- i?2 i?B+F HBM2b `2T`2b2Mi iBK2 i?2 T`Q;`K
bT2M/b `mMMBM; MQ`KHHv- M/ i?2 i?BM HBM2b `2T`2b2Mi iBK2 bT2Mi rBiBM;
7Q` AfPX AM i?2 bvM+?`QMQmb KQ/2H- i?2 iBK2 iF2M #v AfP Bb T`i Q7
i?2 iBK2HBM2 7Q`  ;Bp2M i?`2/ Q7 +QMi`QHX AM i?2 bvM+?`QMQmb KQ/2H-
bi`iBM; M AfP +iBQM +QM+2TimHHv +mb2b  bTHBi BM i?2 iBK2HBM2X h?2
i?`2/ i?i BMBiBi2/ i?2 AfP +QMiBMm2b `mMMBM;- M/ i?2 AfP Bib2H7 Bb
/QM2 HQM;bB/2 Bi- }MHHv +HHBM;  +HH#+F 7mM+iBQM r?2M Bi Bb }MBb?2/X

jdd
synchronous, single thread of control

synchronous, two threads of control

asynchronous

MQi?2` rv iQ 2tT`2bb i?Bb /Bz2`2M+2 Bb i?i rBiBM; 7Q` AfP iQ }MBb? Bb
BKTHB+Bi BM i?2 bvM+?`QMQmb KQ/2H- r?BH2 Bi Bb 2tTHB+Bi- /B`2+iHv mM/2` Qm`
+QMi`QH- BM i?2 bvM+?`QMQmb QM2X "mi bvM+?`QMB+Biv +mib #Qi? rvbX
Ai KF2b 2tT`2bbBM; T`Q;`Kb i?i /Q MQi }i i?2 bi`B;?i@HBM2 KQ/2H Q7
+QMi`QH 2bB2`- #mi Bi HbQ KF2b 2tT`2bbBM; T`Q;`Kb i?i /Q 7QHHQr 
bi`B;?i HBM2 KQ`2 rFr`/X
AM *?Ti2` Rd- A H`2/v iQm+?2/ QM i?2 7+i i?i HH i?Qb2 +HH#+Fb
// [mBi2  HQi Q7 MQBb2 M/ BM/B`2+iBQM iQ  T`Q;`KX q?2i?2` i?Bb bivH2
Q7 bvM+?`QMB+Biv Bb  ;QQ/ B/2 BM ;2M2`H +M #2 /2#i2/X AM Mv +b2-
Bi iF2b bQK2 ;2iiBM; mb2/ iQX
"mi 7Q`  Cpa+`BTi@#b2/ bvbi2K- A rQmH/ `;m2 i?i +HH#+F@bivH2
bvM+?`QMB+Biv Bb  b2MbB#H2 +?QB+2X PM2 Q7 i?2 bi`2M;i?b Q7 Cpa+`BTi Bb
Bib bBKTHB+Biv- M/ i`vBM; iQ // KmHiBTH2 i?`2/b Q7 +QMi`QH iQ Bi rQmH/
//  HQi Q7 +QKTH2tBivX h?Qm;? +HH#+Fb /QMǶi i2M/ iQ H2/ iQ bBKTH2
+Q/2- b  +QM+2Ti- i?2vǶ`2 TH2bMiHv bBKTH2 v2i TQr2`7mH 2MQm;? iQ r`Bi2
?B;?@T2`7Q`KM+2 r2# b2`p2`bX

h?2 MQ/2 +QKKM/


q?2M LQ/2XDb Bb BMbiHH2/ QM  bvbi2K- Bi T`QpB/2b  T`Q;`K +HH2/
node- r?B+? Bb mb2/ iQ `mM Cpa+`BTi }H2bX av vQm ?p2  }H2 hello.js-
+QMiBMBM; i?Bb +Q/2,
var message = " Hello world ";
console . log ( message ) ;

uQm +M i?2M `mM node 7`QK i?2 +QKKM/ HBM2 HBF2 i?Bb iQ 2t2+mi2 i?2
T`Q;`K,
$ node hello . js

jd3
Hello world

h?2 console.log K2i?Q/ BM LQ/2 /Q2b bQK2i?BM; bBKBH` iQ r?i Bi /Q2b


BM i?2 #`Qrb2`X Ai T`BMib Qmi  TB2+2 Q7 i2tiX "mi BM LQ/2- i?2 i2ti rBHH
;Q iQ i?2 T`Q+2bbǶ biM/`/ QmiTmi bi`2K- `i?2` i?M iQ  #`Qrb2`Ƕb
Cpa+`BTi +QMbQH2X
A7 vQm `mM node rBi?Qmi ;BpBM; Bi  }H2- Bi T`QpB/2b vQm rBi?  T`QKTi
i r?B+? vQm +M ivT2 Cpa+`BTi +Q/2 M/ BKK2/Bi2Hv b22 i?2 `2bmHiX
$ node
> 1 + 1
2
> [ -1 , -2 , -3]. map ( Math . abs )
[1 , 2 , 3]
> process . exit (0)
$

h?2 process p`B#H2- Dmbi HBF2 i?2 console p`B#H2- Bb pBH#H2 ;HQ#HHv BM
LQ/2X Ai T`QpB/2b p`BQmb rvb iQ BMbT2+i M/ KMBTmHi2 i?2 +m``2Mi
T`Q;`KX h?2 exit K2i?Q/ 2M/b i?2 T`Q+2bb M/ +M #2 ;Bp2M M 2tBi
biimb +Q/2- r?B+? i2HHb i?2 T`Q;`K i?i bi`i2/ node UBM i?Bb +b2- i?2
+QKKM/@HBM2 b?2HHV r?2i?2` i?2 T`Q;`K +QKTH2i2/ bm++2bb7mHHv U+Q/2
x2`QV Q` 2M+QmMi2`2/ M 2``Q` UMv Qi?2` +Q/2VX
hQ }M/ i?2 +QKKM/@HBM2 `;mK2Mib ;Bp2M iQ vQm` b+`BTi- vQm +M
`2/ process.argv- r?B+? Bb M ``v Q7 bi`BM;bX LQi2 i?i Bi HbQ BM+Hm/2b
i?2 MK2 Q7 i?2 node +QKKM/ M/ vQm` b+`BTi MK2- bQ i?2 +imH
`;mK2Mib bi`i i BM/2t kX A7 showargv.js bBKTHv +QMiBMb i?2 bii2K2Mi
console.log(process.argv)- vQm +QmH/ `mM Bi HBF2 i?Bb,

$ node showargv . js one -- and two


[" node " , "/ home / marijn / showargv . js ", " one " , " - - and " , " two "]

HH i?2 biM/`/ Cpa+`BTi ;HQ#H p`B#H2b- bm+? b Array- Math- M/ JSON-
`2 HbQ T`2b2Mi BM LQ/2Ƕb 2MpB`QMK2MiX "`Qrb2`@`2Hi2/ 7mM+iBQMHBiv-
bm+? b document M/ alert- Bb #b2MiX
h?2 ;HQ#H b+QT2 Q#D2+i- r?B+? Bb +HH2/ window BM i?2 #`Qrb2`- ?b i?2
KQ`2 b2MbB#H2 MK2 global BM LQ/2X

jdN
JQ/mH2b
"2vQM/ i?2 72r p`B#H2b A K2MiBQM2/- bm+? b console M/ process- LQ/2
Tmib HBiiH2 7mM+iBQMHBiv BM i?2 ;HQ#H b+QT2X A7 vQm rMi iQ ++2bb Qi?2`
#mBHi@BM 7mM+iBQMHBiv- vQm ?p2 iQ bF i?2 KQ/mH2 bvbi2K 7Q` BiX
h?2 *QKKQMCa KQ/mH2 bvbi2K- #b2/ QM i?2 require 7mM+iBQM- rb
/2b+`B#2/ BM *?Ti2` RyX h?Bb bvbi2K Bb #mBHi BMiQ LQ/2 M/ Bb mb2/ iQ
HQ/ Mvi?BM; 7`QK #mBHi@BM KQ/mH2b iQ /QrMHQ/2/ HB#``B2b iQ }H2b i?i
`2 T`i Q7 vQm` QrM T`Q;`KX
q?2M require Bb +HH2/- LQ/2 ?b iQ `2bQHp2 i?2 ;Bp2M bi`BM; iQ M +imH
}H2 iQ HQ/X Si?MK2b i?i bi`i rBi? "/"- "./"- Q` "../" `2 `2bQHp2/
`2HiBp2 iQ i?2 +m``2Mi KQ/mH2Ƕb Ti?- r?2`2 "./" biM/b 7Q` i?2 +m``2Mi
/B`2+iQ`v- "../" 7Q` QM2 /B`2+iQ`v mT- M/ "/" 7Q` i?2 `QQi Q7 i?2 }H2
bvbi2KX aQ B7 vQm bF 7Q` "./world/world" 7`QK i?2 }H2 /home/marijn/elife/
run.js- LQ/2 rBHH i`v iQ HQ/ i?2 }H2 /home/marijn/elife/world/world.jsX h?2
.js 2ti2MbBQM Kv #2 QKBii2/X
q?2M  bi`BM; i?i /Q2b MQi HQQF HBF2  `2HiBp2 Q` #bQHmi2 Ti? Bb
;Bp2M iQ require- Bi Bb bbmK2/ iQ `272` iQ 2Bi?2`  #mBHi@BM KQ/mH2 Q` 
KQ/mH2 BMbiHH2/ BM  node_modules /B`2+iQ`vX 6Q` 2tKTH2- require("fs")
rBHH ;Bp2 vQm LQ/2Ƕb #mBHi@BM }H2 bvbi2K KQ/mH2- M/ require("elife") rBHH
i`v iQ HQ/ i?2 HB#``v 7QmM/ BM node_modules/elife/X  +QKKQM rv iQ
BMbiHH bm+? HB#``B2b Bb #v mbBM; LSJ- r?B+? A rBHH /Bb+mbb BM  KQK2MiX
hQ BHHmbi`i2 i?2 mb2 Q7 require- H2iǶb b2i mT  bBKTH2 T`QD2+i +QMbBbiBM;
Q7 irQ }H2bX h?2 }`bi QM2 Bb +HH2/ main.js- r?B+? /2}M2b  b+`BTi i?i
+M #2 +HH2/ 7`QK i?2 +QKKM/ HBM2 iQ ;`#H2  bi`BM;X
var garble = require ("./ garble ") ;

// Index 2 holds the first actual command - line argument


var argument = process . argv [2];

console . log ( garble ( argument )) ;

h?2 }H2 garble.js /2}M2b  HB#``v 7Q` ;`#HBM; bi`BM;b- r?B+? +M #2 mb2/
#Qi? #v i?2 +QKKM/@HBM2 iQQH /2}M2/ 2`HB2` M/ #v Qi?2` b+`BTib i?i
M22/ /B`2+i ++2bb iQ  ;`#HBM; 7mM+iBQMX
module . exports = function ( string ) {
return string . split ("") . map ( function ( ch ) {

j3y
return String . fromCharCode ( ch . charCodeAt (0) + 5) ;
}) . join ("") ;
};

_2K2K#2` i?i `2TH+BM; module.exports- `i?2` i?M //BM; T`QT2`iB2b


iQ Bi- HHQrb mb iQ 2tTQ`i  bT2+B}+ pHm2 7`QK  KQ/mH2X AM i?Bb +b2- r2
KF2 i?2 `2bmHi Q7 `2[mB`BM; Qm` garble }H2 i?2 ;`#HBM; 7mM+iBQM Bib2H7X
h?2 7mM+iBQM bTHBib i?2 bi`BM; Bi Bb ;Bp2M BMiQ bBM;H2 +?`+i2`b #v bTHBi@
iBM; QM i?2 2KTiv bi`BM; M/ i?2M `2TH+2b 2+? +?`+i2` rBi? i?2 +?`@
+i2` r?Qb2 +Q/2 Bb }p2 TQBMib ?B;?2`X 6BMHHv- Bi DQBMb i?2 `2bmHi #+F
BMiQ  bi`BM;X
q2 +M MQr +HH Qm` iQQH HBF2 i?Bb,
$ node main . js JavaScript
Of { fXhwnuy

AMbiHHBM; rBi? LSJ


LSJ- r?B+? rb #`B2~v /Bb+mbb2/ BM *?Ti2` Ry- Bb M QMHBM2 `2TQbBiQ`v
Q7 Cpa+`BTi KQ/mH2b- KMv Q7 r?B+? `2 bT2+B}+HHv r`Bii2M 7Q` LQ/2X
q?2M vQm BMbiHH LQ/2 QM vQm` +QKTmi2`- vQm HbQ ;2i  T`Q;`K +HH2/
npm- r?B+? T`QpB/2b  +QMp2MB2Mi BMi2`7+2 iQ i?Bb `2TQbBiQ`vX
6Q` 2tKTH2- QM2 KQ/mH2 vQm rBHH }M/ QM LSJ Bb figlet- r?B+? +M
+QMp2`i i2ti BMiQ a*AA `iě/`rBM;b K/2 Qmi Q7 i2ti +?`+i2`bX h?2
7QHHQrBM; i`Mb+`BTi b?Qrb ?Qr iQ BMbiHH M/ mb2 Bi,
$ npm install figlet
npm GET https :// registry . npmjs . org / figlet
npm 200 https :// registry . npmjs . org / figlet
npm GET https :// registry . npmjs . org / figlet / -/ figlet -1.0.9. tgz
npm 200 https :// registry . npmjs . org / figlet / -/ figlet -1.0.9. tgz
figlet@1 .0.9 node_modules / figlet
$ node
> var figlet = require (" figlet ") ;
> figlet . text (" Hello world !" , function ( error , data ) {
if ( error )
console . error ( error );
else
console . log ( data ) ;

j3R
}) ;
_ _ _ _ _ _ _
| | | | ___ | | | ___ __ _____ _ __ | | __ | | |
| |_ | |/ _ \ | |/ _ \ \ \ /\ / / _ \| __ | |/ _ ` | |
| _ | __ / | | ( _ ) | \ V V / (_) | | | | (_| |_|
|_ | |_ |\ ___ |_ |_ |\ ___ / \_ /\ _ / \ ___ /| _| |_ |\ __ ,_( _)

7i2` `mMMBM; npm install- LSJ rBHH ?p2 +`2i2/  /B`2+iQ`v +HH2/
node_modulesX AMbB/2 i?i /B`2+iQ`v rBHH #2  figlet /B`2+iQ`v- r?B+? +QM@
iBMb i?2 HB#``vX q?2M r2 `mM node M/ +HH require("figlet")- i?Bb HB#``v
Bb HQ/2/- M/ r2 +M +HH Bib text K2i?Q/ iQ /`r bQK2 #B; H2ii2`bX
aQK2r?i mM2tT2+i2/Hv T2`?Tb- BMbi2/ Q7 bBKTHv `2im`MBM; i?2 bi`BM;
i?i KF2b mT i?2 #B; H2ii2`b- figlet.text iF2b  +HH#+F 7mM+iBQM i?i Bi
Tbb2b Bib `2bmHi iQX Ai HbQ Tbb2b i?2 +HH#+F MQi?2` `;mK2Mi- error-
r?B+? rBHH ?QH/ M 2``Q` Q#D2+i r?2M bQK2i?BM; ;Q2b r`QM; Q` MmHH r?2M
2p2`vi?BM; Bb HH `B;?iX
h?Bb Bb  +QKKQM Tii2`M BM LQ/2 +Q/2X _2M/2`BM; bQK2i?BM; rBi?
figlet `2[mB`2b i?2 HB#``v iQ `2/  }H2 i?i +QMiBMb i?2 H2ii2` b?T2bX
_2/BM; i?i }H2 7`QK /BbF Bb M bvM+?`QMQmb QT2`iBQM BM LQ/2- bQ
figlet.text +MǶi BKK2/Bi2Hv `2im`M Bib `2bmHiX bvM+?`QMB+Biv Bb BM72+@
iBQmb- BM  rvě2p2`v 7mM+iBQM i?i +HHb M bvM+?`QMQmb 7mM+iBQM Kmbi
Bib2H7 #2+QK2 bvM+?`QMQmbX
h?2`2 Bb Km+? KQ`2 iQ LSJ i?M npm installX Ai `2/b package.json
}H2b- r?B+? +QMiBM CaPL@2M+Q/2/ BM7Q`KiBQM #Qmi  T`Q;`K Q`
HB#``v- bm+? b r?B+? Qi?2` HB#``B2b Bi /2T2M/b QMX .QBM; npm install
BM  /B`2+iQ`v i?i +QMiBMb bm+?  }H2 rBHH miQKiB+HHv BMbiHH HH
/2T2M/2M+B2b- b r2HH b i?2B` /2T2M/2M+B2bX h?2 npm iQQH Bb HbQ mb2/ iQ
Tm#HBb? HB#``B2b iQ LSJǶb QMHBM2 `2TQbBiQ`v Q7 T+F;2b bQ i?i Qi?2`
T2QTH2 +M }M/- /QrMHQ/- M/ mb2 i?2KX
h?Bb #QQF rQMǶi /2Hp2 7m`i?2` BMiQ i?2 /2iBHb Q7 LSJ mb;2X _272` iQ
MTKDbXQ`; 7Q` 7m`i?2` /Q+mK2MiiBQM M/ 7Q` M 2bv rv iQ b2`+? 7Q`
HB#``B2bX

h?2 }H2 bvbi2K KQ/mH2


PM2 Q7 i?2 KQbi +QKKQMHv mb2/ #mBHi@BM KQ/mH2b i?i +QK2b rBi? LQ/2
Bb i?2 "fs" KQ/mH2- r?B+? biM/b 7Q` }H2 bvbi2KX h?Bb KQ/mH2 T`QpB/2b

j3k
7mM+iBQMb 7Q` rQ`FBM; rBi? }H2b M/ /B`2+iQ`B2bX
6Q` 2tKTH2- i?2`2 Bb  7mM+iBQM +HH2/ readFile- r?B+? `2/b  }H2 M/
i?2M +HHb  +HH#+F rBi? i?2 }H2Ƕb +QMi2MibX
var fs = require (" fs ") ;
fs . readFile (" file . txt " , " utf8 " , function ( error , text ) {
if ( error )
throw error ;
console . log (" The file contained :" , text ) ;
}) ;

h?2 b2+QM/ `;mK2Mi iQ readFile BM/B+i2b i?2 +?`+i2` 2M+Q/BM; mb2/


iQ /2+Q/2 i?2 }H2 BMiQ  bi`BM;X h?2`2 `2 b2p2`H rvb BM r?B+? i2ti
+M #2 2M+Q/2/ iQ #BM`v /i- #mi KQbi KQ/2`M bvbi2Kb mb2 lh6@3 iQ
2M+Q/2 i2ti- bQ mMH2bb vQm ?p2 `2bQMb iQ #2HB2p2 MQi?2` 2M+Q/BM; Bb
mb2/- TbbBM; "utf8" r?2M `2/BM;  i2ti }H2 Bb  b72 #2iX A7 vQm /Q MQi
Tbb M 2M+Q/BM;- LQ/2 rBHH bbmK2 vQm `2 BMi2`2bi2/ BM i?2 #BM`v /i
M/ rBHH ;Bp2 vQm  Buffer Q#D2+i BMbi2/ Q7  bi`BM;X h?Bb Bb M ``v@HBF2
Q#D2+i i?i +QMiBMb MmK#2`b `2T`2b2MiBM; i?2 #vi2b BM i?2 }H2bX
var fs = require (" fs ") ;
fs . readFile (" file . txt " , function ( error , buffer ) {
if ( error )
throw error ;
console . log (" The file contained " , buffer . length , " bytes ." ,
" The first byte is :" , buffer [0]) ;
}) ;

 bBKBH` 7mM+iBQM- writeFile- Bb mb2/ iQ r`Bi2  }H2 iQ /BbFX


var fs = require (" fs ") ;
fs . writeFile (" graffiti . txt ", " Node was here " , function ( err ) {
if ( err )
console . log (" Failed to write file :" , err ) ;
else
console . log (" File written .") ;
}) ;

>2`2- Bi rb MQi M2+2bb`v iQ bT2+B7v i?2 2M+Q/BM; bBM+2 writeFile rBHH
bbmK2 i?i B7 Bi Bb ;Bp2M  bi`BM; iQ r`Bi2- `i?2` i?M  Buffer Q#D2+i-
Bi b?QmH/ r`Bi2 Bi Qmi b i2ti mbBM; Bib /27mHi +?`+i2` 2M+Q/BM;- r?B+?
Bb lh6@3X

j3j
h?2 "fs" KQ/mH2 +QMiBMb KMv Qi?2` mb27mH 7mM+iBQMb, readdir rBHH
`2im`M i?2 }H2b BM  /B`2+iQ`v b M ``v Q7 bi`BM;b- stat rBHH `2i`B2p2
BM7Q`KiBQM #Qmi  }H2- rename rBHH `2MK2  }H2- unlink rBHH `2KQp2 QM2-
M/ bQ QMX a22 i?2 /Q+mK2MiiBQM i MQ/2DbXQ`; 7Q` bT2+B}+bX
JMv Q7 i?2 7mM+iBQMb BM "fs" +QK2 BM #Qi? bvM+?`QMQmb M/ bvM@
+?`QMQmb p`BMibX 6Q` 2tKTH2- i?2`2 Bb  bvM+?`QMQmb p2`bBQM Q7 readFile
+HH2/ readFileSyncX
var fs = require (" fs ") ;
console . log ( fs . readFileSync (" file . txt " , " utf8 ") ) ;

avM+?`QMQmb 7mM+iBQMb `2[mB`2 H2bb +2`2KQMv iQ mb2 M/ +M #2 mb27mH BM


bBKTH2 b+`BTib- r?2`2 i?2 2ti` bT22/ T`QpB/2/ #v bvM+?`QMQmb AfP Bb
B``2H2pMiX "mi MQi2 i?i r?BH2 bm+?  bvM+?`QMQmb QT2`iBQM Bb #2BM;
T2`7Q`K2/- vQm` T`Q;`K rBHH #2 biQTT2/ 2MiB`2HvX A7 Bi b?QmH/ #2 `2@
bTQM/BM; iQ i?2 mb2` Q` iQ Qi?2` K+?BM2b QM i?2 M2irQ`F- #2BM; bim+F
QM bvM+?`QMQmb AfP KB;?i T`Q/m+2 MMQvBM; /2HvbX

h?2 >hhS KQ/mH2


MQi?2` +2Mi`H KQ/mH2 Bb +HH2/ "http"X Ai T`QpB/2b 7mM+iBQMHBiv 7Q`
`mMMBM; >hhS b2`p2`b M/ KFBM; >hhS `2[m2bibX
h?Bb Bb HH Bi iF2b iQ bi`i  bBKTH2 >hhS b2`p2`,
var http = require (" http ") ;
var server = http . createServer ( function ( request , response ) {
response . writeHead (200 , {" Content - Type ": " text / html "}) ;
response . write (" < h1 > Hello ! </ h1 > <p > You asked for <code >" +
request . url + " </ code > </p >") ;
response . end () ;
}) ;
server . listen (8000) ;

A7 vQm `mM i?Bb b+`BTi QM vQm` QrM K+?BM2- vQm +M TQBMi vQm` r2#
#`Qrb2` i ?iiT,ffHQ+H?Qbi,3yyyf?2HHQ iQ KF2  `2[m2bi iQ vQm` b2`p2`X
Ai rBHH `2bTQM/ rBi?  bKHH >hJG T;2X
h?2 7mM+iBQM Tbb2/ b M `;mK2Mi iQ createServer Bb +HH2/ 2p2`v
iBK2  +HB2Mi i`B2b iQ +QMM2+i iQ i?2 b2`p2`X h?2 request M/ response
p`B#H2b `2 Q#D2+ib `2T`2b2MiBM; i?2 BM+QKBM; M/ Qmi;QBM; /iX h?2

j39
}`bi +QMiBMb BM7Q`KiBQM #Qmi i?2 `2[m2bi- bm+? b Bib url T`QT2`iv-
r?B+? i2HHb mb iQ r?i l_G i?2 `2[m2bi rb K/2X
hQ b2M/ bQK2i?BM; #+F- vQm +HH K2i?Q/b QM i?2 response Q#D2+iX h?2
}`bi- writeHead- rBHH r`Bi2 Qmi i?2 `2bTQMb2 ?2/2`b Ub22 *?Ti2` RdVX uQm
;Bp2 Bi i?2 biimb +Q/2 Ukyy 7Q` dzPEǴ BM i?Bb +b2V M/ M Q#D2+i i?i
+QMiBMb ?2/2` pHm2bX >2`2 r2 i2HH i?2 +HB2Mi i?i r2 rBHH #2 b2M/BM;
#+F M >hJG /Q+mK2MiX
L2ti- i?2 +imH `2bTQMb2 #Q/v Ui?2 /Q+mK2Mi Bib2H7V Bb b2Mi rBi?
response.writeX uQm `2 HHQr2/ iQ +HH i?Bb K2i?Q/ KmHiBTH2 iBK2b B7
vQm rMi iQ b2M/ i?2 `2bTQMb2 TB2+2 #v TB2+2- TQbbB#Hv bi`2KBM; /i
iQ i?2 +HB2Mi b Bi #2+QK2b pBH#H2X 6BMHHv- response.end bB;MHb i?2 2M/
Q7 i?2 `2bTQMb2X
h?2 +HH iQ server.listen +mb2b i?2 b2`p2` iQ bi`i rBiBM; 7Q` +QMM2+@
iBQMb QM TQ`i 3yyyX h?Bb Bb i?2 `2bQM vQm ?p2 iQ +QMM2+i iQ HQ+H@
?Qbi,3yyy- `i?2` i?M Dmbi HQ+H?Qbi Ur?B+? rQmH/ mb2 i?2 /27mHi TQ`i-
3yV- iQ bT2F iQ i?Bb b2`p2`X
hQ biQT `mMMBM;  LQ/2 b+`BTi HBF2 i?Bb- r?B+? /Q2bMǶi }MBb? miQ@
KiB+HHv #2+mb2 Bi Bb rBiBM; 7Q` 7m`i?2` 2p2Mib UBM i?Bb +b2- M2irQ`F
+QMM2+iBQMbV- T`2bb *i`H@*X
 `2H r2# b2`p2` mbmHHv /Q2b KQ`2 i?M i?2 QM2 BM i?2 T`2pBQmb
2tKTH2ěBi HQQFb i i?2 `2[m2biǶb K2i?Q/ Ui?2 method T`QT2`ivV iQ b22
r?i +iBQM i?2 +HB2Mi Bb i`vBM; iQ T2`7Q`K M/ i i?2 `2[m2biǶb l_G iQ
}M/ Qmi r?B+? `2bQm`+2 i?Bb +iBQM Bb #2BM; T2`7Q`K2/ QMX uQmǶHH b22 
KQ`2 /pM+2/ b2`p2` Hi2` BM i?Bb +?Ti2`X
hQ +i b M >hhS +HB2Mi- r2 +M mb2 i?2 request 7mM+iBQM BM i?2 "http"
KQ/mH2X
var http = require (" http ") ;
var request = http . request ({
hostname : " eloquentjavascript . net ",
path : "/20 _node . html " ,
method : " GET " ,
headers : { Accept : " text / html "}
}, function ( response ) {
console . log (" Server responded with status code " ,
response . statusCode );
}) ;
request . end () ;

j38
h?2 }`bi `;mK2Mi iQ request +QM};m`2b i?2 `2[m2bi- i2HHBM; LQ/2 r?i
b2`p2` iQ iHF iQ- r?i Ti? iQ `2[m2bi 7`QK i?i b2`p2`- r?B+? K2i?Q/
iQ mb2- M/ bQ QMX h?2 b2+QM/ `;mK2Mi Bb i?2 7mM+iBQM i?i b?QmH/ #2
+HH2/ r?2M  `2bTQMb2 +QK2b BMX Ai Bb ;Bp2M M Q#D2+i i?i HHQrb mb iQ
BMbT2+i i?2 `2bTQMb2- 7Q` 2tKTH2 iQ }M/ Qmi Bib biimb +Q/2X
Cmbi HBF2 i?2 response Q#D2+i r2 br BM i?2 b2`p2`- i?2 Q#D2+i `2im`M2/ #v
request HHQrb mb iQ bi`2K /i BMiQ i?2 `2[m2bi rBi? i?2 write K2i?Q/
M/ }MBb? i?2 `2[m2bi rBi? i?2 end K2i?Q/X h?2 2tKTH2 /Q2b MQi mb2
write #2+mb2 GET `2[m2bib b?QmH/ MQi +QMiBM /i BM i?2B` `2[m2bi #Q/vX
hQ KF2 `2[m2bib iQ b2+m`2 >hhS U>hhSaV l_Gb- LQ/2 T`QpB/2b 
T+F;2 +HH2/ https- r?B+? +QMiBMb Bib QrM request 7mM+iBQM- bBKBH` iQ
http.requestX

ai`2Kb
q2 ?p2 b22M irQ 2tKTH2b Q7 r`Bi#H2 bi`2Kb BM i?2 >hhS 2tKTH2bě
MK2Hv- i?2 `2bTQMb2 Q#D2+i i?i i?2 b2`p2` +QmH/ r`Bi2 iQ M/ i?2 `2[m2bi
Q#D2+i i?i rb `2im`M2/ 7`QK http.requestX
q`Bi#H2 bi`2Kb `2  rB/2Hv mb2/ +QM+2Ti BM LQ/2 BMi2`7+2bX HH
r`Bi#H2 bi`2Kb ?p2  write K2i?Q/- r?B+? +M #2 Tbb2/  bi`BM; Q`
 Buffer Q#D2+iX h?2B` end K2i?Q/ +HQb2b i?2 bi`2K M/- B7 ;Bp2M M
`;mK2Mi- rBHH HbQ r`Bi2 Qmi  TB2+2 Q7 /i #27Q`2 Bi /Q2b bQX "Qi? Q7
i?2b2 K2i?Q/b +M HbQ #2 ;Bp2M  +HH#+F b M //BiBQMH `;mK2Mi-
r?B+? i?2v rBHH +HH r?2M i?2 r`BiBM; iQ Q` +HQbBM; Q7 i?2 bi`2K ?b
}MBb?2/X
Ai Bb TQbbB#H2 iQ +`2i2  r`Bi#H2 bi`2K i?i TQBMib i  }H2 rBi? i?2
fs.createWriteStream 7mM+iBQMX h?2M vQm +M mb2 i?2 write K2i?Q/ QM i?2
`2bmHiBM; Q#D2+i iQ r`Bi2 i?2 }H2 QM2 TB2+2 i  iBK2- `i?2` i?M BM QM2
b?Qi b rBi? fs.writeFileX
_2/#H2 bi`2Kb `2  HBiiH2 KQ`2 BMpQHp2/X "Qi? i?2 request p`B#H2
i?i rb Tbb2/ iQ i?2 >hhS b2`p2`Ƕb +HH#+F 7mM+iBQM M/ i?2 response
p`B#H2 Tbb2/ iQ i?2 >hhS +HB2Mi `2 `2/#H2 bi`2KbX U b2`p2` `2/b
`2[m2bib M/ i?2M r`Bi2b `2bTQMb2b- r?2`2b  +HB2Mi }`bi r`Bi2b  `2[m2bi
M/ i?2M `2/b  `2bTQMb2XV _2/BM; 7`QK  bi`2K Bb /QM2 mbBM; 2p2Mi
?M/H2`b- `i?2` i?M K2i?Q/bX
P#D2+ib i?i 2KBi 2p2Mib BM LQ/2 ?p2  K2i?Q/ +HH2/ on i?i Bb

j3e
bBKBH` iQ i?2 addEventListener K2i?Q/ BM i?2 #`Qrb2`X uQm ;Bp2 Bi M
2p2Mi MK2 M/ i?2M  7mM+iBQM- M/ Bi rBHH `2;Bbi2` i?i 7mM+iBQM iQ #2
+HH2/ r?2M2p2` i?2 ;Bp2M 2p2Mi Q++m`bX
_2/#H2 bi`2Kb ?p2 "data" M/ "end" 2p2MibX h?2 }`bi Bb }`2/ 2p@
2`v iBK2 bQK2 /i +QK2b BM- M/ i?2 b2+QM/ Bb +HH2/ r?2M2p2` i?2
bi`2K Bb i Bib 2M/X h?Bb KQ/2H Bb KQbi bmBi2/ 7Q` dzbi`2KBM;Ǵ /i-
r?B+? +M #2 BKK2/Bi2Hv T`Q+2bb2/- 2p2M r?2M i?2 r?QH2 /Q+mK2Mi
BbMǶi pBH#H2 v2iX  }H2 +M #2 `2/ b  `2/#H2 bi`2K #v mbBM; i?2
fs.createReadStream 7mM+iBQMX
h?2 7QHHQrBM; +Q/2 +`2i2b  b2`p2` i?i `2/b `2[m2bi #Q/B2b M/
bi`2Kb i?2K #+F iQ i?2 +HB2Mi b HH@mTT2`+b2 i2ti,
var http = require (" http ") ;
http . createServer ( function ( request , response ) {
response . writeHead (200 , {" Content - Type ": " text / plain "}) ;
request . on (" data " , function ( chunk ) {
response . write ( chunk . toString () . toUpperCase () );
}) ;
request . on (" end " , function () {
response . end () ;
}) ;
}) . listen (8000) ;

h?2 chunk p`B#H2 Tbb2/ iQ i?2 /i ?M/H2` rBHH #2  #BM`v Buffer-
r?B+? r2 +M +QMp2`i iQ  bi`BM; #v +HHBM; toString QM Bi- r?B+? rBHH
/2+Q/2 Bi mbBM; i?2 /27mHi 2M+Q/BM; Ulh6@3VX
h?2 7QHHQrBM; TB2+2 Q7 +Q/2- B7 `mM r?BH2 i?2 mTT2`+bBM; b2`p2` Bb
`mMMBM;- rBHH b2M/  `2[m2bi iQ i?i b2`p2` M/ r`Bi2 Qmi i?2 `2bTQMb2 Bi
;2ib,
var http = require (" http ") ;
var request = http . request ({
hostname : " localhost " ,
port : 8000 ,
method : " POST "
}, function ( response ) {
response . on (" data " , function ( chunk ) {
process . stdout . write ( chunk . toString () ) ;
}) ;
}) ;
request . end (" Hello server ") ;

j3d
h?2 2tKTH2 r`Bi2b iQ process.stdout Ui?2 T`Q+2bbǶ biM/`/ QmiTmi- b
 r`Bi#H2 bi`2KV BMbi2/ Q7 mbBM; console.logX q2 +MǶi mb2 console.log
#2+mb2 Bi //b M 2ti` M2rHBM2 +?`+i2` 7i2` 2+? TB2+2 Q7 i2ti i?i
Bi r`Bi2b- r?B+? BbMǶi TT`QT`Bi2 ?2`2X

 bBKTH2 }H2 b2`p2`


G2iǶb +QK#BM2 Qm` M2r7QmM/ FMQrH2/;2 #Qmi >hhS b2`p2`b M/ iHFBM;
iQ i?2 }H2 bvbi2K M/ +`2i2  #`B/;2 #2ir22M i?2K, M >hhS b2`p2`
i?i HHQrb `2KQi2 ++2bb iQ  }H2 bvbi2KX am+?  b2`p2` ?b KMv mb2bX
Ai HHQrb r2# TTHB+iBQMb iQ biQ`2 M/ b?`2 /i Q` ;Bp2  ;`QmT Q7
T2QTH2 b?`2/ ++2bb iQ  #mM+? Q7 }H2bX
q?2M r2 i`2i }H2b b >hhS `2bQm`+2b- i?2 >hhS K2i?Q/b GET- PUT-
M/ DELETE +M #2 mb2/ iQ `2/- r`Bi2- M/ /2H2i2 i?2 }H2b- `2bT2+iBp2HvX
q2 rBHH BMi2`T`2i i?2 Ti? BM i?2 `2[m2bi b i?2 Ti? Q7 i?2 }H2 i?i i?2
`2[m2bi `272`b iQX
q2 T`Q##Hv /QMǶi rMi iQ b?`2 Qm` r?QH2 }H2 bvbi2K- bQ r2ǶHH BM@
i2`T`2i i?2b2 Ti?b b bi`iBM; BM i?2 b2`p2`Ƕb rQ`FBM; /B`2+iQ`v- r?B+?
Bb i?2 /B`2+iQ`v BM r?B+? Bi rb bi`i2/X A7 A `M i?2 b2`p2` 7`QK /home/
marijn/public/ UQ` C:\Users\marijn\public\ QM qBM/QrbV- i?2M  `2[m2bi 7Q`
/file.txt b?QmH/ `272` iQ /home/marijn/public/file.txt UQ` C:\Users\marijn\
public\file.txtVX
q2ǶHH #mBH/ i?2 T`Q;`K TB2+2 #v TB2+2- mbBM; M Q#D2+i +HH2/ methods
iQ biQ`2 i?2 7mM+iBQMb i?i ?M/H2 i?2 p`BQmb >hhS K2i?Q/bX
var http = require (" http ") , fs = require (" fs ") ;

var methods = Object . create ( null );

http . createServer ( function ( request , response ) {


function respond ( code , body , type ) {
if (! type ) type = " text / plain ";
response . writeHead ( code , {" Content - Type ": type }) ;
if ( body && body . pipe )
body . pipe ( response );
else
response . end ( body );
}

j33
if ( request . method in methods )
methods [ request . method ]( urlToPath ( request . url ) ,
respond , request );
else
respond (405 , " Method " + request . method +
" not allowed .") ;
}) . listen (8000) ;

h?Bb bi`ib  b2`p2` i?i Dmbi `2im`Mb 9y8 2``Q` `2bTQMb2b- r?B+? Bb i?2
+Q/2 mb2/ iQ BM/B+i2 i?i  ;Bp2M K2i?Q/ BbMǶi ?M/H2/ #v i?2 b2`p2`X
h?2 respond 7mM+iBQM Bb Tbb2/ iQ i?2 7mM+iBQMb i?i ?M/H2 i?2 p`BQmb
K2i?Q/b M/ +ib b  +HH#+F iQ }MBb? i?2 `2[m2biX Ai iF2b M >hhS
biimb +Q/2-  #Q/v- M/ QTiBQMHHv  +QMi2Mi ivT2 b `;mK2MibX A7 i?2
pHm2 Tbb2/ b i?2 #Q/v Bb  `2/#H2 bi`2K- Bi rBHH ?p2  pipe K2i?Q/-
r?B+? Bb mb2/ iQ 7Q`r`/  `2/#H2 bi`2K iQ  r`Bi#H2 bi`2KX A7 MQi-
Bi Bb bbmK2/ iQ #2 2Bi?2` null UMQ #Q/vV Q`  bi`BM; M/ Bb Tbb2/ /B`2+iHv
iQ i?2 `2bTQMb2Ƕb end K2i?Q/X
hQ ;2i  Ti? 7`QK i?2 l_G BM i?2 `2[m2bi- i?2 urlToPath 7mM+iBQM mb2b
LQ/2Ƕb #mBHi@BM "url" KQ/mH2 iQ T`b2 i?2 l_GX Ai iF2b Bib Ti?MK2-
r?B+? rBHH #2 bQK2i?BM; HBF2 /file.txt- /2+Q/2b i?i iQ ;2i `B/ Q7 i?2 %20
@bivH2 2b+T2 +Q/2b- M/ T`2}t2b  bBM;H2 /Qi iQ T`Q/m+2  Ti? `2HiBp2
iQ i?2 +m``2Mi /B`2+iQ`vX
function urlToPath ( url ) {
var path = require (" url ") . parse ( url ) . pathname ;
return "." + decodeURIComponent ( path ) ;
}

A7 vQm `2 rQ``B2/ #Qmi i?2 b2+m`Biv Q7 i?2 urlToPath 7mM+iBQM- vQm `2
`B;?iX q2 rBHH `2im`M iQ i?i BM i?2 2t2`+Bb2bX
q2 rBHH b2i mT i?2 GET K2i?Q/ iQ `2im`M  HBbi Q7 }H2b r?2M `2/BM; 
/B`2+iQ`v M/ iQ `2im`M i?2 }H2Ƕb +QMi2Mi r?2M `2/BM;  `2;mH` }H2X
PM2 i`B+Fv [m2biBQM Bb r?i FBM/ Q7 Content-Type ?2/2` r2 b?QmH/ //
r?2M `2im`MBM;  }H2Ƕb +QMi2MiX aBM+2 i?2b2 }H2b +QmH/ #2 Mvi?BM;- Qm`
b2`p2` +MǶi bBKTHv `2im`M i?2 bK2 ivT2 7Q` HH Q7 i?2KX "mi LSJ +M
?2HT rBi? i?iX h?2 mime T+F;2 U+QMi2Mi ivT2 BM/B+iQ`b HBF2 text/plain
`2 HbQ +HH2/ JAJ1 ivT2bV FMQrb i?2 +Q``2+i ivT2 7Q`  ?m;2 MmK#2`
Q7 }H2 2ti2MbBQMbX
A7 vQm `mM i?2 7QHHQrBM; npm +QKKM/ BM i?2 /B`2+iQ`v r?2`2 i?2 b2`p2`

j3N
b+`BTi HBp2b- vQmǶHH #2 #H2 iQ mb2 require("mime") iQ ;2i ++2bb iQ i?2
HB#``v,
$ npm install mime
npm http GET https :// registry . npmjs . org / mime
npm http 304 https :// registry . npmjs . org / mime
mime@1 .2.11 node_modules / mime

q?2M  `2[m2bi2/ }H2 /Q2b MQi 2tBbi- i?2 +Q``2+i >hhS 2``Q` +Q/2 iQ
`2im`M Bb 9y9X q2 rBHH mb2 fs.stat- r?B+? HQQFb mT BM7Q`KiBQM QM  }H2-
iQ }M/ Qmi #Qi? r?2i?2` i?2 }H2 2tBbib M/ r?2i?2` Bi Bb  /B`2+iQ`vX
methods . GET = function ( path , respond ) {
fs . stat ( path , function ( error , stats ) {
if ( error && error . code == " ENOENT ")
respond (404 , " File not found ") ;
else if ( error )
respond (500 , error . toString () ) ;
else if ( stats . isDirectory () )
fs . readdir ( path , function ( error , files ) {
if ( error )
respond (500 , error . toString () ) ;
else
respond (200 , files . join ("\ n ") ) ;
}) ;
else
respond (200 , fs . createReadStream ( path ) ,
require (" mime ") . lookup ( path ) ) ;
}) ;
};

"2+mb2 Bi ?b iQ iQm+? i?2 /BbF M/ i?mb KB;?i iF2  r?BH2- fs.stat Bb
bvM+?`QMQmbX q?2M i?2 }H2 /Q2b MQi 2tBbi- fs.stat rBHH Tbb M 2``Q`
Q#D2+i rBi?  code T`QT2`iv Q7 "ENOENT" iQ Bib +HH#+FX Ai rQmH/ #2 MB+2 B7
LQ/2 /2}M2/ /Bz2`2Mi bm#ivT2b Q7 Error 7Q` /Bz2`2Mi ivT2b Q7 2``Q`- #mi
Bi /Q2bMǶiX AMbi2/- Bi Dmbi Tmib Q#b+m`2- lMBt@BMbTB`2/ +Q/2b BM i?2`2X
q2 `2 ;QBM; iQ `2TQ`i Mv 2``Q`b r2 /B/MǶi 2tT2+i rBi? biimb +Q/2
8yy- r?B+? BM/B+i2b i?i i?2 T`Q#H2K 2tBbib BM i?2 b2`p2`- b QTTQb2/ iQ
+Q/2b bi`iBM; rBi? 9 Ubm+? b 9y9V- r?B+? `272` iQ #/ `2[m2bibX h?2`2
`2 bQK2 bBimiBQMb BM r?B+? i?Bb Bb MQi 2MiB`2Hv ++m`i2- #mi 7Q`  bKHH
2tKTH2 T`Q;`K HBF2 i?Bb- Bi rBHH ?p2 iQ #2 ;QQ/ 2MQm;?X

jNy
h?2 stats Q#D2+i `2im`M2/ #v fs.stat i2HHb mb  MmK#2` Q7 i?BM;b #Qmi
 }H2- bm+? b Bib bBx2 Usize T`QT2`ivV M/ Bib KQ/B}+iBQM /i2 Umtime
T`QT2`ivVX >2`2 r2 `2 BMi2`2bi2/ BM i?2 [m2biBQM Q7 r?2i?2` Bi Bb 
/B`2+iQ`v Q`  `2;mH` }H2- r?B+? i?2 isDirectory K2i?Q/ i2HHb mbX
q2 mb2 fs.readdir iQ `2/ i?2 HBbi Q7 }H2b BM  /B`2+iQ`v M/- BM v2i
MQi?2` +HH#+F- `2im`M Bi iQ i?2 mb2`X 6Q` MQ`KH }H2b- r2 +`2i2 
`2/#H2 bi`2K rBi? fs.createReadStream M/ Tbb Bi iQ respond- HQM;
rBi? i?2 +QMi2Mi ivT2 i?i i?2 "mime" KQ/mH2 ;Bp2b mb 7Q` i?2 }H2Ƕb MK2X
h?2 +Q/2 iQ ?M/H2 DELETE `2[m2bib Bb bHB;?iHv bBKTH2`X
methods . DELETE = function ( path , respond ) {
fs . stat ( path , function ( error , stats ) {
if ( error && error . code == " ENOENT ")
respond (204) ;
else if ( error )
respond (500 , error . toString () ) ;
else if ( stats . isDirectory () )
fs . rmdir ( path , respondErrorOrNothing ( respond ) ) ;
else
fs . unlink ( path , respondErrorOrNothing ( respond ) ) ;
}) ;
};

uQm Kv #2 rQM/2`BM; r?v i`vBM; iQ /2H2i2  MQM2tBbi2Mi }H2 `2im`Mb 


ky9 biimb- `i?2` i?M M 2``Q`X q?2M i?2 }H2 i?i Bb #2BM; /2H2i2/ Bb MQi
i?2`2- vQm +QmH/ bv i?i i?2 `2[m2biǶb Q#D2+iBp2 Bb H`2/v 7mH}HH2/X h?2
>hhS biM/`/ 2M+Qm`;2b T2QTH2 iQ KF2 `2[m2bib B/2KTQi2Mi- r?B+?
K2Mb i?i TTHvBM; i?2K KmHiBTH2 iBK2b /Q2b MQi T`Q/m+2  /Bz2`2Mi
`2bmHiX
function respondErrorOrNothing ( respond ) {
return function ( error ) {
if ( error )
respond (500 , error . toString () ) ;
else
respond (204) ;
};
}

q?2M M >hhS `2bTQMb2 /Q2b MQi +QMiBM Mv /i- i?2 biimb +Q/2 ky9
UdzMQ +QMi2MiǴV +M #2 mb2/ iQ BM/B+i2 i?BbX aBM+2 r2 M22/ iQ T`QpB/2

jNR
+HH#+Fb i?i 2Bi?2` `2TQ`i M 2``Q` Q` `2im`M  ky9 `2bTQMb2 BM  72r
/Bz2`2Mi bBimiBQMb- A r`Qi2  respondErrorOrNothing 7mM+iBQM i?i +`2i2b
bm+?  +HH#+FX
h?Bb Bb i?2 ?M/H2` 7Q` PUT `2[m2bib,
methods . PUT = function ( path , respond , request ) {
var outStream = fs . createWriteStream ( path ) ;
outStream . on (" error " , function ( error ) {
respond (500 , error . toString () );
}) ;
outStream . on (" finish " , function () {
respond (204) ;
}) ;
request . pipe ( outStream );
};

>2`2- r2 /QMǶi M22/ iQ +?2+F r?2i?2` i?2 }H2 2tBbiběB7 Bi /Q2b- r2ǶHH Dmbi
Qp2`r`Bi2 BiX q2 ;BM mb2 pipe iQ KQp2 /i 7`QK  `2/#H2 bi`2K
iQ  r`Bi#H2 QM2- BM i?Bb +b2 7`QK i?2 `2[m2bi iQ i?2 }H2X A7 +`2iBM;
i?2 bi`2K 7BHb- M "error" 2p2Mi Bb `Bb2/ 7Q` Bi- r?B+? r2 `2TQ`i BM
Qm` `2bTQMb2X q?2M i?2 /i Bb i`Mb72``2/ bm++2bb7mHHv- pipe rBHH +HQb2
#Qi? bi`2Kb- r?B+? rBHH +mb2  "finish" 2p2Mi iQ }`2 QM i?2 r`Bi#H2
bi`2KX q?2M i?i ?TT2Mb- r2 +M `2TQ`i bm++2bb iQ i?2 +HB2Mi rBi? 
ky9 `2bTQMb2X
h?2 7mHH b+`BTi 7Q` i?2 b2`p2` Bb pBH#H2 i 2HQ[m2MiDpb+`BTiXM2if+Q/2f}H2nb2`p2`XDbX
uQm +M /QrMHQ/ i?i M/ `mM Bi rBi? LQ/2 iQ bi`i vQm` QrM }H2 b2`p2`X
M/ Q7 +Qm`b2- vQm +M KQ/B7v M/ 2ti2M/ Bi iQ bQHp2 i?Bb +?Ti2`Ƕb 2t@
2`+Bb2b Q` iQ 2tT2`BK2MiX
h?2 +QKKM/@HBM2 iQQH curl- rB/2Hv pBH#H2 QM lMBt@HBF2 bvbi2Kb- +M
#2 mb2/ iQ KF2 >hhS `2[m2bibX h?2 7QHHQrBM; b2bbBQM #`B2~v i2bib Qm`
b2`p2`X LQi2 i?i -X Bb mb2/ iQ b2i i?2 `2[m2biǶb K2i?Q/ M/ -d Bb mb2/
iQ BM+Hm/2  `2[m2bi #Q/vX
$ curl http :// localhost :8000/ file . txt
File not found
$ curl -X PUT -d hello http :// localhost :8000/ file . txt
$ curl http :// localhost :8000/ file . txt
hello
$ curl -X DELETE http :// localhost :8000/ file . txt
$ curl http :// localhost :8000/ file . txt

jNk
File not found

h?2 }`bi `2[m2bi 7Q` file.txt 7BHb bBM+2 i?2 }H2 /Q2b MQi 2tBbi v2iX h?2
PUT `2[m2bi +`2i2b i?2 }H2- M/ #2?QH/- i?2 M2ti `2[m2bi bm++2bb7mHHv
`2i`B2p2b BiX 7i2` /2H2iBM; Bi rBi?  DELETE `2[m2bi- i?2 }H2 Bb ;BM
KBbbBM;X

1``Q` ?M/HBM;
AM i?2 +Q/2 7Q` i?2 }H2 b2`p2`- i?2`2 `2 bBt TH+2b r?2`2 r2 `2 2t@
THB+BiHv `QmiBM; 2t+2TiBQMb i?i r2 /QMǶi FMQr ?Qr iQ ?M/H2 BMiQ 2``Q`
`2bTQMb2bX "2+mb2 2t+2TiBQMb `2MǶi miQKiB+HHv T`QT;i2/ iQ +HH@
#+Fb #mi `i?2` Tbb2/ iQ i?2K b `;mK2Mib- i?2v ?p2 iQ #2 ?M/H2/
2tTHB+BiHv 2p2`v iBK2X h?Bb +QKTH2i2Hv /272ib i?2 /pMi;2 Q7 2t+2T@
iBQM ?M/HBM;- MK2Hv- i?2 #BHBiv iQ +2Mi`HBx2 i?2 ?M/HBM; Q7 7BHm`2
+QM/BiBQMbX
q?i ?TT2Mb r?2M bQK2i?BM; +imHHv i?`Qrb M 2t+2TiBQM BM i?Bb
bvbi2K\ aBM+2 r2 `2 MQi mbBM; Mv try #HQ+Fb- i?2 2t+2TiBQM rBHH T`QT@
;i2 iQ i?2 iQT Q7 i?2 +HH bi+FX AM LQ/2- i?i #Q`ib i?2 T`Q;`K M/
r`Bi2b BM7Q`KiBQM #Qmi i?2 2t+2TiBQM UBM+Hm/BM;  bi+F i`+2V iQ i?2
T`Q;`KǶb biM/`/ 2``Q` bi`2KX
h?Bb K2Mb i?i Qm` b2`p2` rBHH +`b? r?2M2p2`  T`Q#H2K Bb 2M+QmM@
i2`2/ BM i?2 b2`p2`Ƕb +Q/2 Bib2H7- b QTTQb2/ iQ bvM+?`QMQmb T`Q#H2Kb-
r?B+? rBHH #2 Tbb2/ b `;mK2Mib iQ i?2 +HH#+FbX A7 r2 rMi2/ iQ
?M/H2 HH 2t+2TiBQMb `Bb2/ /m`BM; i?2 ?M/HBM; Q7  `2[m2bi- iQ KF2
bm`2 r2 b2M/  `2bTQMb2- r2 rQmH/ ?p2 iQ // try/catch #HQ+Fb iQ 2p2`v
+HH#+FX
h?Bb Bb MQi rQ`F#H2X JMv LQ/2 T`Q;`Kb `2 r`Bii2M iQ KF2 b
HBiiH2 mb2 Q7 2t+2TiBQMb b TQbbB#H2- rBi? i?2 bbmKTiBQM i?i B7 M 2t+2T@
iBQM Bb `Bb2/- Bi Bb MQi bQK2i?BM; i?2 T`Q;`K +M ?M/H2- M/ +`b?BM;
Bb i?2 `B;?i `2bTQMb2X
MQi?2` TT`Q+? Bb iQ mb2 T`QKBb2b- r?B+? r2`2 BMi`Q/m+2/ BM *?Ti2`
RdX h?Qb2 +i+? 2t+2TiBQMb `Bb2/ #v +HH#+F 7mM+iBQMb M/ T`QT;i2
i?2K b 7BHm`2bX Ai Bb TQbbB#H2 iQ HQ/  T`QKBb2 HB#``v BM LQ/2 M/ mb2
i?i iQ KM;2 vQm` bvM+?`QMQmb +QMi`QHX 62r LQ/2 HB#``B2b BMi2;`i2
T`QKBb2b- #mi Bi Bb Q7i2M i`BpBH iQ r`T i?2KX h?2 2t+2HH2Mi "promise
" KQ/mH2 7`QK LSJ +QMiBMb  7mM+iBQM +HH2/ denodeify- r?B+? iF2b

jNj
M bvM+?`QMQmb 7mM+iBQM HBF2 fs.readFile M/ +QMp2`ib Bi iQ  T`QKBb2@
`2im`MBM; 7mM+iBQMX
var Promise = require (" promise ") ;
var fs = require (" fs ") ;

var readFile = Promise . denodeify ( fs . readFile );


readFile (" file . txt " , " utf8 ") . then ( function ( content ) {
console . log (" The file contained : " + content ) ;
}, function ( error ) {
console . log (" Failed to read file : " + error ) ;
}) ;

6Q` +QKT`BbQM- AǶp2 r`Bii2M MQi?2` p2`bBQM Q7 i?2 }H2 b2`p2` #b2/ QM
T`QKBb2b- r?B+? vQm +M }M/ i 2HQ[m2MiDpb+`BTiXM2if+Q/2f}H2nb2`p2`nT`QKBb2bXDbX
Ai Bb bHB;?iHv +H2M2` #2+mb2 7mM+iBQMb +M MQr `2im`M i?2B` `2bmHib- `i?2`
i?M ?pBM; iQ +HH +HH#+Fb- M/ i?2 `QmiBM; Q7 2t+2TiBQMb Bb BKTHB+Bi-
`i?2` i?M 2tTHB+BiX
AǶHH HBbi  72r HBM2b 7`QK i?2 T`QKBb2@#b2/ }H2 b2`p2` iQ BHHmbi`i2 i?2
/Bz2`2M+2 BM i?2 bivH2 Q7 T`Q;`KKBM;X
h?2 fsp Q#D2+i i?i Bb mb2/ #v i?Bb +Q/2 +QMiBMb T`QKBb2@bivH2 p`BMib
Q7  MmK#2` Q7 fs 7mM+iBQMb- r`TT2/ #v Promise.denodeifyX h?2 Q#D2+i
`2im`M2/ 7`QK i?2 K2i?Q/ ?M/H2`- rBi? code M/ body T`QT2`iB2b- rBHH
#2+QK2 i?2 }MH `2bmHi Q7 i?2 +?BM Q7 T`QKBb2b- M/ Bi rBHH #2 mb2/ iQ
/2i2`KBM2 r?i FBM/ Q7 `2bTQMb2 iQ b2M/ iQ i?2 +HB2MiX
methods . GET = function ( path ) {
return inspectPath ( path ). then ( function ( stats ) {
if (! stats ) // Does not exist
return { code : 404 , body : " File not found "};
else if ( stats . isDirectory () )
return fsp . readdir ( path ). then ( function ( files ) {
return { code : 200 , body : files . join ("\ n ") };
}) ;
else
return { code : 200 ,
type : require (" mime ") . lookup ( path ) ,
body : fs . createReadStream ( path ) };
}) ;
};

jN9
function inspectPath ( path ) {
return fsp . stat ( path ) . then ( null , function ( error ) {
if ( error . code == " ENOENT ") return null ;
else throw error ;
}) ;
}

h?2 inspectPath 7mM+iBQM Bb  bBKTH2 r`TT2` `QmM/ fs.stat- r?B+? ?M@


/H2b i?2 +b2 r?2`2 i?2 }H2 Bb MQi 7QmM/X AM i?i +b2- r2 `2TH+2 i?2
7BHm`2 rBi?  bm++2bb i?i vB2H/b nullX HH Qi?2` 2``Q`b `2 HHQr2/ iQ
T`QT;i2X q?2M i?2 T`QKBb2 i?i Bb `2im`M2/ 7`QK i?2b2 ?M/H2`b 7BHb-
i?2 >hhS b2`p2` `2bTQM/b rBi?  8yy biimb +Q/2X

amKK`v
LQ/2 Bb  MB+2- bi`B;?i7Q`r`/ bvbi2K i?i H2ib mb `mM Cpa+`BTi BM 
MQM#`Qrb2` +QMi2tiX Ai rb Q`B;BMHHv /2bB;M2/ 7Q` M2irQ`F ibFb iQ THv
i?2 `QH2 Q7  MQ/2 BM  M2irQ`FX "mi Bi H2M/b Bib2H7 iQ HH FBM/b Q7 b+`BTi@
BM; ibFb- M/ B7 r`BiBM; Cpa+`BTi Bb bQK2i?BM; vQm 2MDQv- miQKiBM;
2p2`v/v ibFb rBi? LQ/2 rQ`Fb rQM/2`7mHHvX
LSJ T`QpB/2b HB#``B2b 7Q` 2p2`vi?BM; vQm +M i?BMF Q7 UM/ [mBi2 
72r i?BM;b vQmǶ/ T`Q##Hv M2p2` i?BMF Q7V- M/ Bi HHQrb vQm iQ 72i+?
M/ BMbiHH i?Qb2 HB#``B2b #v `mMMBM;  bBKTH2 +QKKM/X LQ/2 HbQ
+QK2b rBi?  MmK#2` Q7 #mBHi@BM KQ/mH2b- BM+Hm/BM; i?2 "fs" KQ/mH2- 7Q`
rQ`FBM; rBi? i?2 }H2 bvbi2K- M/ i?2 "http" KQ/mH2- 7Q` `mMMBM; >hhS
b2`p2`b M/ KFBM; >hhS `2[m2bibX
HH BMTmi M/ QmiTmi BM LQ/2 Bb /QM2 bvM+?`QMQmbHv- mMH2bb vQm 2t@
THB+BiHv mb2  bvM+?`QMQmb p`BMi Q7  7mM+iBQM- bm+? b fs.readFileSyncX
uQm T`QpB/2 +HH#+F 7mM+iBQMb- M/ LQ/2 rBHH +HH i?2K i i?2 TT`Q@
T`Bi2 iBK2- r?2M i?2 AfP vQm bF2/ 7Q` ?b }MBb?2/X

1t2`+Bb2b
*QMi2Mi M2;QiBiBQM- ;BM
AM *?Ti2` Rd- i?2 }`bi 2t2`+Bb2 rb iQ KF2 b2p2`H `2[m2bib iQ 2HQ[m2M@
iDpb+`BTiXM2ifmi?Q`- bFBM; 7Q` /Bz2`2Mi ivT2b Q7 +QMi2Mi #v TbbBM;

jN8
/Bz2`2Mi Accept ?2/2`bX
.Q i?Bb ;BM- mbBM; LQ/2Ƕb http.request 7mM+iBQMX bF 7Q` i H2bi i?2
K2/B ivT2b text/plain- text/html- M/ application/jsonX _2K2K#2` i?i
?2/2`b iQ  `2[m2bi +M #2 ;Bp2M b M Q#D2+i- BM i?2 headers T`QT2`iv
Q7 http.requestǶb }`bi `;mK2MiX
q`Bi2 Qmi i?2 +QMi2Mi Q7 i?2 `2bTQMb2b iQ 2+? `2[m2biX

6BtBM;  H2F
6Q` 2bv `2KQi2 ++2bb iQ bQK2 }H2b- A KB;?i ;2i BMiQ i?2 ?#Bi Q7 ?pBM;
i?2 }H2 b2`p2` /2}M2/ BM i?Bb +?Ti2` `mMMBM; QM Kv K+?BM2- BM i?2 /home
/marijn/public /B`2+iQ`vX h?2M- QM2 /v- A }M/ i?i bQK2QM2 ?b ;BM2/
++2bb iQ HH i?2 TbbrQ`/b A biQ`2/ BM Kv #`Qrb2`X
q?i ?TT2M2/\
A7 Bi BbMǶi +H2` iQ vQm v2i- i?BMF #+F iQ i?2 urlToPath 7mM+iBQM- /2}M2/
HBF2 i?Bb,
function urlToPath ( url ) {
var path = require (" url ") . parse ( url ) . pathname ;
return "." + decodeURIComponent ( path ) ;
}

LQr +QMbB/2` i?2 7+i i?i Ti?b Tbb2/ iQ i?2 "fs" 7mM+iBQMb +M #2
`2HiBp2ěi?2v Kv +QMiBM "../" iQ ;Q mT  /B`2+iQ`vX q?i ?TT2Mb
r?2M  +HB2Mi b2M/b `2[m2bib iQ l_Gb HBF2 i?2 QM2b b?QrM ?2`2\
http :// myhostname :8000/../. config / config / google - chrome / Default
/ Web %20 Data
http :// myhostname :8000/../. ssh / id_dsa
http :// myhostname :8000/../../../ etc / passwd

*?M;2 urlToPath iQ }t i?Bb T`Q#H2KX hF2 BMiQ ++QmMi i?2 7+i i?i
LQ/2 QM qBM/Qrb HHQrb #Qi? 7Q`r`/ bHb?2b M/ #+FbHb?2b iQ b2T@
`i2 /B`2+iQ`B2bX
HbQ- K2/Bii2 QM i?2 7+i i?i b bQQM b vQm 2tTQb2 bQK2 ?H7@#F2/
bvbi2K QM i?2 AMi2`M2i- i?2 #m;b BM i?i bvbi2K KB;?i #2 mb2/ iQ /Q #/
i?BM;b iQ vQm` K+?BM2X

jNe
*`2iBM; /B`2+iQ`B2b
h?Qm;? i?2 DELETE K2i?Q/ Bb rB`2/ mT iQ /2H2i2 /B`2+iQ`B2b UmbBM; fs.
rmdirV- i?2 }H2 b2`p2` +m``2MiHv /Q2b MQi T`QpB/2 Mv rv iQ +`2i2 
/B`2+iQ`vX
// bmTTQ`i 7Q`  K2i?Q/ MKCOL- r?B+? b?QmH/ +`2i2  /B`2+iQ`v #v
+HHBM; fs.mkdirX MKCOL Bb MQi QM2 Q7 i?2 #bB+ >hhS K2i?Q/b- #mi Bi /Q2b
2tBbi- 7Q` i?Bb bK2 Tm`TQb2- BM i?2 q2#.o biM/`/- r?B+? bT2+B}2b 
b2i Q7 2ti2MbBQMb iQ >hhS- KFBM; Bi bmBi#H2 7Q` r`BiBM; `2bQm`+2b- MQi
Dmbi `2/BM; i?2KX

 Tm#HB+ bT+2 QM i?2 r2#


aBM+2 i?2 }H2 b2`p2` b2`p2b mT Mv FBM/ Q7 }H2 M/ 2p2M BM+Hm/2b i?2
`B;?i Content-Type ?2/2`- vQm +M mb2 Bi iQ b2`p2  r2#bBi2X aBM+2 Bi
HHQrb 2p2`v#Q/v iQ /2H2i2 M/ `2TH+2 }H2b- Bi rQmH/ #2 M BMi2`2biBM;
FBM/ Q7 r2#bBi2, QM2 i?i +M #2 KQ/B}2/- pM/HBx2/- M/ /2bi`Qv2/ #v
2p2`v#Q/v r?Q iF2b i?2 iBK2 iQ +`2i2 i?2 `B;?i >hhS `2[m2biX aiBHH-
Bi rQmH/ #2  r2#bBi2X
q`Bi2  #bB+ >hJG T;2 i?i BM+Hm/2b  bBKTH2 Cpa+`BTi }H2X Smi
i?2 }H2b BM  /B`2+iQ`v b2`p2/ #v i?2 }H2 b2`p2` M/ QT2M i?2K BM vQm`
#`Qrb2`X
L2ti- b M /pM+2/ 2t2`+Bb2 Q` 2p2M  r22F2M/ T`QD2+i- +QK#BM2 HH
i?2 FMQrH2/;2 vQm ;BM2/ 7`QK i?Bb #QQF iQ #mBH/  KQ`2 mb2`@7`B2M/Hv
BMi2`7+2 7Q` KQ/B7vBM; i?2 r2#bBi2 7`QK BMbB/2 i?2 r2#bBi2X
lb2 M >hJG 7Q`K U*?Ti2` R3V iQ 2/Bi i?2 +QMi2Mi Q7 i?2 }H2b i?i
KF2 mT i?2 r2#bBi2- HHQrBM; i?2 mb2` iQ mT/i2 i?2K QM i?2 b2`p2` #v
mbBM; >hhS `2[m2bib b /2b+`B#2/ BM *?Ti2` RdX
ai`i #v KFBM; QMHv  bBM;H2 }H2 2/Bi#H2X h?2M KF2 Bi bQ i?i i?2
mb2` +M b2H2+i r?B+? }H2 iQ 2/BiX lb2 i?2 7+i i?i Qm` }H2 b2`p2` `2im`Mb
HBbib Q7 }H2b r?2M `2/BM;  /B`2+iQ`vX
.QMǶi rQ`F /B`2+iHv BM i?2 +Q/2 QM i?2 }H2 b2`p2`- bBM+2 B7 vQm KF2
 KBbiF2 vQm `2 HBF2Hv iQ /K;2 i?2 }H2b i?2`2X AMbi2/- F22T vQm`
rQ`F QmibB/2 Q7 i?2 Tm#HB+Hv ++2bbB#H2 /B`2+iQ`v M/ +QTv Bi i?2`2 r?2M
i2biBM;X
A7 vQm` +QKTmi2` Bb /B`2+iHv +QMM2+i2/ iQ i?2 AMi2`M2i- rBi?Qmi  }`2@
rHH- `Qmi2`- Q` Qi?2` BMi2`72`BM; /2pB+2 BM #2ir22M- vQm KB;?i #2 #H2

jNd
iQ BMpBi2  7`B2M/ iQ mb2 vQm` r2#bBi2X hQ +?2+F- ;Q iQ r?iBbKvBTX+QK-
+QTv i?2 AS //`2bb Bi ;Bp2b vQm BMiQ i?2 //`2bb #` Q7 vQm` #`Qrb2`-
M/ // :8000 7i2` Bi iQ b2H2+i i?2 `B;?i TQ`iX A7 i?i #`BM;b vQm iQ vQm`
bBi2- Bi Bb QMHBM2 7Q` 2p2`v#Q/v iQ b22X

jN3
kR S`QD2+i, aFBHH@a?`BM;
q2#bBi2
 bFBHH@b?`BM; K22iBM; Bb M 2p2Mi r?2`2 T2QTH2 rBi?  b?`2/ BMi2`2bi
+QK2 iQ;2i?2` M/ ;Bp2 bKHH- BM7Q`KH T`2b2MiiBQMb #Qmi i?BM;b i?2v
FMQrX i  ;`/2MBM; bFBHH@b?`BM; K22iBM;- bQK2QM2 KB;?i 2tTHBM ?Qr
iQ +mHiBpi2 +2H2`vX P` BM  T`Q;`KKBM;@Q`B2Mi2/ bFBHH@b?`BM; ;`QmT-
vQm +QmH/ /`QT #v M/ i2HH 2p2`v#Q/v #Qmi LQ/2XDbX
am+? K22imTb- HbQ Q7i2M +HH2/ mb2`bǶ ;`QmTb r?2M i?2v `2 #Qmi
+QKTmi2`b- `2  ;`2i rv iQ #`Q/2M vQm` ?Q`BxQM- H2`M #Qmi M2r
/2p2HQTK2Mib- Q` bBKTHv K22i T2QTH2 rBi? bBKBH` BMi2`2bibX JMv H`;2
+BiB2b ?p2  Cpa+`BTi K22imTX h?2v `2 ivTB+HHv 7`22 iQ ii2M/- M/
AǶp2 7QmM/ i?2 QM2b AǶp2 pBbBi2/ iQ #2 7`B2M/Hv M/ r2H+QKBM;X
AM i?Bb }MH T`QD2+i +?Ti2`- Qm` ;QH Bb iQ b2i mT  r2#bBi2 7Q` KM;BM;
iHFb ;Bp2M i  bFBHH@b?`BM; K22iBM;X AK;BM2  bKHH ;`QmT Q7 T2QTH2
K22iBM; mT `2;mH`Hv BM  K2K#2`Ƕb Q{+2 iQ iHF #Qmi mMB+v+HBM;X h?2
T`Q#H2K Bb i?i r?2M i?2 T`2pBQmb Q`;MBx2` Q7 i?2 K22iBM;b KQp2/ iQ
MQi?2` iQrM- MQ#Q/v bi2TT2/ 7Q`r`/ iQ iF2 Qp2` i?Bb ibFX q2 rMi
 bvbi2K i?i rBHH H2i i?2 T`iB+BTMib T`QTQb2 M/ /Bb+mbb iHFb KQM;
i?2Kb2Hp2b- rBi?Qmi  +2Mi`H Q`;MBx2`X

U5BMi2`+iBp2 Cmbi HBF2 BM i?2 T`2pBQmb +?Ti2`- i?2 +Q/2 BM i?Bb +?Ti2` Bb

jNN
r`Bii2M 7Q` LQ/2XDb- M/ `mMMBM; Bi /B`2+iHv BM i?2 >hJG T;2 i?i vQm
`2 HQQFBM; i Bb mMHBF2Hv iQ rQ`FX 5Vh?2 7mHH +Q/2 7Q` i?2 T`QD2+i +M #2
/QrMHQ/2/ 7`QK 2HQ[m2MiDpb+`BTiXM2if+Q/2fbFBHHb?`BM;XxBTX

.2bB;M
h?2`2 Bb  b2`p2` T`i iQ i?Bb T`QD2+i- r`Bii2M 7Q` LQ/2XDb- M/  +HB2Mi
T`i- r`Bii2M 7Q` i?2 #`Qrb2`X h?2 b2`p2` biQ`2b i?2 bvbi2KǶb /i M/
T`QpB/2b Bi iQ i?2 +HB2MiX Ai HbQ b2`p2b i?2 >hJG M/ Cpa+`BTi }H2b
i?i BKTH2K2Mi i?2 +HB2Mi@bB/2 bvbi2KX
h?2 b2`p2` F22Tb  HBbi Q7 iHFb T`QTQb2/ 7Q` i?2 M2ti K22iBM;- M/
i?2 +HB2Mi b?Qrb i?Bb HBbiX 1+? iHF ?b  T`2b2Mi2` MK2-  iBiH2- 
bmKK`v- M/  HBbi Q7 +QKK2Mib bbQ+Bi2/ rBi? BiX h?2 +HB2Mi HHQrb
mb2`b iQ T`QTQb2 M2r iHFb U//BM; i?2K iQ i?2 HBbiV- /2H2i2 iHFb- M/
+QKK2Mi QM 2tBbiBM; iHFbX q?2M2p2` i?2 mb2` KF2b bm+?  +?M;2- i?2
+HB2Mi KF2b M >hhS `2[m2bi iQ i2HH i?2 b2`p2` #Qmi BiX

h?2 TTHB+iBQM rBHH #2 b2i mT iQ b?Qr  HBp2 pB2r Q7 i?2 +m``2Mi T`QTQb2/
iHFb M/ i?2B` +QKK2MibX q?2M2p2` bQK2QM2- bQK2r?2`2- bm#KBib 
M2r iHF Q` //b  +QKK2Mi- HH T2QTH2 r?Q ?p2 i?2 T;2 QT2M BM
i?2B` #`Qrb2`b b?QmH/ BKK2/Bi2Hv b22 i?2 +?M;2X h?Bb TQb2b  #Bi Q7 
+?HH2M;2 bBM+2 i?2`2 Bb MQ rv 7Q`  r2# b2`p2` iQ QT2M mT  +QMM2+iBQM
iQ  +HB2Mi- MQ` Bb i?2`2  ;QQ/ rv iQ FMQr r?B+? +HB2Mib +m``2MiHv `2
HQQFBM; i  ;Bp2M r2#bBi2X
 +QKKQM bQHmiBQM iQ i?Bb T`Q#H2K Bb +HH2/ HQM; TQHHBM;- r?B+? ?T@

9yy
T2Mb iQ #2 QM2 Q7 i?2 KQiBpiBQMb 7Q` LQ/2Ƕb /2bB;MX

GQM; TQHHBM;
hQ #2 #H2 iQ BKK2/Bi2Hv MQiB7v  +HB2Mi i?i bQK2i?BM; +?M;2/- r2
M22/  +QMM2+iBQM iQ i?i +HB2MiX aBM+2 r2# #`Qrb2`b /Q MQi i`/BiBQMHHv
++2Ti +QMM2+iBQMb M/ +HB2Mib `2 mbmHHv #2?BM/ /2pB+2b i?i rQmH/
#HQ+F bm+? +QMM2+iBQMb Mvrv- ?pBM; i?2 b2`p2` BMBiBi2 i?Bb +QMM2+iBQM
Bb MQi T`+iB+HX
q2 +M ``M;2 7Q` i?2 +HB2Mi iQ QT2M i?2 +QMM2+iBQM M/ F22T Bi `QmM/
bQ i?i i?2 b2`p2` +M mb2 Bi iQ b2M/ BM7Q`KiBQM r?2M Bi M22/b iQ /Q bQX
"mi M >hhS `2[m2bi HHQrb QMHv  bBKTH2 ~Qr Q7 BM7Q`KiBQM- r?2`2
i?2 +HB2Mi b2M/b  `2[m2bi- i?2 b2`p2` +QK2b #+F rBi?  bBM;H2 `2bTQMb2-
M/ i?i Bb BiX h?2`2 Bb  i2+?MQHQ;v +HH2/ r2# bQ+F2ib- bmTTQ`i2/ #v
KQ/2`M #`Qrb2`b- r?B+? KF2b Bi TQbbB#H2 iQ QT2M +QMM2+iBQMb 7Q` `#B@
i``v /i 2t+?M;2X "mi mbBM; i?2K T`QT2`Hv Bb bQK2r?i i`B+FvX
AM i?Bb +?Ti2`- r2 rBHH mb2  `2HiBp2Hv bBKTH2 i2+?MB[m2- HQM; TQHHBM;-
r?2`2 +HB2Mib +QMiBMmQmbHv bF i?2 b2`p2` 7Q` M2r BM7Q`KiBQM mbBM; `2;@
mH` >hhS `2[m2bib- M/ i?2 b2`p2` bBKTHv biHHb Bib Mbr2` r?2M Bi ?b
MQi?BM; M2r iQ `2TQ`iX
b HQM; b i?2 +HB2Mi KF2b bm`2 Bi +QMbiMiHv ?b  TQHHBM; `2[m2bi
QT2M- Bi rBHH `2+2Bp2 BM7Q`KiBQM 7`QK i?2 b2`p2` BKK2/Bi2HvX 6Q` 2t@
KTH2- B7 HB+2 ?b Qm` bFBHH@b?`BM; TTHB+iBQM QT2M BM ?2` #`Qrb2`-
i?i #`Qrb2` rBHH ?p2 K/2  `2[m2bi 7Q` mT/i2b M/ #2 rBiBM; 7Q` 
`2bTQMb2 iQ i?i `2[m2biX q?2M "Q# bm#KBib  iHF QM 1ti`2K2 .QrM@
?BHH lMB+v+HBM;- i?2 b2`p2` rBHH MQiB+2 i?i HB+2 Bb rBiBM; 7Q` mT/i2b
M/ b2M/ BM7Q`KiBQM #Qmi i?2 M2r iHF b  `2bTQMb2 iQ ?2` T2M/BM;
`2[m2biX HB+2Ƕb #`Qrb2` rBHH `2+2Bp2 i?2 /i M/ mT/i2 i?2 b+`22M iQ
b?Qr i?2 iHFX
hQ T`2p2Mi +QMM2+iBQMb 7`QK iBKBM; Qmi U#2BM; #Q`i2/ #2+mb2 Q7 
H+F Q7 +iBpBivV- HQM;@TQHHBM; i2+?MB[m2b mbmHHv b2i  KtBKmK iBK2 7Q`
2+? `2[m2bi- 7i2` r?B+? i?2 b2`p2` rBHH `2bTQM/ Mvrv- 2p2M i?Qm;?
Bi ?b MQi?BM; iQ `2TQ`i- M/ i?2 +HB2Mi rBHH bi`i  M2r `2[m2biX S2@
`BQ/B+HHv `2bi`iBM; i?2 `2[m2bi HbQ KF2b i?2 i2+?MB[m2 KQ`2 `Q#mbi-
HHQrBM; +HB2Mib iQ `2+Qp2` 7`QK i2KTQ``v +QMM2+iBQM 7BHm`2b Q` b2`p2`
T`Q#H2KbX

9yR
 #mbv b2`p2` i?i Bb mbBM; HQM; TQHHBM; Kv ?p2 i?QmbM/b Q7 rBiBM;
`2[m2bib- M/ i?mb h*S +QMM2+iBQMb- QT2MX LQ/2- r?B+? KF2b Bi 2bv iQ
KM;2 KMv +QMM2+iBQMb rBi?Qmi +`2iBM;  b2T`i2 i?`2/ Q7 +QMi`QH
7Q` 2+? QM2- Bb  ;QQ/ }i 7Q` bm+?  bvbi2KX

>hhS BMi2`7+2
"27Q`2 r2 bi`i ~2b?BM; Qmi 2Bi?2` i?2 b2`p2` Q` i?2 +HB2Mi- H2iǶb i?BMF
#Qmi i?2 TQBMi r?2`2 i?2v iQm+?, i?2 >hhS BMi2`7+2 Qp2` r?B+? i?2v
+QKKmMB+i2X
q2 rBHH #b2 Qm` BMi2`7+2 QM CaPL- M/ HBF2 BM i?2 }H2 b2`p2` 7`QK
*?Ti2` ky- r2ǶHH i`v iQ KF2 ;QQ/ mb2 Q7 >hhS K2i?Q/bX h?2 BMi2`7+2
Bb +2Mi2`2/ `QmM/ i?2 /talks Ti?X Si?b i?i /Q MQi bi`i rBi? /talks
rBHH #2 mb2/ 7Q` b2`pBM; biiB+ }H2běi?2 >hJG M/ Cpa+`BTi +Q/2 i?i
BKTH2K2Mib i?2 +HB2Mi@bB/2 bvbi2KX
 GET `2[m2bi iQ /talks `2im`Mb  CaPL /Q+mK2Mi HBF2 i?Bb,
{" serverTime ": 1405438911833 ,
" talks ": [{" title ": " Unituning ",
" presenter ": " Carlos " ,
" summary ": " Modifying your cycle for extra style " ,
" comment ": []}]}

h?2 serverTime }2H/ rBHH #2 mb2/ iQ KF2 `2HB#H2 HQM; TQHHBM; TQbbB#H2X A
rBHH `2im`M iQ Bi Hi2`X
*`2iBM;  M2r iHF Bb /QM2 #v KFBM;  PUT `2[m2bi iQ  l_G HBF2
/talks/Unituning- r?2`2 i?2 T`i 7i2` i?2 b2+QM/ bHb? Bb i?2 iBiH2 Q7 i?2
iHFX h?2 PUT `2[m2biǶb #Q/v b?QmH/ +QMiBM  CaPL Q#D2+i i?i ?b
presenter M/ summary T`QT2`iB2bX
aBM+2 iHF iBiH2b Kv +QMiBM bT+2b M/ Qi?2` +?`+i2`b i?i Kv
MQi TT2` MQ`KHHv BM  l_G- iBiH2 bi`BM;b Kmbi #2 2M+Q/2/ rBi? i?2
encodeURIComponent 7mM+iBQM r?2M #mBH/BM; mT bm+?  l_GX

console . log ("/ talks /" + encodeURIComponent (" How to Idle ") ) ;
// → / talks / How %20 to %20 Idle

 `2[m2bi iQ +`2i2  iHF #Qmi B/HBM; KB;?i HQQF bQK2i?BM; HBF2 i?Bb,
PUT / talks / How %20 to %20 Idle HTTP /1.1

9yk
Content - Type : application / json
Content - Length : 92

{" presenter ": " Dana " ,


" summary ": " Standing still on a unicycle "}

am+? l_Gb HbQ bmTTQ`i GET `2[m2bib iQ `2i`B2p2 i?2 CaPL `2T`2b2MiiBQM
Q7  iHF M/ DELETE `2[m2bib iQ /2H2i2  iHFX
//BM;  +QKK2Mi iQ  iHF Bb /QM2 rBi?  POST `2[m2bi iQ  l_G HBF2
/talks/Unituning/comments- rBi?  CaPL Q#D2+i i?i ?b author M/ message
T`QT2`iB2b b i?2 #Q/v Q7 i?2 `2[m2biX
POST / talks / Unituning / comments HTTP /1.1
Content - Type : application / json
Content - Length : 72

{" author ": " Alice " ,


" message ": " Will you talk about raising a cycle ?"}

hQ bmTTQ`i HQM; TQHHBM;- GET `2[m2bib iQ /talks Kv BM+Hm/2  [m2`v T@
`K2i2` +HH2/ changesSince- r?B+? Bb mb2/ iQ BM/B+i2 i?i i?2 +HB2Mi Bb
BMi2`2bi2/ BM mT/i2b i?i ?TT2M2/ bBM+2  ;Bp2M TQBMi BM iBK2X q?2M
i?2`2 `2 bm+? +?M;2b- i?2v `2 BKK2/Bi2Hv `2im`M2/X q?2M i?2`2
`2MǶi- i?2 `2bTQMb2 Bb /2Hv2/ mMiBH bQK2i?BM; ?TT2Mb Q` mMiBH  ;Bp2M
iBK2 T2`BQ/ Ur2 rBHH mb2 Ny b2+QM/bV ?b 2HTb2/X
h?2 iBK2 Kmbi #2 BM/B+i2/ b i?2 MmK#2` Q7 KBHHBb2+QM/b 2HTb2/ bBM+2
i?2 bi`i Q7 RNdy- i?2 bK2 ivT2 Q7 MmK#2` i?i Bb `2im`M2/ #v Date.now
()X hQ 2Mbm`2 i?i Bi `2+2Bp2b HH mT/i2b M/ /Q2bMǶi `2+2Bp2 i?2 bK2
mT/i2 KQ`2 i?M QM+2- i?2 +HB2Mi Kmbi Tbb i?2 iBK2 i r?B+? Bi Hbi
`2+2Bp2/ BM7Q`KiBQM 7`QK i?2 b2`p2`X h?2 b2`p2`Ƕb +HQ+F KB;?i MQi #2
2t+iHv BM bvM+ rBi? i?2 +HB2MiǶb +HQ+F- M/ 2p2M B7 Bi r2`2- Bi rQmH/ #2
BKTQbbB#H2 7Q` i?2 +HB2Mi iQ FMQr i?2 T`2+Bb2 iBK2 i r?B+? i?2 b2`p2`
b2Mi  `2bTQMb2 #2+mb2 i`Mb72``BM; /i Qp2` i?2 M2irQ`F iF2b iBK2X
h?Bb Bb i?2 `2bQM 7Q` i?2 2tBbi2M+2 Q7 i?2 serverTime T`QT2`iv BM `2@
bTQMb2b b2Mi iQ GET `2[m2bib iQ /talksX h?i T`QT2`iv i2HHb i?2 +HB2Mi i?2
T`2+Bb2 iBK2- 7`QK i?2 b2`p2`Ƕb T2`bT2+iBp2- i r?B+? i?2 /i Bi `2+2Bp2b
rb +`2i2/X h?2 +HB2Mi +M i?2M bBKTHv biQ`2 i?Bb iBK2 M/ Tbb Bi
HQM; BM Bib M2ti TQHHBM; `2[m2bi iQ KF2 bm`2 i?i Bi `2+2Bp2b 2t+iHv i?2
mT/i2b i?i Bi ?b MQi b22M #27Q`2X

9yj
GET / talks ? changesSince =1405438911833 HTTP /1.1

( time passes )

HTTP /1.1 200 OK


Content - Type : application / json
Content - Length : 95

{" serverTime ": 1405438913401 ,


" talks ": [{" title ": " Unituning ",
" deleted ": true }]}

q?2M  iHF ?b #22M +?M;2/- ?b #22M M2rHv +`2i2/- Q` ?b  +QKK2Mi
//2/- i?2 7mHH `2T`2b2MiiBQM Q7 i?2 iHF Bb BM+Hm/2/ BM i?2 `2bTQMb2 iQ
i?2 +HB2MiǶb M2ti TQHHBM; `2[m2biX q?2M  iHF Bb /2H2i2/- QMHv Bib iBiH2
M/ i?2 T`QT2`iv deleted `2 BM+Hm/2/X h?2 +HB2Mi +M i?2M // iHFb
rBi? iBiH2b Bi ?b MQi b22M #27Q`2 iQ Bib /BbTHv- mT/i2 iHFb i?i Bi rb
H`2/v b?QrBM;- M/ `2KQp2 i?Qb2 i?i r2`2 /2H2i2/X
h?2 T`QiQ+QH /2b+`B#2/ BM i?Bb +?Ti2` /Q2b MQi /Q Mv ++2bb +QMi`QHX
1p2`v#Q/v +M +QKK2Mi- KQ/B7v iHFb- M/ 2p2M /2H2i2 i?2KX aBM+2 i?2
AMi2`M2i Bb }HH2/ rBi? ?QQHB;Mb- TmiiBM; bm+?  bvbi2K QMHBM2 rBi?Qmi
7m`i?2` T`Qi2+iBQM Bb HBF2Hv iQ 2M/ BM /Bbbi2`X
 bBKTH2 bQHmiBQM rQmH/ #2 iQ Tmi i?2 bvbi2K #2?BM/  `2p2`b2 T`Qtv-
r?B+? Bb M >hhS b2`p2` i?i ++2Tib +QMM2+iBQMb 7`QK QmibB/2 i?2 bvb@
i2K M/ 7Q`r`/b i?2K iQ >hhS b2`p2`b i?i `2 `mMMBM; HQ+HHvX am+?
 T`Qtv +M #2 +QM};m`2/ iQ `2[mB`2  mb2`MK2 M/ TbbrQ`/- M/ vQm
+QmH/ KF2 bm`2 QMHv i?2 T`iB+BTMib BM i?2 bFBHH@b?`BM; ;`QmT ?p2 i?Bb
TbbrQ`/X

h?2 b2`p2`
G2iǶb bi`i #v r`BiBM; i?2 b2`p2`@bB/2 T`i Q7 i?2 T`Q;`KX h?2 +Q/2 BM
i?Bb b2+iBQM `mMb QM LQ/2XDbX

_QmiBM;
Pm` b2`p2` rBHH mb2 http.createServer iQ bi`i M >hhS b2`p2`X AM i?2
7mM+iBQM i?i ?M/H2b  M2r `2[m2bi- r2 Kmbi /BbiBM;mBb? #2ir22M i?2

9y9
p`BQmb FBM/b Q7 `2[m2bib Ub /2i2`KBM2/ #v i?2 K2i?Q/ M/ i?2 Ti?V
i?i r2 bmTTQ`iX h?Bb +M #2 /QM2 rBi?  HQM; +?BM Q7 if bii2K2Mib-
#mi i?2`2 Bb  MB+2` rvX
 `Qmi2` Bb  +QKTQM2Mi i?i ?2HTb /BbTi+?  `2[m2bi iQ i?2 7mM+iBQM
i?i +M ?M/H2 BiX uQm +M i2HH i?2 `Qmi2`- 7Q` 2tKTH2- i?i PUT `2[m2bib
rBi?  Ti? i?i Ki+?2b i?2 `2;mH` 2tT`2bbBQM /^\/talks\/([^\/]+)$/
Ur?B+? Ki+?2b /talks/ 7QHHQr2/ #v  iHF iBiH2V +M #2 ?M/H2/ #v 
;Bp2M 7mM+iBQMX AM //BiBQM- Bi +M ?2HT 2ti`+i i?2 K2MBM;7mH T`ib Q7
i?2 Ti?- BM i?Bb +b2 i?2 iHF iBiH2- r`TT2/ BM T`2Mi?2b2b BM i?2 `2;mH`
2tT`2bbBQM M/ Tbb i?Qb2 iQ i?2 ?M/H2` 7mM+iBQMX
h?2`2 `2  MmK#2` Q7 ;QQ/ `Qmi2` T+F;2b QM LSJ- #mi ?2`2 r2 rBHH
r`Bi2 QM2 Qm`b2Hp2b iQ BHHmbi`i2 i?2 T`BM+BTH2X
h?Bb Bb router.js- r?B+? r2 rBHH Hi2` require 7`QK Qm` b2`p2` KQ/mH2,
var Router = module . exports = function () {
this . routes = [];
};

Router . prototype . add = function ( method , url , handler ) {


this . routes . push ({ method : method ,
url : url ,
handler : handler }) ;
};

Router . prototype . resolve = function ( request , response ) {


var path = require (" url ") . parse ( request . url ) . pathname ;

return this . routes . some ( function ( route ) {


var match = route . url . exec ( path ) ;
if (! match || route . method != request . method )
return false ;

var urlParts = match . slice (1) . map ( decodeURIComponent );


route . handler . apply ( null , [ request , response ]
. concat ( urlParts ));
return true ;
}) ;
};

h?2 KQ/mH2 2tTQ`ib i?2 Router +QMbi`m+iQ`X  `Qmi2` Q#D2+i HHQrb M2r
?M/H2`b iQ #2 `2;Bbi2`2/ rBi? i?2 add K2i?Q/ M/ +M `2bQHp2 `2[m2bib

9y8
rBi? Bib resolve K2i?Q/X
h?2 Hii2` rBHH `2im`M  "QQH2M i?i BM/B+i2b r?2i?2`  ?M/H2` rb
7QmM/X h?2 some K2i?Q/ QM i?2 ``v Q7 `Qmi2b rBHH i`v i?2 `Qmi2b QM2
i  iBK2 UBM i?2 Q`/2` BM r?B+? i?2v r2`2 /2}M2/V M/ biQT- `2im`MBM;
true- r?2M  Ki+?BM; QM2 Bb 7QmM/X
h?2 ?M/H2` 7mM+iBQMb `2 +HH2/ rBi? i?2 request M/ response Q#D2+ibX
q?2M i?2 `2;mH` 2tT`2bbBQM i?i Ki+?2b i?2 l_G +QMiBMb Mv ;`QmTb-
i?2 bi`BM;b i?2v Ki+? `2 Tbb2/ iQ i?2 ?M/H2` b 2ti` `;mK2MibX
h?2b2 bi`BM;b ?p2 iQ #2 l_G@/2+Q/2/ bBM+2 i?2 `r l_G +QMiBMb %20@
bivH2 +Q/2bX

a2`pBM; }H2b
q?2M  `2[m2bi Ki+?2b MQM2 Q7 i?2 `2[m2bi ivT2b /2}M2/ BM Qm` `Qmi2`-
i?2 b2`p2` Kmbi BMi2`T`2i Bi b  `2[m2bi 7Q`  }H2 BM i?2 public /B`2+iQ`vX
Ai rQmH/ #2 TQbbB#H2 iQ mb2 i?2 }H2 b2`p2` /2}M2/ BM *?Ti2` ky iQ b2`p2
bm+? }H2b- #mi r2 M2Bi?2` M22/ MQ` rMi iQ bmTTQ`i PUT M/ DELETE `2[m2bib
QM }H2b- M/ r2 rQmH/ HBF2 iQ ?p2 /pM+2/ 72im`2b bm+? b bmTTQ`i
7Q` ++?BM;X aQ H2iǶb mb2  bQHB/- r2HH@i2bi2/ biiB+ }H2 b2`p2` 7`QK LSJ
BMbi2/X
A QTi2/ 7Q` ecstaticX h?Bb BbMǶi i?2 QMHv bm+? b2`p2` QM LSJ- #mi Bi
rQ`Fb r2HH M/ }ib Qm` Tm`TQb2bX h?2 ecstatic KQ/mH2 2tTQ`ib  7mM+@
iBQM i?i +M #2 +HH2/ rBi?  +QM};m`iBQM Q#D2+i iQ T`Q/m+2  `2[m2bi
?M/H2` 7mM+iBQMX q2 mb2 i?2 root QTiBQM iQ i2HH i?2 b2`p2` r?2`2 Bi
b?QmH/ HQQF 7Q` }H2bX h?2 ?M/H2` 7mM+iBQM ++2Tib request M/ response
T`K2i2`b M/ +M #2 Tbb2/ /B`2+iHv iQ createServer iQ +`2i2  b2`p2`
i?i b2`p2b QMHv }H2bX q2 rMi iQ }`bi +?2+F 7Q` `2[m2bib i?i r2 ?M/H2
bT2+BHHv- i?Qm;?- bQ r2 r`T Bi BM MQi?2` 7mM+iBQMX
var http = require (" http ") ;
var Router = require ("./ router ") ;
var ecstatic = require (" ecstatic ") ;

var fileServer = ecstatic ({ root : "./ public "}) ;


var router = new Router () ;

http . createServer ( function ( request , response ) {


if (! router . resolve ( request , response ) )

9ye
fileServer ( request , response ) ;
}) . listen (8000) ;

h?2 respond M/ respondJSON ?2HT2` 7mM+iBQMb `2 mb2/ i?`Qm;?Qmi i?2
b2`p2` +Q/2 iQ b2M/ Qz `2bTQMb2b rBi?  bBM;H2 7mM+iBQM +HHX
function respond ( response , status , data , type ) {
response . writeHead ( status , {
" Content - Type ": type || " text / plain "
}) ;
response . end ( data ) ;
}

function respondJSON ( response , status , data ) {


respond ( response , status , JSON . stringify ( data ) ,
" application / json ") ;
}

hHFb b `2bQm`+2b
h?2 b2`p2` F22Tb i?2 iHFb i?i ?p2 #22M T`QTQb2/ BM M Q#D2+i +HH2/
talks- r?Qb2 T`QT2`iv MK2b `2 i?2 iHF iBiH2bX h?2b2 rBHH #2 2tTQb2/
b >hhS `2bQm`+2b mM/2` /talks/[title]- bQ r2 M22/ iQ // ?M/H2`b iQ
Qm` `Qmi2` i?i BKTH2K2Mi i?2 p`BQmb K2i?Q/b i?i +HB2Mib +M mb2 iQ
rQ`F rBi? i?2KX
h?2 ?M/H2` 7Q` `2[m2bib i?i GET  bBM;H2 iHF Kmbi HQQF mT i?2 iHF M/
`2bTQM/ 2Bi?2` rBi? i?2 iHFǶb CaPL /i Q` rBi?  9y9 2``Q` `2bTQMb2X
var talks = Object . create ( null ) ;

router . add (" GET " , /^\/ talks \/([^\/]+) $ / ,


function ( request , response , title ) {
if ( title in talks )
respondJSON ( response , 200 , talks [ title ]) ;
else
respond ( response , 404 , " No talk " + title + " found ") ;
}) ;

.2H2iBM;  iHF Bb /QM2 #v `2KQpBM; Bi 7`QK i?2 talks Q#D2+iX


router . add (" DELETE " , /^\/ talks \/([^\/]+) $ / ,

9yd
function ( request , response , title ) {
if ( title in talks ) {
delete talks [ title ];
registerChange ( title ) ;
}
respond ( response , 204 , null );
}) ;

h?2 registerChange 7mM+iBQM- r?B+? r2 rBHH /2}M2 Hi2`- MQiB}2b rBiBM;


HQM;@TQHHBM; `2[m2bib #Qmi i?2 +?M;2X
hQ `2i`B2p2 i?2 +QMi2Mi Q7 CaPL@2M+Q/2/ `2[m2bi #Q/B2b- r2 /2}M2 
7mM+iBQM +HH2/ readStreamAsJSON- r?B+? `2/b HH +QMi2Mi 7`QK  bi`2K-
T`b2b Bi b CaPL- M/ i?2M +HHb  +HH#+F 7mM+iBQMX
function readStreamAsJSON ( stream , callback ) {
var data = "";
stream . on (" data " , function ( chunk ) {
data += chunk ;
}) ;
stream . on (" end " , function () {
var result , error ;
try { result = JSON . parse ( data ); }
catch ( e ) { error = e; }
callback ( error , result );
}) ;
stream . on (" error " , function ( error ) {
callback ( error ) ;
}) ;
}

PM2 ?M/H2` i?i M22/b iQ `2/ CaPL `2bTQMb2b Bb i?2 PUT ?M/H2`- r?B+?
Bb mb2/ iQ +`2i2 M2r iHFbX Ai ?b iQ +?2+F r?2i?2` i?2 /i Bi rb ;Bp2M
?b presenter M/ summary T`QT2`iB2b- r?B+? `2 bi`BM;bX Mv /i +QKBM;
7`QK QmibB/2 i?2 bvbi2K KB;?i #2 MQMb2Mb2- M/ r2 /QMǶi rMi iQ +Q``mTi
Qm` BMi2`MH /i KQ/2H- Q` 2p2M +`b?- r?2M #/ `2[m2bib +QK2 BMX
A7 i?2 /i HQQFb pHB/- i?2 ?M/H2` biQ`2b M Q#D2+i i?i `2T`2b2Mib i?2
M2r iHF BM i?2 talks Q#D2+i- TQbbB#Hv Qp2`r`BiBM; M 2tBbiBM; iHF rBi?
i?Bb iBiH2- M/ ;BM +HHb registerChangeX
router . add (" PUT " , /^\/ talks \/([^\/]+) $ / ,
function ( request , response , title ) {

9y3
readStreamAsJSON ( request , function ( error , talk ) {
if ( error ) {
respond ( response , 400 , error . toString () ) ;
} else if (! talk ||
typeof talk . presenter != " string " ||
typeof talk . summary != " string ") {
respond ( response , 400 , " Bad talk data ") ;
} else {
talks [ title ] = { title : title ,
presenter : talk . presenter ,
summary : talk . summary ,
comments : []};
registerChange ( title ) ;
respond ( response , 204 , null ) ;
}
}) ;
}) ;

//BM;  +QKK2Mi iQ  iHF rQ`Fb bBKBH`HvX q2 mb2 readStreamAsJSON iQ


;2i i?2 +QMi2Mi Q7 i?2 `2[m2bi- pHB/i2 i?2 `2bmHiBM; /i- M/ biQ`2 Bi
b  +QKK2Mi r?2M Bi HQQFb pHB/X
router . add (" POST " , /^\/ talks \/([^\/]+) \/ comments$ / ,
function ( request , response , title ) {
readStreamAsJSON ( request , function ( error , comment ) {
if ( error ) {
respond ( response , 400 , error . toString () ) ;
} else if (! comment ||
typeof comment . author != " string " ||
typeof comment . message != " string ") {
respond ( response , 400 , " Bad comment data ") ;
} else if ( title in talks ) {
talks [ title ]. comments . push ( comment );
registerChange ( title ) ;
respond ( response , 204 , null ) ;
} else {
respond ( response , 404 , " No talk " + title + " found ") ;
}
}) ;
}) ;

h`vBM; iQ //  +QKK2Mi iQ  MQM2tBbi2Mi iHF b?QmH/ `2im`M  9y9 2``Q`-

9yN
Q7 +Qm`b2X

GQM;@TQHHBM; bmTTQ`i
h?2 KQbi BMi2`2biBM; bT2+i Q7 i?2 b2`p2` Bb i?2 T`i i?i ?M/H2b HQM;
TQHHBM;X q?2M  GET `2[m2bi +QK2b BM 7Q` /talks- Bi +M #2 2Bi?2`  bBKTH2
`2[m2bi 7Q` HH iHFb Q`  `2[m2bi 7Q` mT/i2b- rBi?  changesSince T`K@
2i2`X
h?2`2 rBHH #2 p`BQmb bBimiBQMb BM r?B+? r2 ?p2 iQ b2M/  HBbi Q7 iHFb
iQ i?2 +HB2Mi- bQ r2 }`bi /2}M2  bKHH ?2HT2` 7mM+iBQM i?i ii+?2b i?2
serverTime }2H/ iQ bm+? `2bTQMb2bX

function sendTalks ( talks , response ) {


respondJSON ( response , 200 , {
serverTime : Date . now () ,
talks : talks
}) ;
}

h?2 ?M/H2` Bib2H7 M22/b iQ HQQF i i?2 [m2`v T`K2i2`b BM i?2 `2[m2biǶb
l_G iQ b22 r?2i?2`  changesSince T`K2i2` Bb ;Bp2MX A7 vQm ;Bp2 i?2
"url" KQ/mH2Ƕb parse 7mM+iBQM  b2+QM/ `;mK2Mi Q7 true- Bi rBHH HbQ T`b2
i?2 [m2`v T`i Q7  l_GX h?2 Q#D2+i Bi `2im`Mb rBHH ?p2  query T`QT2`iv-
r?B+? ?QH/b MQi?2` Q#D2+i i?i KTb T`K2i2` MK2b iQ pHm2bX
router . add (" GET " , /^\/ talks$ / , function ( request , response ) {
var query = require (" url ") . parse ( request . url , true ) . query ;
if ( query . changesSince == null ) {
var list = [];
for ( var title in talks )
list . push ( talks [ title ]) ;
sendTalks ( list , response ) ;
} else {
var since = Number ( query . changesSince );
if ( isNaN ( since ) ) {
respond ( response , 400 , " Invalid parameter ") ;
} else {
var changed = getChangedTalks ( since );
if ( changed . length > 0)
sendTalks ( changed , response );
else

9Ry
waitForChanges ( since , response );
}
}
}) ;

q?2M i?2 changesSince T`K2i2` Bb KBbbBM;- i?2 ?M/H2` bBKTHv #mBH/b


mT  HBbi Q7 HH iHFb M/ `2im`Mb i?iX
Pi?2`rBb2- i?2 changesSince T`K2i2` }`bi ?b iQ #2 +?2+F2/ iQ KF2
bm`2 i?i Bi Bb  pHB/ MmK#2`X h?2 getChangedTalks 7mM+iBQM- iQ #2 /2}M2/
b?Q`iHv- `2im`Mb M ``v Q7 +?M;2/ iHFb bBM+2  ;Bp2M TQBMi BM iBK2X A7
Bi `2im`Mb M 2KTiv ``v- i?2 b2`p2` /Q2b MQi v2i ?p2 Mvi?BM; iQ b2M/
#+F iQ i?2 +HB2Mi- bQ Bi biQ`2b i?2 `2bTQMb2 Q#D2+i UmbBM; waitForChangesV
iQ #2 `2bTQM/2/ iQ i  Hi2` iBK2X
var waiting = [];

function waitForChanges ( since , response ) {


var waiter = { since : since , response : response };
waiting . push ( waiter ) ;
setTimeout ( function () {
var found = waiting . indexOf ( waiter );
if ( found > -1) {
waiting . splice ( found , 1) ;
sendTalks ([] , response );
}
} , 90 * 1000) ;
}

h?2 splice K2i?Q/ Bb mb2/ iQ +mi  TB2+2 Qmi Q7 M ``vX uQm ;Bp2 Bi
M BM/2t M/  MmK#2` Q7 2H2K2Mib- M/ Bi Kmii2b i?2 ``v- `2KQpBM;
i?i KMv 2H2K2Mib 7i2` i?2 ;Bp2M BM/2tX AM i?Bb +b2- r2 `2KQp2 
bBM;H2 2H2K2Mi- i?2 Q#D2+i i?i i`+Fb i?2 rBiBM; `2bTQMb2- r?Qb2 BM/2t
r2 7QmM/ #v +HHBM; indexOfX A7 vQm Tbb //BiBQMH `;mK2Mib iQ splice-
i?2B` pHm2b rBHH #2 BMb2`i2/ BMiQ i?2 ``v i i?2 ;Bp2M TQbBiBQM- `2TH+BM;
i?2 `2KQp2/ 2H2K2MibX
q?2M  `2bTQMb2 Q#D2+i Bb biQ`2/ BM i?2 waiting ``v-  iBK2Qmi Bb
BKK2/Bi2Hv b2iX 7i2` Ny b2+QM/b- i?Bb iBK2Qmi b22b r?2i?2` i?2 `2[m2bi
Bb biBHH rBiBM; M/- B7 Bi Bb- b2M/b M 2KTiv `2bTQMb2 M/ `2KQp2b Bi 7`QK
i?2 waiting ``vX
hQ #2 #H2 iQ }M/ 2t+iHv i?Qb2 iHFb i?i ?p2 #22M +?M;2/ bBM+2 

9RR
;Bp2M TQBMi BM iBK2- r2 M22/ iQ F22T i`+F Q7 i?2 ?BbiQ`v Q7 +?M;2bX _2;@
Bbi2`BM;  +?M;2 rBi? registerChange rBHH `2K2K#2` i?i +?M;2- HQM;
rBi? i?2 +m``2Mi iBK2- BM M ``v +HH2/ changesX q?2M  +?M;2 Q++m`b-
i?i K2Mb i?2`2 Bb M2r /i- bQ HH rBiBM; `2[m2bib +M #2 `2bTQM/2/
iQ BKK2/Bi2HvX
var changes = [];

function registerChange ( title ) {


changes . push ({ title : title , time : Date . now () }) ;
waiting . forEach ( function ( waiter ) {
sendTalks ( getChangedTalks ( waiter . since ) , waiter . response ) ;
}) ;
waiting = [];
}

6BMHHv- getChangedTalks mb2b i?2 changes ``v iQ #mBH/ mT M ``v Q7


+?M;2/ iHFb- BM+Hm/BM; Q#D2+ib rBi?  deleted T`QT2`iv 7Q` iHFb i?i
MQ HQM;2` 2tBbiX q?2M #mBH/BM; i?i ``v- getChangedTalks ?b iQ 2Mbm`2
i?i Bi /Q2bMǶi BM+Hm/2 i?2 bK2 iHF irB+2 bBM+2 i?2`2 KB;?i ?p2 #22M
KmHiBTH2 +?M;2b iQ  iHF bBM+2 i?2 ;Bp2M iBK2X
function getChangedTalks ( since ) {
var found = [];
function alreadySeen ( title ) {
return found . some ( function ( f) { return f . title == title ;}) ;
}
for ( var i = changes . length - 1; i >= 0; i - -) {
var change = changes [i ];
if ( change . time <= since )
break ;
else if ( alreadySeen ( change . title ))
continue ;
else if ( change . title in talks )
found . push ( talks [ change . title ]) ;
else
found . push ({ title : change . title , deleted : true }) ;
}
return found ;
}

h?i +QM+Hm/2b i?2 b2`p2` +Q/2X _mMMBM; i?2 T`Q;`K /2}M2/ bQ 7` rBHH

9Rk
;2i vQm  b2`p2` `mMMBM; QM TQ`i 3yyy- r?B+? b2`p2b }H2b 7`QK i?2 public
bm#/B`2+iQ`v HQM;bB/2  iHF@KM;BM; BMi2`7+2 mM/2` i?2 /talks l_GX

h?2 +HB2Mi
h?2 +HB2Mi@bB/2 T`i Q7 i?2 iHF@KM;BM; r2#bBi2 +QMbBbib Q7 i?`22 }H2b,
M >hJG T;2-  bivH2 b?22i- M/  Cpa+`BTi }H2X

>hJG
Ai Bb  rB/2Hv mb2/ +QMp2MiBQM 7Q` r2# b2`p2`b iQ i`v iQ b2`p2  }H2 MK2/
index.html r?2M  `2[m2bi Bb K/2 /B`2+iHv iQ  Ti? i?i +Q``2bTQM/b
iQ  /B`2+iQ`vX h?2 }H2 b2`p2` KQ/mH2 r2 mb2- ecstatic- bmTTQ`ib i?Bb
+QMp2MiBQMX q?2M  `2[m2bi Bb K/2 iQ i?2 Ti? /- i?2 b2`p2` HQQFb 7Q`
i?2 }H2 ./public/index.html U./public #2BM; i?2 `QQi r2 ;p2 BiV M/ `2im`Mb
i?i }H2 B7 7QmM/X
h?mb- B7 r2 rMi  T;2 iQ b?Qr mT r?2M  #`Qrb2` Bb TQBMi2/ i Qm`
b2`p2`- r2 b?QmH/ Tmi Bi BM public/index.htmlX h?Bb Bb ?Qr Qm` BM/2t }H2
bi`ib,
<! doctype html >

< title > Skill Sharing </ title >


< link rel =" stylesheet " href =" skillsharing . css ">

<h1 > Skill sharing </ h1 >

<p > Your name : < input type =" text " id =" name " > </p >

< div id =" talks " > </ div >

Ai /2}M2b i?2 /Q+mK2Mi iBiH2 M/ BM+Hm/2b  bivH2 b?22i- r?B+? /2}M2b
 72r bivH2b iQ- KQM; Qi?2` i?BM;b- //  #Q`/2` `QmM/ iHFbX h?2M
Bi //b  ?2/BM; M/  MK2 }2H/X h?2 mb2` Bb 2tT2+i2/ iQ Tmi i?2B`
MK2 BM i?2 Hii2` bQ i?i Bi +M #2 ii+?2/ iQ iHFb M/ +QKK2Mib i?2v
bm#KBiX
h?2 <div> 2H2K2Mi rBi? i?2 A. "talks" rBHH +QMiBM i?2 +m``2Mi HBbi Q7
iHFbX h?2 b+`BTi }HHb i?2 HBbi BM r?2M Bi `2+2Bp2b iHFb 7`QK i?2 b2`p2`X

9Rj
L2ti +QK2b i?2 7Q`K i?i Bb mb2/ iQ +`2i2  M2r iHFX
< form id =" newtalk " >
<h3 > Submit a talk </ h3 >
Title : < input type =" text " style =" width : 40 em " name =" title ">
<br >
Summary : < input type =" text " style =" width : 40 em " name ="
summary ">
< button type =" submit " > Send </ button >
</ form >

h?2 b+`BTi rBHH //  "submit" 2p2Mi ?M/H2` iQ i?Bb 7Q`K- 7`QK r?B+? Bi
+M KF2 i?2 >hhS `2[m2bi i?i i2HHb i?2 b2`p2` #Qmi i?2 iHFX
L2ti +QK2b  `i?2` Kvbi2`BQmb #HQ+F- r?B+? ?b Bib display bivH2 b2i
iQ none- T`2p2MiBM; Bi 7`QK +imHHv b?QrBM; mT QM i?2 T;2X *M vQm
;m2bb r?i Bi Bb 7Q`\
< div id =" template " style =" display : none ">
< div class =" talk " >
<h2 >{{ title }} </ h2 >
<div > by < span class =" name " >{{ presenter }} </ span > </ div >
<p >{{ summary }} </ p >
< div class =" comments " > </ div >
<form >
< input type =" text " name =" comment " >
< button type =" submit " > Add comment </ button >
< button type =" button " class =" del "> Delete talk </ button >
</ form >
</ div >
< div class =" comment " >
< span class =" name " >{{ author }} </ span >: {{ message }}
</ div >
</ div >

*`2iBM; +QKTHB+i2/ .PJ bi`m+im`2b rBi? Cpa+`BTi +Q/2 T`Q/m+2b


m;Hv +Q/2X uQm +M KF2 i?2 +Q/2 bHB;?iHv #2ii2` #v BMi`Q/m+BM; ?2HT2`
7mM+iBQMb HBF2 i?2 elt 7mM+iBQM 7`QK *?Ti2` Rj- #mi i?2 `2bmHi rBHH biBHH
HQQF rQ`b2 i?M >hJG- r?B+? +M #2 i?Qm;?i Q7 b  /QKBM@bT2+B}+
HM;m;2 7Q` 2tT`2bbBM; .PJ bi`m+im`2bX
hQ +`2i2 .PJ bi`m+im`2b 7Q` i?2 iHFb- Qm` T`Q;`K rBHH /2}M2  bBK@
TH2 i2KTHiBM; bvbi2K- r?B+? mb2b ?B//2M .PJ bi`m+im`2b BM+Hm/2/ BM

9R9
i?2 /Q+mK2Mi iQ BMbiMiBi2 M2r .PJ bi`m+im`2b- `2TH+BM; i?2 TH+2@
?QH/2`b #2ir22M /Qm#H2 #`+2b rBi? i?2 pHm2b Q7  bT2+B}+ iHFX
6BMHHv- i?2 >hJG /Q+mK2Mi BM+Hm/2b i?2 b+`BTi }H2 i?i +QMiBMb i?2
+HB2Mi@bB/2 +Q/2X
< script src =" skillsharing_client . js " > </ script >

ai`iBM; mT
h?2 }`bi i?BM; i?2 +HB2Mi ?b iQ /Q r?2M i?2 T;2 Bb HQ/2/ Bb bF
i?2 b2`p2` 7Q` i?2 +m``2Mi b2i Q7 iHFbX aBM+2 r2 `2 ;QBM; iQ KF2
 HQi Q7 >hhS `2[m2bib- r2 rBHH ;BM /2}M2  bKHH r`TT2` `QmM/
XMLHttpRequest- r?B+? ++2Tib M Q#D2+i iQ +QM};m`2 i?2 `2[m2bi b r2HH
b  +HH#+F iQ +HH r?2M i?2 `2[m2bi }MBb?2bX
function request ( options , callback ) {
var req = new XMLHttpRequest () ;
req . open ( options . method || " GET ", options . pathname , true ) ;
req . addEventListener (" load ", function () {
if ( req . status < 400)
callback ( null , req . responseText );
else
callback ( new Error (" Request failed : " + req . statusText ))
;
}) ;
req . addEventListener (" error ", function () {
callback ( new Error (" Network error ") );
}) ;
req . send ( options . body || null );
}

h?2 BMBiBH `2[m2bi /BbTHvb i?2 iHFb Bi `2+2Bp2b QM i?2 b+`22M M/ bi`ib
i?2 HQM;@TQHHBM; T`Q+2bb #v +HHBM; waitForChangesX
var lastServerTime = 0;

request ({ pathname : " talks "} , function ( error , response ) {


if ( error ) {
reportError ( error ) ;
} else {
response = JSON . parse ( response ) ;

9R8
displayTalks ( response . talks );
lastServerTime = response . serverTime ;
waitForChanges () ;
}
}) ;

h?2 lastServerTime p`B#H2 Bb mb2/ iQ i`+F i?2 iBK2 Q7 i?2 Hbi mT/i2
i?i rb `2+2Bp2/ 7`QK i?2 b2`p2`X 7i2` i?2 BMBiBH `2[m2bi- i?2 +HB2MiǶb
pB2r Q7 i?2 iHFb +Q``2bTQM/b iQ i?2 pB2r i?i i?2 b2`p2` ?/ r?2M Bi
`2bTQM/2/ iQ i?i `2[m2biX h?mb- i?2 serverTime T`QT2`iv BM+Hm/2/ BM i?2
`2bTQMb2 T`QpB/2b M TT`QT`Bi2 BMBiBH pHm2 7Q` lastServerTimeX
q?2M i?2 `2[m2bi 7BHb- r2 /QMǶi rMi iQ ?p2 Qm` T;2 Dmbi bBi i?2`2-
/QBM; MQi?BM; rBi?Qmi 2tTHMiBQMX aQ r2 /2}M2  bBKTH2 7mM+iBQM +HH2/
reportError- r?B+? i H2bi b?Qrb i?2 mb2`  /BHQ; i?i i2HHb i?2K bQK2@
i?BM; r2Mi r`QM;X
function reportError ( error ) {
if ( error )
alert ( error . toString () );
}

h?2 7mM+iBQM +?2+Fb r?2i?2` i?2`2 Bb M +imH 2``Q`- M/ Bi H2`ib QMHv
r?2M i?2`2 Bb QM2X h?i rv- r2 +M HbQ /B`2+iHv Tbb i?Bb 7mM+iBQM iQ
request 7Q` `2[m2bib r?2`2 r2 +M B;MQ`2 i?2 `2bTQMb2X h?Bb KF2b bm`2
i?i B7 i?2 `2[m2bi 7BHb- i?2 2``Q` Bb `2TQ`i2/ iQ i?2 mb2`X

.BbTHvBM; iHFb
hQ #2 #H2 iQ mT/i2 i?2 pB2r Q7 i?2 iHFb r?2M +?M;2b +QK2 BM- i?2
+HB2Mi Kmbi F22T i`+F Q7 i?2 iHFb i?i Bi Bb +m``2MiHv b?QrBM;X h?i
rv- r?2M  M2r p2`bBQM Q7  iHF i?i Bb H`2/v QM i?2 b+`22M +QK2b
BM- i?2 iHF +M #2 `2TH+2/ UBM TH+2V rBi? Bib mT/i2/ 7Q`KX aBKBH`Hv-
r?2M BM7Q`KiBQM +QK2b BM i?i  iHF Bb #2BM; /2H2i2/- i?2 `B;?i .PJ
2H2K2Mi +M #2 `2KQp2/ 7`QK i?2 /Q+mK2MiX
h?2 7mM+iBQM displayTalks Bb mb2/ #Qi? iQ #mBH/ mT i?2 BMBiBH /BbTHv
M/ iQ mT/i2 Bi r?2M bQK2i?BM; +?M;2bX Ai rBHH mb2 i?2 shownTalks
Q#D2+i- r?B+? bbQ+Bi2b iHF iBiH2b rBi? .PJ MQ/2b- iQ `2K2K#2` i?2
iHFb Bi +m``2MiHv ?b QM i?2 b+`22MX

9Re
var talkDiv = document . querySelector ("# talks ") ;
var shownTalks = Object . create ( null );

function displayTalks ( talks ) {


talks . forEach ( function ( talk ) {
var shown = shownTalks [ talk . title ];
if ( talk . deleted ) {
if ( shown ) {
talkDiv . removeChild ( shown );
delete shownTalks [ talk . title ];
}
} else {
var node = drawTalk ( talk );
if ( shown )
talkDiv . replaceChild ( node , shown ) ;
else
talkDiv . appendChild ( node );
shownTalks [ talk . title ] = node ;
}
}) ;
}

"mBH/BM; mT i?2 .PJ bi`m+im`2 7Q` iHFb Bb /QM2 mbBM; i?2 i2KTHi2b
i?i r2`2 BM+Hm/2/ BM i?2 >hJG /Q+mK2MiX 6B`bi- r2 Kmbi /2}M2
instantiateTemplate- r?B+? HQQFb mT M/ }HHb BM  i2KTHi2X
h?2 name T`K2i2` Bb i?2 i2KTHi2Ƕb MK2X hQ HQQF mT i?2 i2KTHi2
2H2K2Mi- r2 b2`+? 7Q` M 2H2K2Mi r?Qb2 +Hbb MK2 Ki+?2b i?2 i2KTHi2
MK2- r?B+? Bb  +?BH/ Q7 i?2 2H2K2Mi rBi? A. "template"X lbBM; i?2
querySelector K2i?Q/ KF2b i?Bb 2bvX h?2`2 r2`2 i2KTHi2b MK2/ "
talk" M/ "comment" BM i?2 >hJG T;2X

function instantiateTemplate ( name , values ) {


function instantiateText ( text ) {
return text . replace (/\{\{(\ w +) \}\}/ g , function (_ , name ) {
return values [ name ];
}) ;
}
function instantiate ( node ) {
if ( node . nodeType == document . ELEMENT_NODE ) {
var copy = node . cloneNode () ;
for ( var i = 0; i < node . childNodes . length ; i ++)
copy . appendChild ( instantiate ( node . childNodes [ i ]) ) ;

9Rd
return copy ;
} else if ( node . nodeType == document . TEXT_NODE ) {
return document . createTextNode (
instantiateText ( node . nodeValue ));
} else {
return node ;
}
}

var template = document . querySelector ("# template ." + name ) ;


return instantiate ( template );
}

h?2 cloneNode K2i?Q/- r?B+? HH .PJ MQ/2b ?p2- +`2i2b  +QTv Q7 
MQ/2X Ai rQMǶi +QTv i?2 MQ/2Ƕb +?BH/ MQ/2b mMH2bb true Bb ;Bp2M b  }`bi
`;mK2MiX h?2 instantiate 7mM+iBQM `2+m`bBp2Hv #mBH/b mT  +QTv Q7 i?2
i2KTHi2- }HHBM; BM i?2 i2KTHi2 b Bi ;Q2bX
h?2 b2+QM/ `;mK2Mi iQ instantiateTemplate b?QmH/ #2 M Q#D2+i- r?Qb2
T`QT2`iB2b ?QH/ i?2 bi`BM;b i?i `2 iQ #2 }HH2/ BMiQ i?2 i2KTHi2X 
TH+2?QH/2` HBF2 {{title}} rBHH #2 `2TH+2/ rBi? i?2 pHm2 Q7 valuesǶ title
T`QT2`ivX
h?Bb Bb  +`m/2 TT`Q+? iQ i2KTHiBM;- #mi Bi Bb 2MQm;? iQ BKTH2K2Mi
drawTalkX

function drawTalk ( talk ) {


var node = instantiateTemplate (" talk " , talk ) ;
var comments = node . querySelector (". comments ") ;
talk . comments . forEach ( function ( comment ) {
comments . appendChild (
instantiateTemplate (" comment " , comment ));
}) ;

node . querySelector (" button . del ") . addEventListener (


" click " , deleteTalk . bind ( null , talk . title ) ) ;

var form = node . querySelector (" form ") ;


form . addEventListener (" submit " , function ( event ) {
event . preventDefault () ;
addComment ( talk . title , form . elements . comment . value ) ;
form . reset () ;
}) ;

9R3
return node ;
}

7i2` BMbiMiBiBM; i?2 "talk" i2KTHi2- i?2`2 `2 p`BQmb i?BM;b i?i M22/
iQ #2 Ti+?2/ mTX 6B`bi- i?2 +QKK2Mib ?p2 iQ #2 }HH2/ BM #v `2T2i2/Hv
BMbiMiBiBM; i?2 "comment" i2KTHi2 M/ TT2M/BM; i?2 `2bmHib iQ i?2
MQ/2 rBi? +Hbb "comments"X L2ti- 2p2Mi ?M/H2`b ?p2 iQ #2 ii+?2/ iQ
i?2 #miiQM i?i /2H2i2b i?2 ibF M/ i?2 7Q`K i?i //b  M2r +QKK2MiX

lT/iBM; i?2 b2`p2`


h?2 2p2Mi ?M/H2`b `2;Bbi2`2/ #v drawTalk +HH i?2 7mM+iBQM deleteTalk M/
addComment iQ T2`7Q`K i?2 +imH +iBQMb `2[mB`2/ iQ /2H2i2  iHF Q` //
 +QKK2MiX h?2b2 rBHH M22/ iQ #mBH/ mT l_Gb i?i `272` iQ iHFb rBi? 
;Bp2M iBiH2- 7Q` r?B+? r2 /2}M2 i?2 talkURL ?2HT2` 7mM+iBQMX
function talkURL ( title ) {
return " talks /" + encodeURIComponent ( title ) ;
}

h?2 deleteTalk 7mM+iBQM }`2b Qz  DELETE `2[m2bi M/ `2TQ`ib i?2 2``Q`
r?2M i?i 7BHbX
function deleteTalk ( title ) {
request ({ pathname : talkURL ( title ) , method : " DELETE "} ,
reportError ) ;
}

//BM;  +QKK2Mi `2[mB`2b #mBH/BM; mT  CaPL `2T`2b2MiiBQM Q7 i?2


+QKK2Mi M/ bm#KBiiBM; i?i b T`i Q7  POST `2[m2biX
function addComment ( title , comment ) {
var comment = { author : nameField . value , message : comment };
request ({ pathname : talkURL ( title ) + "/ comments " ,
body : JSON . stringify ( comment ) ,
method : " POST "} ,
reportError ) ;
}

h?2 nameField p`B#H2 mb2/ iQ b2i i?2 +QKK2MiǶb author T`QT2`iv Bb 


`272`2M+2 iQ i?2 <input> }2H/ i i?2 iQT Q7 i?2 T;2 i?i HHQrb i?2 mb2`
iQ bT2+B7v i?2B` MK2X q2 HbQ rB`2 mT i?i }2H/ iQ localStorage bQ i?i

9RN
Bi /Q2b MQi ?p2 iQ #2 }HH2/ BM ;BM 2p2`v iBK2 i?2 T;2 Bb `2HQ/2/X
var nameField = document . querySelector ("# name ") ;

nameField . value = localStorage . getItem (" name ") || "";

nameField . addEventListener (" change " , function () {


localStorage . setItem (" name ", nameField . value ) ;
}) ;

h?2 7Q`K i i?2 #QiiQK Q7 i?2 T;2- 7Q` T`QTQbBM;  M2r iHF- ;2ib 
"submit" 2p2Mi ?M/H2`X h?Bb ?M/H2` T`2p2Mib i?2 2p2MiǶb /27mHi 2z2+i
Ur?B+? rQmH/ +mb2  T;2 `2HQ/V- +H2`b i?2 7Q`K- M/ }`2b Qz  PUT
`2[m2bi iQ +`2i2 i?2 iHFX
var talkForm = document . querySelector ("# newtalk ") ;

talkForm . addEventListener (" submit " , function ( event ) {


event . preventDefault () ;
request ({ pathname : talkURL ( talkForm . elements . title . value ) ,
method : " PUT ",
body : JSON . stringify ({
presenter : nameField . value ,
summary : talkForm . elements . summary . value
}) } , reportError );
talkForm . reset () ;
}) ;

LQiB+BM; +?M;2b
A b?QmH/ TQBMi Qmi i?i i?2 p`BQmb 7mM+iBQMb i?i +?M;2 i?2 bii2 Q7
i?2 TTHB+iBQM #v +`2iBM; Q` /2H2iBM; iHFb Q` //BM;  +QKK2Mi /Q
#bQHmi2Hv MQi?BM; iQ 2Mbm`2 i?i i?2 +?M;2b i?2v KF2 `2 pBbB#H2 QM
i?2 b+`22MX h?2v bBKTHv i2HH i?2 b2`p2` M/ `2Hv QM i?2 HQM;@TQHHBM;
K2+?MBbK iQ i`B;;2` i?2 TT`QT`Bi2 mT/i2b iQ i?2 T;2X
:Bp2M i?2 K2+?MBbK i?i r2 BKTH2K2Mi2/ BM Qm` b2`p2` M/ i?2 rv
r2 /2}M2/ displayTalks iQ ?M/H2 mT/i2b Q7 iHFb i?i `2 H`2/v QM
i?2 T;2- i?2 +imH HQM; TQHHBM; Bb bm`T`BbBM;Hv bBKTH2X
function waitForChanges () {

9ky
request ({ pathname : " talks ? changesSince =" + lastServerTime } ,
function ( error , response ) {
if ( error ) {
setTimeout ( waitForChanges , 2500) ;
console . error ( error . stack ) ;
} else {
response = JSON . parse ( response );
displayTalks ( response . talks ) ;
lastServerTime = response . serverTime ;
waitForChanges () ;
}
}) ;
}

h?Bb 7mM+iBQM Bb +HH2/ QM+2 r?2M i?2 T`Q;`K bi`ib mT M/ i?2M F22Tb
+HHBM; Bib2H7 iQ 2Mbm`2 i?i  TQHHBM; `2[m2bi Bb Hrvb +iBp2X q?2M i?2
`2[m2bi 7BHb- r2 /QMǶi +HH reportError bBM+2 TQTTBM; mT  /BHQ; 2p2`v
iBK2 r2 7BH iQ `2+? i?2 b2`p2` rQmH/ ;2i MMQvBM; r?2M i?2 b2`p2` Bb
/QrMX AMbi2/- i?2 2``Q` Bb r`Bii2M iQ i?2 +QMbQH2 UiQ 2b2 /2#m;;BM;V-
M/ MQi?2` ii2KTi Bb K/2 kX8 b2+QM/b Hi2`X
q?2M i?2 `2[m2bi bm++22/b- i?2 M2r /i Bb Tmi QMiQ i?2 b+`22M- M/
lastServerTime Bb mT/i2/ iQ `2~2+i i?2 7+i i?i r2 `2+2Bp2/ /i +Q``2@
bTQM/BM; iQ i?Bb M2r TQBMi BM iBK2X h?2 `2[m2bi Bb BKK2/Bi2Hv `2bi`i2/
iQ rBi 7Q` i?2 M2ti mT/i2X
A7 vQm `mM i?2 b2`p2` M/ QT2M irQ #`Qrb2` rBM/Qrb 7Q` HQ+H?Qbi,3yyyf
M2ti iQ 2+? Qi?2`- vQm +M b22 i?i i?2 +iBQMb vQm T2`7Q`K BM QM2
rBM/Qr `2 BKK2/Bi2Hv pBbB#H2 BM i?2 Qi?2`X

1t2`+Bb2b
h?2 7QHHQrBM; 2t2`+Bb2b rBHH BMpQHp2 KQ/B7vBM; i?2 bvbi2K /2}M2/ BM i?Bb
+?Ti2`X hQ rQ`F QM i?2K- KF2 bm`2 vQm /QrMHQ/ i?2 +Q/2 }`bi U2HQ@
[m2MiDpb+`BTiXM2if+Q/2fbFBHHb?`BM;XxBTV M/ ?p2 LQ/2 BMbiHH2/ UMQ/2DbXQ`;VX

.BbF T2`bBbi2M+2
h?2 bFBHH@b?`BM; b2`p2` F22Tb Bib /i Tm`2Hv BM K2KQ`vX h?Bb K2Mb
i?i r?2M Bi +`b?2b Q` Bb `2bi`i2/ 7Q` Mv `2bQM- HH iHFb M/ +QKK2Mib

9kR
`2 HQbiX
1ti2M/ i?2 b2`p2` bQ i?i Bi biQ`2b i?2 iHF /i iQ /BbF M/ miQ@
KiB+HHv `2HQ/b i?2 /i r?2M Bi Bb `2bi`i2/X .Q MQi rQ``v #Qmi
2{+B2M+vě/Q i?2 bBKTH2bi i?BM; i?i rQ`FbX

*QKK2Mi }2H/ `2b2ib


h?2 r?QH2bH2 `2/`rBM; Q7 iHFb rQ`Fb T`2iiv r2HH #2+mb2 vQm mbmHHv
+MǶi i2HH i?2 /Bz2`2M+2 #2ir22M  .PJ MQ/2 M/ Bib B/2MiB+H `2TH+2@
K2MiX "mi i?2`2 `2 2t+2TiBQMbX A7 vQm bi`i ivTBM; bQK2i?BM; BM i?2
+QKK2Mi }2H/ 7Q`  iHF BM QM2 #`Qrb2` rBM/Qr M/ i?2M- BM MQi?2`-
//  +QKK2Mi iQ i?i iHF- i?2 }2H/ BM i?2 }`bi rBM/Qr rBHH #2 `2/`rM-
`2KQpBM; #Qi? Bib +QMi2Mi M/ Bib 7Q+mbX
AM  ?2i2/ /Bb+mbbBQM- r?2`2 KmHiBTH2 T2QTH2 `2 //BM; +QKK2Mib iQ
 bBM;H2 iHF- i?Bb rQmH/ #2 p2`v MMQvBM;X *M vQm +QK2 mT rBi?  rv
iQ pQB/ Bi\

"2ii2` i2KTHi2b
JQbi i2KTHiBM; bvbi2Kb /Q KQ`2 i?M Dmbi }HH BM bQK2 bi`BM;bX i i?2
p2`v H2bi- i?2v HbQ HHQr +QM/BiBQMH BM+HmbBQM Q7 T`ib Q7 i?2 i2KTHi2-
MHQ;Qmb iQ if bii2K2Mib- M/ `2T2iBiBQM Q7 T`ib Q7  i2KTHi2- bBKBH`
iQ  HQQTX
A7 r2 r2`2 #H2 iQ `2T2i  TB2+2 Q7 i2KTHi2 7Q` 2+? 2H2K2Mi BM M
``v- r2 rQmH/ MQi M22/ i?2 b2+QM/ i2KTHi2 U"comment"VX _i?2`- r2
+QmH/ bT2+B7v i?2 "talk" i2KTHi2 iQ HQQT Qp2` i?2 ``v ?2H/ BM  iHFǶb
comments T`QT2`iv M/ `2M/2` i?2 MQ/2b i?i KF2 mT  +QKK2Mi 7Q`
2p2`v 2H2K2Mi BM i?2 ``vX
Ai +QmH/ HQQF HBF2 i?Bb,
< div class =" comments " >
< div class =" comment " template - repeat =" comments " >
< span class =" name " >{{ author }} </ span >: {{ message }}
</ div >
</ div >

h?2 B/2 Bb i?i r?2M2p2`  MQ/2 rBi?  template-repeat ii`B#mi2 Bb 7QmM/


/m`BM; i2KTHi2 BMbiMiBiBQM- i?2 BMbiMiBiBM; +Q/2 HQQTb Qp2` i?2 ``v

9kk
?2H/ BM i?2 T`QT2`iv MK2/ #v i?i ii`B#mi2X 6Q` 2+? 2H2K2Mi BM i?2
``v- Bi //b M BMbiM+2 Q7 i?2 MQ/2X h?2 i2KTHi2Ƕb +QMi2ti Ui?2
values p`B#H2 BM instantiateTemplateV rQmH/- /m`BM; i?Bb HQQT- TQBMi i
i?2 +m``2Mi 2H2K2Mi Q7 i?2 ``v bQ i?i {{author}} rQmH/ #2 HQQF2/ mT
BM i?2 +QKK2Mi Q#D2+i `i?2` i?M BM i?2 Q`B;BMH +QMi2ti Ui?2 iHFVX
_2r`Bi2 instantiateTemplate iQ BKTH2K2Mi i?Bb M/ i?2M +?M;2 i?2 i2K@
THi2b iQ mb2 i?Bb 72im`2 M/ `2KQp2 i?2 2tTHB+Bi `2M/2`BM; Q7 +QKK2Mib
7`QK i?2 drawTalk 7mM+iBQMX
>Qr rQmH/ vQm // +QM/BiBQMH BMbiMiBiBQM Q7 MQ/2b- KFBM; Bi TQb@
bB#H2 iQ QKBi T`ib Q7 i?2 i2KTHi2 r?2M  ;Bp2M pHm2 Bb i`m2 Q` 7Hb2\

h?2 mMb+`BTi#H2b
q?2M bQK2QM2 pBbBib Qm` r2#bBi2 rBi?  #`Qrb2` i?i ?b Cpa+`BTi
/Bb#H2/ Q` Bb bBKTHv MQi +T#H2 Q7 /BbTHvBM; Cpa+`BTi- i?2v rBHH ;2i
 +QKTH2i2Hv #`QF2M- BMQT2`#H2 T;2X h?Bb Bb MQi MB+2X
aQK2 ivT2b Q7 r2# TTHB+iBQMb `2HHv +MǶi #2 /QM2 rBi?Qmi Cpa+`BTiX
6Q` Qi?2`b- vQm Dmbi /QMǶi ?p2 i?2 #m/;2i Q` TiB2M+2 iQ #Qi?2` #Qmi
+HB2Mib i?i +MǶi `mM b+`BTibX "mi 7Q` T;2b rBi?  rB/2 m/B2M+2- Bi Bb
TQHBi2 iQ bmTTQ`i b+`BTiH2bb mb2`bX
h`v iQ i?BMF Q7  rv i?2 bFBHH@b?`BM; r2#bBi2 +QmH/ #2 b2i mT iQ T`2@
b2`p2 #bB+ 7mM+iBQMHBiv r?2M `mM rBi?Qmi Cpa+`BTiX h?2 miQKiB+
mT/i2b rBHH ?p2 iQ ;Q- M/ T2QTH2 rBHH ?p2 iQ `27`2b? i?2B` T;2 i?2
QH/@7b?BQM2/ rvX "mi #2BM; #H2 iQ b22 2tBbiBM; iHFb- +`2i2 M2r QM2b-
M/ bm#KBi +QKK2Mib rQmH/ #2 MB+2X
.QMǶi 722H Q#HB;2/ iQ +imHHv BKTH2K2Mi i?BbX PmiHBMBM;  bQHmiBQM Bb
2MQm;?X .Q2b i?2 `2pBb2/ TT`Q+? bi`BF2 vQm b KQ`2 Q` H2bb 2H2;Mi
i?M r?i r2 /B/ BMBiBHHv\

9kj
1t2`+Bb2 >BMib
h?2 ?BMib #2HQr KB;?i ?2HT r?2M vQm `2 bim+F rBi? QM2 Q7 i?2 2t2`+Bb2b
BM i?Bb #QQFX h?2v /QMǶi ;Bp2 rv i?2 2MiB`2 bQHmiBQM- #mi `i?2` i`v iQ
?2HT vQm }M/ Bi vQm`b2H7X

S`Q;`K ai`m+im`2
GQQTBM;  i`BM;H2
uQm +M bi`i rBi?  T`Q;`K i?i bBKTHv T`BMib Qmi i?2 MmK#2`b R iQ d-
r?B+? vQm +M /2`Bp2 #v KFBM;  72r KQ/B}+iBQMb iQ i?2 2p2M MmK#2`
T`BMiBM; 2tKTH2 ;Bp2M 2`HB2` BM i?2 +?Ti2`- r?2`2 i?2 for HQQT rb
BMi`Q/m+2/X
LQr +QMbB/2` i?2 2[mBpH2M+2 #2ir22M MmK#2`b M/ bi`BM;b Q7 ?b?
+?`+i2`bX uQm +M ;Q 7`QK R iQ k #v //BM; R U+= 1VX uQm +M ;Q 7`QK
"\#" iQ "\#\#" #v //BM;  +?`+i2` U+= "\#"VX h?mb- vQm` bQHmiBQM +M
+HQb2Hv 7QHHQr i?2 MmK#2`@T`BMiBM; T`Q;`KX

6Bxx"mxx
:QBM; Qp2` i?2 MmK#2`b Bb +H2`Hv  HQQTBM; DQ#- M/ b2H2+iBM; r?i iQ
T`BMi Bb  Kii2` Q7 +QM/BiBQMH 2t2+miBQMX _2K2K#2` i?2 i`B+F Q7 mbBM;
i?2 `2KBM/2` U%V QT2`iQ` 7Q` +?2+FBM; r?2i?2`  MmK#2` Bb /BpBbB#H2 #v
MQi?2` MmK#2` U?b  `2KBM/2` Q7 x2`QVX
AM i?2 }`bi p2`bBQM- i?2`2 `2 i?`22 TQbbB#H2 Qmi+QK2b 7Q` 2p2`v MmK#2`-
bQ vQmǶHH ?p2 iQ +`2i2 M iffelse iffelse +?BMX
h?2 b2+QM/ p2`bBQM Q7 i?2 T`Q;`K ?b  bi`B;?i7Q`r`/ bQHmiBQM M/
 +H2p2` QM2X h?2 bBKTH2 rv Bb iQ // MQi?2` dz#`M+?Ǵ iQ T`2+Bb2Hv i2bi
i?2 ;Bp2M +QM/BiBQMX 6Q` i?2 +H2p2` K2i?Q/- #mBH/ mT  bi`BM; +QMiBMBM;
i?2 rQ`/ Q` rQ`/b iQ QmiTmi- M/ T`BMi 2Bi?2` i?Bb rQ`/ Q` i?2 MmK#2`
B7 i?2`2 Bb MQ rQ`/- TQi2MiBHHv #v KFBM; 2H2;Mi mb2 Q7 i?2 || QT2`iQ`X

9k9
*?2bb #Q`/
h?2 bi`BM; +M #2 #mBHi #v bi`iBM; rBi? M 2KTiv QM2 U""V M/ `2T2i2/Hv
//BM; +?`+i2`bX  M2rHBM2 +?`+i2` Bb r`Bii2M "\n"X
lb2 console.log iQ BMbT2+i i?2 QmiTmi Q7 vQm` T`Q;`KX
hQ rQ`F rBi? irQ /BK2MbBQMb- vQm rBHH M22/  HQQT BMbB/2 Q7  HQQTX
Smi +m`Hv #`+2b `QmM/ i?2 #Q/B2b Q7 #Qi? HQQTb iQ KF2 Bi 2bv iQ b22
r?2`2 i?2v bi`i M/ 2M/X h`v iQ T`QT2`Hv BM/2Mi i?2b2 #Q/B2bX h?2
Q`/2` Q7 i?2 HQQTb Kmbi 7QHHQr i?2 Q`/2` BM r?B+? r2 #mBH/ mT i?2 bi`BM;
UHBM2 #v HBM2- H27i iQ `B;?i- iQT iQ #QiiQKVX aQ i?2 Qmi2` HQQT ?M/H2b i?2
HBM2b M/ i?2 BMM2` HQQT ?M/H2b i?2 +?`+i2`b QM  HBM2X
uQmǶHH M22/ irQ p`B#H2b iQ i`+F vQm` T`Q;`2bbX hQ FMQr r?2i?2` iQ
Tmi  bT+2 Q`  ?b? bB;M i  ;Bp2M TQbBiBQM- vQm +QmH/ i2bi r?2i?2`
i?2 bmK Q7 i?2 irQ +QmMi2`b Bb 2p2M U% 2VX
h2`KBMiBM;  HBM2 #v //BM;  M2rHBM2 +?`+i2` ?TT2Mb 7i2` i?2
HBM2 ?b #22M #mBHi mT- bQ /Q i?Bb 7i2` i?2 BMM2` HQQT #mi BMbB/2 Q7 i?2
Qmi2` HQQTX

6mM+iBQMb
JBMBKmK
A7 vQm ?p2 i`Qm#H2 TmiiBM; #`+2b M/ T`2Mi?2b2b BM i?2 `B;?i TH+2 iQ
;2i  pHB/ 7mM+iBQM /2}MBiBQM- bi`i #v +QTvBM; QM2 Q7 i?2 2tKTH2b BM
i?Bb +?Ti2` M/ KQ/B7vBM; BiX
 7mM+iBQM Kv +QMiBM KmHiBTH2 return bii2K2MibX

_2+m`bBQM
uQm` 7mM+iBQM rBHH HBF2Hv HQQF bQK2r?i bBKBH` iQ i?2 BMM2` find 7mM+iBQM
BM i?2 `2+m`bBp2 findSolution 2tKTH2 BM i?Bb +?Ti2`- rBi? M iffelse if
felse +?BM i?i i2bib r?B+? Q7 i?2 i?`22 +b2b TTHB2bX h?2 }MH else-
+Q``2bTQM/BM; iQ i?2 i?B`/ +b2- KF2b i?2 `2+m`bBp2 +HHX 1+? Q7 i?2
#`M+?2b b?QmH/ +QMiBM  return bii2K2Mi Q` BM bQK2 Qi?2` rv ``M;2
7Q`  bT2+B}+ pHm2 iQ #2 `2im`M2/X
q?2M ;Bp2M  M2;iBp2 MmK#2`- i?2 7mM+iBQM rBHH `2+m`b2 ;BM M/
;BM- TbbBM; Bib2H7 M 2p2` KQ`2 M2;iBp2 MmK#2`- i?mb ;2iiBM; 7m`i?2`

9k8
M/ 7m`i?2` rv 7`QK `2im`MBM;  `2bmHiX Ai rBHH 2p2MimHHv `mM Qmi Q7
bi+F bT+2 M/ #Q`iX

"2M +QmMiBM;
 HQQT BM vQm` 7mM+iBQM rBHH ?p2 iQ HQQF i 2p2`v +?`+i2` BM i?2 bi`BM;
#v `mMMBM; M BM/2t 7`QK x2`Q iQ QM2 #2HQr Bib H2M;i? U< string.length
VX A7 i?2 +?`+i2` i i?2 +m``2Mi TQbBiBQM Bb i?2 bK2 b i?2 QM2 i?2
7mM+iBQM Bb HQQFBM; 7Q`- Bi //b R iQ  +QmMi2` p`B#H2X PM+2 i?2 HQQT
?b }MBb?2/- i?2 +QmMi2` +M #2 `2im`M2/X
hF2 +`2 iQ KF2 HH i?2 p`B#H2b mb2/ BM i?2 7mM+iBQM HQ+H iQ i?2
7mM+iBQM #v mbBM; i?2 var F2vrQ`/X

.i ai`m+im`2b, P#D2+ib M/ ``vb


h?2 bmK Q7  `M;2
"mBH/BM; mT M ``v Bb KQbi 2bBHv /QM2 #v }`bi BMBiBHBxBM;  p`B#H2 iQ
[] U 7`2b?- 2KTiv ``vV M/ `2T2i2/Hv +HHBM; Bib push K2i?Q/ iQ //
 pHm2X .QMǶi 7Q`;2i iQ `2im`M i?2 ``v i i?2 2M/ Q7 i?2 7mM+iBQMX
aBM+2 i?2 2M/ #QmM/`v Bb BM+HmbBp2- vQmǶHH M22/ iQ mb2 i?2 <= QT2`iQ`
`i?2` i?M bBKTHv < iQ +?2+F 7Q` i?2 2M/ Q7 vQm` HQQTX
hQ +?2+F r?2i?2` i?2 QTiBQMH bi2T `;mK2Mi rb ;Bp2M- 2Bi?2` +?2+F
arguments.length Q` +QKT`2 i?2 pHm2 Q7 i?2 `;mK2Mi iQ undefinedX A7
Bi rbMǶi ;Bp2M- bBKTHv b2i Bi iQ Bib /27mHi pHm2 URV i i?2 iQT Q7 i?2
7mM+iBQMX
>pBM; range mM/2`biM/ M2;iBp2 bi2T pHm2b Bb T`Q##Hv #2bi /QM2 #v
r`BiBM; irQ b2T`i2 HQQTběQM2 7Q` +QmMiBM; mT M/ QM2 7Q` +QmMiBM;
/QrMě#2+mb2 i?2 +QKT`BbQM i?i +?2+Fb r?2i?2` i?2 HQQT Bb }MBb?2/
M22/b iQ #2 >= `i?2` i?M <= r?2M +QmMiBM; /QrMr`/X
Ai KB;?i HbQ #2 rQ`i?r?BH2 iQ mb2  /Bz2`2Mi /27mHi bi2T- MK2Hv- @R-
r?2M i?2 2M/ Q7 i?2 `M;2 Bb bKHH2` i?M i?2 bi`iX h?i rv- range(5,
2) `2im`Mb bQK2i?BM; K2MBM;7mH- `i?2` i?M ;2iiBM; bim+F BM M BM}MBi2
HQQTX

9ke
_2p2`bBM; M ``v
h?2`2 `2 irQ Q#pBQmb rvb iQ BKTH2K2Mi reverseArrayX h?2 }`bi Bb iQ
bBKTHv ;Q Qp2` i?2 BMTmi ``v 7`QK 7`QMi iQ #+F M/ mb2 i?2 unshift
K2i?Q/ QM i?2 M2r ``v iQ BMb2`i 2+? 2H2K2Mi i Bib bi`iX h?2 b2+QM/ Bb
iQ HQQT Qp2` i?2 BMTmi ``v #+Fr`/ M/ mb2 i?2 push K2i?Q/X Ai2`iBM;
Qp2` M ``v #+Fr`/ `2[mB`2b  UbQK2r?i rFr`/V for bT2+B}+iBQM
HBF2 (var i = array.length - 1; i >= 0; i--)X
_2p2`bBM; i?2 ``v BM TH+2 Bb ?`/2`X uQm ?p2 iQ #2 +`27mH MQi
iQ Qp2`r`Bi2 2H2K2Mib i?i vQm rBHH Hi2` M22/X lbBM; reverseArray Q`
Qi?2`rBb2 +QTvBM; i?2 r?QH2 ``v Uarray.slice(0) Bb  ;QQ/ rv iQ +QTv
M ``vV rQ`Fb #mi Bb +?2iBM;X
h?2 i`B+F Bb iQ brT i?2 }`bi M/ Hbi 2H2K2Mib- i?2M i?2 b2+QM/ M/
b2+QM/@iQ@Hbi- M/ bQ QMX uQm +M /Q i?Bb #v HQQTBM; Qp2` ?H7 i?2
H2M;i? Q7 i?2 ``v Umb2 Math.floor iQ `QmM/ /QrMěvQm /QMǶi M22/ iQ
iQm+? i?2 KB//H2 2H2K2Mi BM M ``v rBi? M Q// H2M;i?V M/ brTTBM;
i?2 2H2K2Mi i TQbBiBQM i rBi? i?2 QM2 i TQbBiBQM array.length - 1 - iX
uQm +M mb2  HQ+H p`B#H2 iQ #`B2~v ?QH/ QM iQ QM2 Q7 i?2 2H2K2Mib-
Qp2`r`Bi2 i?i QM2 rBi? Bib KB``Q` BK;2- M/ i?2M Tmi i?2 pHm2 7`QK
i?2 HQ+H p`B#H2 BM i?2 TH+2 r?2`2 i?2 KB``Q` BK;2 mb2/ iQ #2X

 HBbi
"mBH/BM; mT  HBbi Bb #2bi /QM2 #+F iQ 7`QMiX aQ arrayToList +QmH/ Bi2`i2
Qp2` i?2 ``v #+Fr`/ Ub22 T`2pBQmb 2t2`+Bb2V M/- 7Q` 2+? 2H2K2Mi-
// M Q#D2+i iQ i?2 HBbiX uQm +M mb2  HQ+H p`B#H2 iQ ?QH/ i?2 T`i
Q7 i?2 HBbi i?i rb #mBHi bQ 7` M/ mb2  Tii2`M HBF2 list = {value: X,
rest: list} iQ // M 2H2K2MiX
hQ `mM Qp2`  HBbi UBM listToArray M/ nthV-  for HQQT bT2+B}+iBQM HBF2
i?Bb +M #2 mb2/,
for ( var node = list ; node ; node = node . rest ) {}

*M vQm b22 ?Qr i?i rQ`Fb\ 1p2`v Bi2`iBQM Q7 i?2 HQQT- node TQBMib
iQ i?2 +m``2Mi bm#HBbi- M/ i?2 #Q/v +M `2/ Bib value T`QT2`iv iQ ;2i
i?2 +m``2Mi 2H2K2MiX i i?2 2M/ Q7 M Bi2`iBQM- node KQp2b iQ i?2 M2ti
bm#HBbiX q?2M i?i Bb MmHH- r2 ?p2 `2+?2/ i?2 2M/ Q7 i?2 HBbi M/ i?2
HQQT Bb }MBb?2/X

9kd
h?2 `2+m`bBp2 p2`bBQM Q7 nth rBHH- bBKBH`Hv- HQQF i M 2p2` bKHH2` T`i
Q7 i?2 dziBHǴ Q7 i?2 HBbi M/ i i?2 bK2 iBK2 +QmMi /QrM i?2 BM/2t mMiBH
Bi `2+?2b x2`Q- i r?B+? TQBMi Bi +M `2im`M i?2 value T`QT2`iv Q7 i?2
MQ/2 Bi Bb HQQFBM; iX hQ ;2i i?2 x2`Q2i? 2H2K2Mi Q7  HBbi- vQm bBKTHv
iF2 i?2 value T`QT2`iv Q7 Bib ?2/ MQ/2X hQ ;2i 2H2K2Mi L Y R- vQm iF2
i?2 L i? 2H2K2Mi Q7 i?2 HBbi i?iǶb BM i?Bb HBbiǶb rest T`QT2`ivX

.22T +QKT`BbQM
uQm` i2bi 7Q` r?2i?2` vQm `2 /2HBM; rBi?  `2H Q#D2+i rBHH HQQF bQK2@
i?BM; HBF2 typeof x == "object" && x != nullX "2 +`27mH iQ +QKT`2 T`QT@
2`iB2b QMHv r?2M #Qi? `;mK2Mib `2 Q#D2+ibX AM HH Qi?2` +b2b vQm +M
Dmbi BKK2/Bi2Hv `2im`M i?2 `2bmHi Q7 TTHvBM; ===X
lb2  forfin HQQT iQ ;Q Qp2` i?2 T`QT2`iB2bX uQm M22/ iQ i2bi r?2i?2`
#Qi? Q#D2+ib ?p2 i?2 bK2 b2i Q7 T`QT2`iv MK2b M/ r?2i?2` i?Qb2
T`QT2`iB2b ?p2 B/2MiB+H pHm2bX h?2 }`bi i2bi +M #2 /QM2 #v +QmMi@
BM; i?2 T`QT2`iB2b BM #Qi? Q#D2+ib M/ `2im`MBM; 7Hb2 B7 i?2 MmK#2`b Q7
T`QT2`iB2b `2 /Bz2`2MiX A7 i?2vǶ`2 i?2 bK2- i?2M ;Q Qp2` i?2 T`QT2`iB2b
Q7 QM2 Q#D2+i- M/ 7Q` 2+? Q7 i?2K- p2`B7v i?i i?2 Qi?2` Q#D2+i HbQ ?b
i?2 T`QT2`ivX h?2 pHm2b Q7 i?2 T`QT2`iB2b `2 +QKT`2/ #v  `2+m`bBp2
+HH iQ deepEqualX
_2im`MBM; i?2 +Q``2+i pHm2 7`QK i?2 7mM+iBQM Bb #2bi /QM2 #v BKK2/B@
i2Hv `2im`MBM; 7Hb2 r?2M  KBbKi+? Bb MQiB+2/ M/ `2im`MBM; i`m2 i
i?2 2M/ Q7 i?2 7mM+iBQMX

>B;?2`@P`/2` 6mM+iBQMb
JQi?2`@+?BH/ ;2 /Bz2`2M+2
"2+mb2 MQi HH 2H2K2Mib BM i?2 ancestry ``v T`Q/m+2 mb27mH /i Ur2
+MǶi +QKTmi2 i?2 ;2 /Bz2`2M+2 mMH2bb r2 FMQr i?2 #B`i? /i2 Q7 i?2
KQi?2`V- r2 rBHH ?p2 iQ TTHv filter BM bQK2 KMM2` #27Q`2 +HHBM;
averageX uQm +QmH/ /Q Bi b  }`bi Tbb- #v /2}MBM;  hasKnownMother
7mM+iBQM M/ }Hi2`BM; QM i?i }`biX Hi2`MiBp2Hv- vQm +QmH/ bi`i #v
+HHBM; map M/ BM vQm` KTTBM; 7mM+iBQM `2im`M 2Bi?2` i?2 ;2 /Bz2`2M+2
Q` null B7 MQ KQi?2` Bb FMQrMX h?2M- vQm +M +HH filter iQ `2KQp2 i?2

9k3
null 2H2K2Mib #27Q`2 TbbBM; i?2 ``v iQ averageX

>BbiQ`B+H HB72 2tT2+iM+v


h?2 2bb2M+2 Q7 i?Bb 2tKTH2 HB2b BM ;`QmTBM; i?2 2H2K2Mib Q7  +QHH2+iBQM
#v bQK2 bT2+i Q7 i?2B`běbTHBiiBM; i?2 ``v Q7 M+2biQ`b BMiQ bKHH2`
``vb rBi? i?2 M+2biQ`b 7Q` 2+? +2Mim`vX
.m`BM; i?2 ;`QmTBM; T`Q+2bb- F22T M Q#D2+i i?i bbQ+Bi2b +2Mim`v
MK2b UMmK#2`bV rBi? ``vb Q7 2Bi?2` T2`bQM Q#D2+ib Q` ;2bX aBM+2 r2
/Q MQi FMQr BM /pM+2 r?i +i2;Q`B2b r2 rBHH }M/- r2ǶHH ?p2 iQ +`2i2
i?2K QM i?2 ~vX 6Q` 2+? T2`bQM- 7i2` +QKTmiBM; i?2B` +2Mim`v- r2 i2bi
r?2i?2` i?i +2Mim`v rb H`2/v FMQrMX A7 MQi- // M ``v 7Q` BiX
h?2M // i?2 T2`bQM UQ` ;2V iQ i?2 ``v 7Q` i?2 T`QT2` +2Mim`vX
6BMHHv-  forfin HQQT +M #2 mb2/ iQ T`BMi i?2 p2`;2 ;2b 7Q` i?2
BM/BpB/mH +2Mim`B2bX

1p2`v M/ i?2M bQK2


h?2 7mM+iBQMb +M 7QHHQr  bBKBH` Tii2`M iQ i?2 /2}MBiBQM Q7 forEach
i i?2 bi`i Q7 i?2 +?Ti2`- 2t+2Ti i?i i?2v Kmbi `2im`M BKK2/Bi2Hv
UrBi? i?2 `B;?i pHm2V r?2M i?2 T`2/B+i2 7mM+iBQM `2im`Mb 7Hb2ěQ` i`m2X
.QMǶi 7Q`;2i iQ Tmi MQi?2` return bii2K2Mi 7i2` i?2 HQQT bQ i?i i?2
7mM+iBQM HbQ `2im`Mb i?2 +Q``2+i pHm2 r?2M Bi `2+?2b i?2 2M/ Q7 i?2
``vX

h?2 a2+`2i GB72 Q7 P#D2+ib


 p2+iQ` ivT2
uQm` bQHmiBQM +M 7QHHQr i?2 Tii2`M Q7 i?2 Rabbit +QMbi`m+iQ` 7`QK i?Bb
+?Ti2` [mBi2 +HQb2HvX
//BM;  ;2ii2` T`QT2`iv iQ i?2 +QMbi`m+iQ` +M #2 /QM2 rBi? i?2 Object
.defineProperty 7mM+iBQMX hQ +QKTmi2 i?2 /BbiM+2 7`QK Uy- yV iQ Ut- vV-
vQm +M mb2 i?2 Svi?;Q`2M i?2Q`2K- r?B+? bvb i?i i?2 b[m`2 Q7 i?2
/BbiM+2 r2 `2 HQQFBM; 7Q` Bb 2[mH iQ i?2 !b[m`2 Q7 i?2 t@+QQ`/BMi2
THmb i?2 b[m`2 Q7 i?2 v@+QQ`/BMi2X h?mb- x2 + y 2 Bb i?2 MmK#2` vQm
rMi- M/ Math.sqrt Bb i?2 rv vQm +QKTmi2  b[m`2 `QQi BM Cpa+`BTiX

9kN
MQi?2` +2HH
uQmǶHH ?p2 iQ biQ`2 HH i?`22 +QMbi`m+iQ` `;mK2Mib BM i?2 BMbiM+2 Q#@
D2+iX h?2 minWidth M/ minHeight K2i?Q/b b?QmH/ +HH i?`Qm;? iQ i?2
+Q``2bTQM/BM; K2i?Q/b BM i?2 inner +2HH #mi 2Mbm`2 i?i MQ MmK#2` H2bb
i?M i?2 ;Bp2M bBx2 Bb `2im`M2/ UTQbbB#Hv mbBM; Math.maxVX
.QMǶi 7Q`;2i iQ //  draw K2i?Q/ i?i bBKTHv 7Q`r`/b i?2 +HH iQ i?2
BMM2` +2HHX

a2[m2M+2 BMi2`7+2
PM2 rv iQ bQHp2 i?Bb Bb iQ ;Bp2 i?2 b2[m2M+2 Q#D2+ib bii2- K2MBM; i?2B`
T`QT2`iB2b `2 +?M;2/ BM i?2 T`Q+2bb Q7 mbBM; i?2KX uQm +QmH/ biQ`2 
+QmMi2` i?i BM/B+i2b ?Qr 7` i?2 b2[m2M+2 Q#D2+i ?b /pM+2/X
uQm` BMi2`7+2 rBHH M22/ iQ 2tTQb2 i H2bi  rv iQ ;2i i?2 M2ti 2H2K2Mi
M/ iQ }M/ Qmi r?2i?2` i?2 Bi2`iBQM ?b `2+?2/ i?2 2M/ Q7 i?2 b2[m2M+2
v2iX Ai Bb i2KTiBM; iQ `QHH i?2b2 BMiQ QM2 K2i?Q/- next- r?B+? `2im`Mb null
Q` undefined r?2M i?2 b2[m2M+2 Bb i Bib 2M/X "mi MQr vQm ?p2  T`Q#H2K
r?2M  b2[m2M+2 +imHHv +QMiBMb nullX aQ  b2T`i2 K2i?Q/ UQ` ;2ii2`
T`QT2`ivV iQ }M/ Qmi r?2i?2` i?2 2M/ ?b #22M `2+?2/ Bb T`Q##Hv
T`272`#H2X
MQi?2` bQHmiBQM Bb iQ pQB/ +?M;BM; bii2 BM i?2 Q#D2+iX uQm +M
2tTQb2  K2i?Q/ 7Q` ;2iiBM; i?2 +m``2Mi 2H2K2Mi UrBi?Qmi /pM+BM;
Mv +QmMi2`V M/ MQi?2` 7Q` ;2iiBM;  M2r b2[m2M+2 i?i `2T`2b2Mib i?2
`2KBMBM; 2H2K2Mib 7i2` i?2 +m``2Mi QM2 UQ`  bT2+BH pHm2 B7 i?2 2M/
Q7 i?2 b2[m2M+2 Bb `2+?2/VX h?Bb Bb [mBi2 2H2;Miě b2[m2M+2 pHm2 rBHH
dzbiv Bib2H7Ǵ 2p2M 7i2` Bi Bb mb2/ M/ +M i?mb #2 b?`2/ rBi? Qi?2` +Q/2
rBi?Qmi rQ``vBM; #Qmi r?i KB;?i ?TT2M iQ BiX Ai Bb- mM7Q`imMi2Hv-
HbQ bQK2r?i BM2{+B2Mi BM  HM;m;2 HBF2 Cpa+`BTi #2+mb2 Bi BMpQHp2b
+`2iBM;  HQi Q7 Q#D2+ib /m`BM; Bi2`iBQMX

S`QD2+i, 1H2+i`QMB+ GB72


`iB}+BH bimTB/Biv
h?2 ;`22/BM2bb T`Q#H2K +M #2 ii+F2/ BM b2p2`H rvbX h?2 +`Bii2`b
+QmH/ biQT 2iBM; r?2M i?2v `2+?  +2`iBM 2M2`;v H2p2HX P` i?2v +QmH/

9jy
2i QMHv 2p2`v L im`Mb U#v F22TBM;  +QmMi2` Q7 i?2 im`Mb bBM+2 i?2B`
Hbi K2H BM  T`QT2`iv QM i?2 +`2im`2 Q#D2+iVX P`- iQ KF2 bm`2 THMib
M2p2` ;Q 2MiB`2Hv 2tiBM+i- i?2 MBKHb +QmH/ `27mb2 iQ 2i  THMi mMH2bb
i?2v b22 i H2bi QM2 Qi?2` THMi M2`#v UmbBM; i?2 findAll K2i?Q/ QM
i?2 pB2rVX  +QK#BMiBQM Q7 i?2b2- Q` bQK2 2MiB`2Hv /Bz2`2Mi bi`i2;v-
KB;?i HbQ rQ`FX
JFBM; i?2 +`Bii2`b KQp2 KQ`2 2z2+iBp2Hv +QmH/ #2 /QM2 #v bi2HBM; QM2
Q7 i?2 KQp2K2Mi bi`i2;B2b 7`QK i?2 +`Bii2`b BM Qm` QH/- 2M2`;vH2bb rQ`H/X
"Qi? i?2 #QmM+BM; #2?pBQ` M/ i?2 rHH@7QHHQrBM; #2?pBQ` b?Qr2/ 
Km+? rB/2` `M;2 Q7 KQp2K2Mi i?M +QKTH2i2Hv `M/QK bi;;2`BM;X
JFBM; +`2im`2b #`22/ KQ`2 bHQrHv Bb i`BpBHX Cmbi BM+`2b2 i?2 KBM@
BKmK 2M2`;v H2p2H i r?B+? i?2v `2T`Q/m+2X P7 +Qm`b2- KFBM; i?2
2+Qbvbi2K KQ`2 bi#H2 HbQ KF2b Bi KQ`2 #Q`BM;X A7 vQm ?p2  ?M/7mH
Q7 7i- BKKQ#BH2 +`Bii2`b 7Q`2p2` KmM+?BM; QM  b2 Q7 THMib M/ M2p2`
`2T`Q/m+BM;- i?i KF2b 7Q`  p2`v bi#H2 2+Qbvbi2KX "mi MQ QM2 rMib
iQ ri+? i?iX

S`2/iQ`b
JMv Q7 i?2 bK2 i`B+Fb i?i rQ`F2/ 7Q` i?2 T`2pBQmb 2t2`+Bb2 HbQ T@
THv ?2`2X JFBM; i?2 T`2/iQ`b #B; UHQib Q7 2M2`;vV M/ ?pBM; i?2K
`2T`Q/m+2 bHQrHv Bb `2+QKK2M/2/X h?iǶHH KF2 i?2K H2bb pmHM2`#H2 iQ
T2`BQ/b Q7 bi`piBQM r?2M i?2 ?2`#BpQ`2b `2 b+`+2X
"2vQM/ bivBM; HBp2- F22TBM; Bib 7QQ/ biQ+F HBp2 Bb  T`2/iQ`Ƕb KBM
Q#D2+iBp2X 6BM/ bQK2 rv iQ KF2 T`2/iQ`b ?mMi KQ`2 ;;`2bbBp2Hv
r?2M i?2`2 `2  HQi Q7 ?2`#BpQ`2b M/ ?mMi KQ`2 bHQrHv UQ` MQi i HHV
r?2M T`2v Bb ``2X aBM+2 THMi 2i2`b KQp2 `QmM/- i?2 bBKTH2 i`B+F
Q7 2iBM; QM2 QMHv r?2M Qi?2`b `2 M2`#v Bb mMHBF2Hv iQ rQ`Fěi?iǶHH
?TT2M bQ ``2Hv i?i vQm` T`2/iQ` rBHH bi`p2X "mi vQm +QmH/ F22T
i`+F Q7 Q#b2`piBQMb BM T`2pBQmb im`Mb- BM bQK2 /i bi`m+im`2 F2Ti QM
i?2 T`2/iQ` Q#D2+ib- M/ ?p2 Bi #b2 Bib #2?pBQ` QM r?i Bi ?b b22M
`2+2MiHvX

9jR
"m;b M/ 1``Q` >M/HBM;
_2i`v
h?2 +HH iQ primitiveMultiply b?QmH/ Q#pBQmbHv ?TT2M BM  try #HQ+FX h?2
+Q``2bTQM/BM; catch #HQ+F b?QmH/ `2i?`Qr i?2 2t+2TiBQM r?2M Bi Bb MQi
M BMbiM+2 Q7 MultiplicatorUnitFailure M/ 2Mbm`2 i?2 +HH Bb `2i`B2/ r?2M
Bi BbX
hQ /Q i?2 `2i`vBM;- vQm +M 2Bi?2` mb2  HQQT i?i #`2Fb QMHv r?2M
 +HH bm++22/běb BM i?2 look 2tKTH2 2`HB2` BM i?Bb +?Ti2`ěQ` mb2
`2+m`bBQM M/ ?QT2 vQm /QMǶi ;2i  bi`BM; Q7 7BHm`2b bQ HQM; i?i Bi
Qp2`~Qrb i?2 bi+F Ur?B+? Bb  T`2iiv b72 #2iVX

h?2 HQ+F2/ #Qt


h?Bb 2t2`+Bb2 +HHb 7Q`  finally #HQ+F- b vQm T`Q##Hv ;m2bb2/X uQm`
7mM+iBQM b?QmH/ }`bi mMHQ+F i?2 #Qt M/ i?2M +HH i?2 `;mK2Mi 7mM+iBQM
7`QK BMbB/2  try #Q/vX h?2 finally #HQ+F 7i2` Bi b?QmH/ HQ+F i?2 #Qt
;BMX
hQ KF2 bm`2 r2 /QMǶi HQ+F i?2 #Qt r?2M Bi rbMǶi H`2/v HQ+F2/-
+?2+F Bib HQ+F i i?2 bi`i Q7 i?2 7mM+iBQM M/ mMHQ+F M/ HQ+F Bi QMHv
r?2M Bi bi`i2/ Qmi HQ+F2/X

_2;mH` 1tT`2bbBQMb
ZmQiBM; bivH2
h?2 KQbi Q#pBQmb bQHmiBQM Bb iQ QMHv `2TH+2 [mQi2b rBi?  MQMrQ`/
+?`+i2` QM i H2bi QM2 bB/2X aQK2i?BM; HBF2 /\W | \W/X "mi vQm HbQ
?p2 iQ iF2 i?2 bi`i M/ 2M/ Q7 i?2 HBM2 BMiQ ++QmMiX
AM //BiBQM- vQm Kmbi 2Mbm`2 i?i i?2 `2TH+2K2Mi HbQ BM+Hm/2b i?2
+?`+i2`b i?i r2`2 Ki+?2/ #v i?2 \W Tii2`M bQ i?i i?Qb2 `2 MQi
/`QTT2/X h?Bb +M #2 /QM2 #v r`TTBM; i?2K BM T`2Mi?2b2b M/ BM@
+Hm/BM; i?2B` ;`QmTb BM i?2 `2TH+2K2Mi bi`BM; U$1- $2VX :`QmTb i?i `2
MQi Ki+?2/ rBHH #2 `2TH+2/ #v MQi?BM;X

9jk
LmK#2`b ;BM
6B`bi- /Q MQi 7Q`;2i i?2 #+FbHb? BM 7`QMi Q7 i?2 /QiX
Ji+?BM; i?2 QTiBQMH bB;M BM 7`QMi Q7 i?2 MmK#2`- b r2HH b BM 7`QMi
Q7 i?2 2tTQM2Mi- +M #2 /QM2 rBi? [+\-]? Q` (\+|-|) UTHmb- KBMmb- Q`
MQi?BM;VX
h?2 KQ`2 +QKTHB+i2/ T`i Q7 i?2 2t2`+Bb2 Bb i?2 T`Q#H2K Q7 Ki+?BM;
#Qi? "5." M/ ".5" rBi?Qmi HbQ Ki+?BM; "."X 6Q` i?Bb-  ;QQ/ bQHmiBQM Bb
iQ mb2 i?2 | QT2`iQ` iQ b2T`i2 i?2 irQ +b2bě2Bi?2` QM2 Q` KQ`2 /B;Bib
QTiBQMHHv 7QHHQr2/ #v  /Qi M/ x2`Q Q` KQ`2 /B;Bib Q`  /Qi 7QHHQr2/
#v QM2 Q` KQ`2 /B;BibX
6BMHHv- iQ KF2 i?2 2 +b2@BMb2MbBiBp2- 2Bi?2` // M i QTiBQM iQ i?2
`2;mH` 2tT`2bbBQM Q` mb2 [eE]X

JQ/mH2b
JQMi? MK2b
h?Bb 7QHHQrb i?2 weekDay KQ/mH2 HKQbi 2t+iHvX  7mM+iBQM 2tT`2bbBQM-
+HH2/ BKK2/Bi2Hv- r`Tb i?2 p`B#H2 i?i ?QH/b i?2 ``v Q7 MK2b-
HQM; rBi? i?2 irQ 7mM+iBQMb i?i Kmbi #2 2tTQ`i2/X h?2 7mM+iBQMb `2
Tmi BM M Q#D2+i M/ `2im`M2/X h?2 `2im`M2/ BMi2`7+2 Q#D2+i Bb biQ`2/
BM i?2 month p`B#H2X

 `2im`M iQ 2H2+i`QMB+ HB72


>2`2 Bb r?i A +K2 mT rBi?X AǶp2 Tmi T`2Mi?2b2b `QmM/ BMi2`MH 7mM+@
iBQMbX
Module " grid "
Vector
Grid
directions
directionNames

Module " world "


( randomElement )
( elementFromChar )
( charFromElement )

9jj
View
World
LifelikeWorld
directions [ reexported ]

Module " simple_ecosystem "


( randomElement ) [ duplicated ]
( dirPlus )
Wall
BouncingCritter
WallFollower

Module " ecosystem "


Wall [ duplicated ]
Plant
PlantEater
SmartPlantEater
Tiger

A ?p2 `22tTQ`i2/ i?2 directions ``v 7`QK i?2 grid KQ/mH2 7`QK world
bQ i?i KQ/mH2b #mBHi QM i?i Ui?2 2+Qbvbi2KbV /QMǶi ?p2 iQ FMQr Q`
rQ``v #Qmi i?2 2tBbi2M+2 Q7 i?2 grid KQ/mH2X
A HbQ /mTHB+i2/ irQ ;2M2`B+ M/ iBMv ?2HT2` pHm2b UrandomElement M/
WallV bBM+2 i?2v `2 mb2/ b BMi2`MH /2iBHb BM /Bz2`2Mi +QMi2tib M/ /Q
MQi #2HQM; BM i?2 BMi2`7+2b 7Q` i?2b2 KQ/mH2bX

*B`+mH` /2T2M/2M+B2b
h?2 i`B+F Bb iQ // i?2 exports Q#D2+i +`2i2/ 7Q`  KQ/mH2 iQ requireǶb
++?2 #27Q`2 +imHHv `mMMBM; i?2 KQ/mH2X h?Bb K2Mb i?2 KQ/mH2 rBHH
MQi v2i ?p2 ?/  +?M+2 iQ Qp2``B/2 module.exports- bQ r2 /Q MQi FMQr
r?2i?2` Bi Kv rMi iQ 2tTQ`i bQK2 Qi?2` pHm2X 7i2` HQ/BM;- i?2
++?2 Q#D2+i Bb Qp2``B//2M rBi? module.exports- r?B+? Kv #2  /Bz2`2Mi
pHm2X
"mi B7 BM i?2 +Qm`b2 Q7 HQ/BM; i?2 KQ/mH2-  b2+QM/ KQ/mH2 Bb HQ/2/
i?i bFb 7Q` i?2 }`bi KQ/mH2- Bib /27mHi exports Q#D2+i- r?B+? Bb HBF2Hv
biBHH 2KTiv i i?Bb TQBMi- rBHH #2 BM i?2 ++?2- M/ i?2 b2+QM/ KQ/mH2
rBHH `2+2Bp2  `272`2M+2 iQ BiX A7 Bi /Q2bMǶi i`v iQ /Q Mvi?BM; rBi? i?2
Q#D2+i mMiBH i?2 }`bi KQ/mH2 ?b }MBb?2/ HQ/BM;- i?BM;b rBHH rQ`FX

9j9
S`QD2+i,  S`Q;`KKBM; GM;m;2
``vb
h?2 2bB2bi rv iQ /Q i?Bb Bb iQ `2T`2b2Mi 1;; ``vb rBi? Cpa+`BTi
``vbX
h?2 pHm2b //2/ iQ i?2 iQT 2MpB`QMK2Mi Kmbi #2 7mM+iBQMbX Array.
prototype.slice +M #2 mb2/ iQ +QMp2`i M arguments ``v@HBF2 Q#D2+i BMiQ
 `2;mH` ``vX

*HQbm`2
;BM- r2 `2 `B/BM; HQM; QM  Cpa+`BTi K2+?MBbK iQ ;2i i?2 2[mBp@
H2Mi 72im`2 BM 1;;X aT2+BH 7Q`Kb `2 Tbb2/ i?2 HQ+H 2MpB`QMK2Mi BM
r?B+? i?2v `2 2pHmi2/ bQ i?i i?2v +M 2pHmi2 i?2B` bm#7Q`Kb BM i?i
2MpB`QMK2MiX h?2 7mM+iBQM `2im`M2/ #v fun +HQb2b Qp2` i?2 env `;mK2Mi
;Bp2M iQ Bib 2M+HQbBM; 7mM+iBQM M/ mb2b i?i iQ +`2i2 i?2 7mM+iBQMǶb HQ+H
2MpB`QMK2Mi r?2M Bi Bb +HH2/X
h?Bb K2Mb i?i i?2 T`QiQivT2 Q7 i?2 HQ+H 2MpB`QMK2Mi rBHH #2 i?2
2MpB`QMK2Mi BM r?B+? i?2 7mM+iBQM rb +`2i2/- r?B+? KF2b Bi TQbbB#H2
iQ ++2bb p`B#H2b BM i?i 2MpB`QMK2Mi 7`QK i?2 7mM+iBQMX h?Bb Bb HH
i?2`2 Bb iQ BKTH2K2MiBM; +HQbm`2 Ui?Qm;? iQ +QKTBH2 Bi BM  rv i?i Bb
+imHHv 2{+B2Mi- vQmǶ/ M22/ iQ /Q bQK2 KQ`2 rQ`FVX

*QKK2Mib
JF2 bm`2 vQm` bQHmiBQM ?M/H2b KmHiBTH2 +QKK2Mib BM  `Qr- rBi? TQ@
i2MiBHHv r?Bi2bT+2 #2ir22M Q` 7i2` i?2KX
 `2;mH` 2tT`2bbBQM Bb T`Q##Hv i?2 2bB2bi rv iQ bQHp2 i?BbX q`Bi2
bQK2i?BM; i?i Ki+?2b dzr?Bi2bT+2 Q`  +QKK2Mi- x2`Q Q` KQ`2 iBK2bǴX
lb2 i?2 exec Q` match K2i?Q/ M/ HQQF i i?2 H2M;i? Q7 i?2 }`bi 2H2K2Mi
BM i?2 `2im`M2/ ``v Ui?2 r?QH2 Ki+?V iQ }M/ Qmi ?Qr KMv +?`+i2`b
iQ bHB+2 QzX

9j8
6BtBM; b+QT2
uQm rBHH ?p2 iQ HQQT i?`Qm;? QM2 b+QT2 i  iBK2- mbBM; Object.getPrototypeOf
iQ ;Q i?2 M2ti Qmi2` b+QT2X 6Q` 2+? b+QT2- mb2 hasOwnProperty iQ }M/ Qmi
r?2i?2` i?2 p`B#H2- BM/B+i2/ #v i?2 name T`QT2`iv Q7 i?2 }`bi `;mK2Mi
iQ set- 2tBbib BM i?i b+QT2X A7 Bi /Q2b- b2i Bi iQ i?2 `2bmHi Q7 2pHmiBM;
i?2 b2+QM/ `;mK2Mi iQ set M/ i?2M `2im`M i?i pHm2X
A7 i?2 Qmi2`KQbi b+QT2 Bb `2+?2/ UObject.getPrototypeOf `2im`Mb MmHHV
M/ r2 ?p2MǶi 7QmM/ i?2 p`B#H2 v2i- Bi /Q2bMǶi 2tBbi- M/ M 2``Q`
b?QmH/ #2 i?`QrMX

h?2 .Q+mK2Mi P#D2+i JQ/2H


"mBH/  i#H2
lb2 document.createElement iQ +`2i2 M2r 2H2K2Mi MQ/2b- document.createTextNode
iQ +`2i2 i2ti MQ/2b- M/ i?2 appendChild K2i?Q/ iQ Tmi MQ/2b BMiQ Qi?2`
MQ/2bX
uQm b?QmH/ HQQT Qp2` i?2 F2v MK2b QM+2 iQ }HH BM i?2 iQT `Qr M/
i?2M ;BM 7Q` 2+? Q#D2+i BM i?2 ``v iQ +QMbi`m+i i?2 /i `QrbX
.QMǶi 7Q`;2i iQ `2im`M i?2 2M+HQbBM; <table> 2H2K2Mi i i?2 2M/ Q7 i?2
7mM+iBQMX

1H2K2Mib #v i; MK2


h?2 bQHmiBQM Bb KQbi 2bBHv 2tT`2bb2/ rBi?  `2+m`bBp2 7mM+iBQM- bBKBH`
iQ i?2 talksAbout 7mM+iBQM /2}M2/ 2`HB2` BM i?Bb +?Ti2`X
uQm +QmH/ +HH byTagname Bib2H7 `2+m`bBp2Hv- +QM+i2MiBM; i?2 `2bmHiBM;
``vb iQ T`Q/m+2 i?2 QmiTmiX 6Q`  KQ`2 2{+B2Mi TT`Q+?- /2}M2 M
BMM2` 7mM+iBQM i?i +HHb Bib2H7 `2+m`bBp2Hv M/ i?i ?b ++2bb iQ M ``v
p`B#H2 /2}M2/ BM i?2 Qmi2` 7mM+iBQM iQ r?B+? Bi +M // i?2 Ki+?BM;
2H2K2Mib Bi }M/bX .QMǶi 7Q`;2i iQ +HH i?2 BMM2` 7mM+iBQM QM+2 7`QK i?2
Qmi2` 7mM+iBQMX
h?2 `2+m`bBp2 7mM+iBQM Kmbi +?2+F i?2 MQ/2 ivT2X >2`2 r2 `2 BMi2`@
2bi2/ QMHv BM MQ/2 ivT2 R Udocument.ELEMENT_NODEVX 6Q` bm+? MQ/2b- r2
Kmbi HQQT Qp2` i?2B` +?BH/`2M M/- 7Q` 2+? +?BH/- b22 r?2i?2` i?2 +?BH/

9je
Ki+?2b i?2 [m2`v r?BH2 HbQ /QBM;  `2+m`bBp2 +HH QM Bi iQ BMbT2+i Bib
QrM +?BH/`2MX

>M/HBM; 1p2Mib
*2MbQ`2/ F2v#Q`/
h?2 bQHmiBQM iQ i?Bb 2t2`+Bb2 BMpQHp2b T`2p2MiBM; i?2 /27mHi #2?pBQ` Q7
F2v 2p2MibX uQm +M ?M/H2 2Bi?2` "keypress" Q` "keydown"X A7 2Bi?2` Q7
i?2K ?b preventDefault +HH2/ QM Bi- i?2 H2ii2` rBHH MQi TT2`X
A/2MiB7vBM; i?2 H2ii2` ivT2/ `2[mB`2b HQQFBM; i i?2 keyCode Q` charCode
T`QT2`iv M/ +QKT`BM; i?i rBi? i?2 +Q/2b 7Q` i?2 H2ii2`b vQm rMi
iQ }Hi2`X AM "keydown"- vQm /Q MQi ?p2 iQ rQ``v #Qmi HQr2`+b2 M/
mTT2`+b2 H2ii2`b- bBM+2 Bi B/2MiB}2b QMHv i?2 F2v T`2bb2/X A7 vQm /2+B/2
iQ ?M/H2 "keypress" BMbi2/- r?B+? B/2MiB}2b i?2 +imH +?`+i2` ivT2/-
vQm ?p2 iQ KF2 bm`2 vQm i2bi 7Q` #Qi? +b2bX PM2 rv iQ /Q i?i rQmH/
#2 i?Bb,
/[ qwx ]/ i . test ( String . fromCharCode ( event . charCode ) )

JQmb2 i`BH
*`2iBM; i?2 2H2K2Mib Bb #2bi /QM2 BM  HQQTX TT2M/ i?2K iQ i?2
/Q+mK2Mi iQ KF2 i?2K b?Qr mTX hQ #2 #H2 iQ ++2bb i?2K Hi2` iQ
+?M;2 i?2B` TQbBiBQM- biQ`2 i?2 i`BH 2H2K2Mib BM M ``vX
*v+HBM; i?`Qm;? i?2K +M #2 /QM2 #v F22TBM;  +QmMi2` p`B#H2 M/
//BM; R iQ Bi 2p2`v iBK2 i?2 "mousemove" 2p2Mi }`2bX h?2 `2KBM/2`
QT2`iQ` U% 10V +M i?2M #2 mb2/ iQ ;2i  pHB/ ``v BM/2t iQ TB+F i?2
2H2K2Mi vQm rMi iQ TQbBiBQM /m`BM;  ;Bp2M 2p2MiX
MQi?2` BMi2`2biBM; 2z2+i +M #2 +?B2p2/ #v KQ/2HBM;  bBKTH2 T?vbB+b
bvbi2KX lb2 i?2 "mousemove" 2p2Mi QMHv iQ mT/i2  TB` Q7 p`B#H2b i?i
i`+F i?2 KQmb2 TQbBiBQMX h?2M mb2 requestAnimationFrame iQ bBKmHi2 i?2
i`BHBM; 2H2K2Mib #2BM; ii`+i2/ iQ i?2 TQbBiBQM Q7 i?2 KQmb2 TQBMi2`X
i 2p2`v MBKiBQM bi2T- mT/i2 i?2B` TQbBiBQM #b2/ QM i?2B` TQbBiBQM
`2HiBp2 iQ i?2 TQBMi2` UM/- QTiBQMHHv-  bT22/ i?i Bb biQ`2/ 7Q` 2+?
2H2K2MiVX 6B;m`BM; Qmi  ;QQ/ rv iQ /Q i?Bb Bb mT iQ vQmX

9jd
h#b
PM2 TBi7HH vQmǶHH T`Q##Hv `mM BMiQ Bb i?i vQm +MǶi /B`2+iHv mb2 i?2
MQ/2Ƕb childNodes T`QT2`iv b  +QHH2+iBQM Q7 i# MQ/2bX 6Q` QM2 i?BM;-
r?2M vQm // i?2 #miiQMb- i?2v rBHH HbQ #2+QK2 +?BH/ MQ/2b M/ 2M/
mT BM i?Bb Q#D2+i #2+mb2 Bi Bb HBp2X 6Q` MQi?2`- i?2 i2ti MQ/2b +`2i2/
7Q` i?2 r?Bi2bT+2 #2ir22M i?2 MQ/2b `2 HbQ BM i?2`2 M/ b?QmH/ MQi
;2i i?2B` QrM i#bX
hQ rQ`F `QmM/ i?Bb- bi`i #v #mBH/BM; mT  `2H ``v Q7 HH i?2 +?BH/`2M
BM i?2 r`TT2` i?i ?p2  nodeType Q7 RX
q?2M `2;Bbi2`BM; 2p2Mi ?M/H2`b QM i?2 #miiQMb- i?2 ?M/H2` 7mM+iBQMb
rBHH M22/ iQ FMQr r?B+? i# 2H2K2Mi Bb bbQ+Bi2/ rBi? i?2 #miiQMX A7
i?2v `2 +`2i2/ BM  MQ`KH HQQT- vQm +M ++2bb i?2 HQQT BM/2t p`B@
#H2 7`QK BMbB/2 i?2 7mM+iBQM- #mi Bi rQMǶi ;Bp2 vQm i?2 +Q``2+i MmK#2`
#2+mb2 i?i p`B#H2 rBHH ?p2 #22M 7m`i?2` +?M;2/ #v i?2 HQQTX
 bBKTH2 rQ`F`QmM/ Bb iQ mb2 i?2 forEach K2i?Q/ M/ +`2i2 i?2 ?M@
/H2` 7mM+iBQMb 7`QK BMbB/2 i?2 7mM+iBQM Tbb2/ iQ forEachX h?2 HQQT BM/2t-
r?B+? Bb Tbb2/ b  b2+QM/ `;mK2Mi iQ i?i 7mM+iBQM- rBHH #2  MQ`KH
HQ+H p`B#H2 i?2`2 M/ rQMǶi #2 Qp2`r`Bii2M #v 7m`i?2` Bi2`iBQMbX

S`QD2+i,  SHi7Q`K :K2


:K2 Qp2`
h?2 KQbi Q#pBQmb bQHmiBQM rQmH/ #2 iQ KF2 lives  p`B#H2 i?i HBp2b
BM runGame M/ Bb i?mb pBbB#H2 iQ i?2 startLevel +HQbm`2X
MQi?2` TT`Q+?- r?B+? }ib MB+2Hv rBi? i?2 bTB`Bi Q7 i?2 `2bi Q7 i?2
7mM+iBQM- rQmH/ #2 iQ //  b2+QM/ T`K2i2` iQ startLevel i?i ;Bp2b
i?2 MmK#2` Q7 HBp2bX q?2M i?2 r?QH2 bii2 Q7  bvbi2K Bb biQ`2/ BM i?2
`;mK2Mib iQ  7mM+iBQM- +HHBM; i?i 7mM+iBQM T`QpB/2b M 2H2;Mi rv
iQ i`MbBiBQM iQ  M2r bii2X
AM Mv +b2- r?2M  H2p2H Bb HQbi- i?2`2 b?QmH/ MQr #2 irQ TQbbB#H2 bii2
i`MbBiBQMbX A7 i?i rb i?2 Hbi HB72- r2 ;Q #+F iQ H2p2H x2`Q rBi? i?2
bi`iBM; KQmMi Q7 HBp2bX A7 MQi- r2 `2T2i i?2 +m``2Mi H2p2H rBi? QM2 H2bb
HB72 `2KBMBM;X

9j3
SmbBM; i?2 ;K2
M MBKiBQM +M #2 BMi2``mTi2/ #v `2im`MBM; false 7`QK i?2 7mM+iBQM
;Bp2M iQ runAnimationX Ai +M #2 +QMiBMm2/ #v +HHBM; runAnimation ;BMX
hQ +QKKmMB+i2 i?i i?2 MBKiBQM b?QmH/ #2 BMi2``mTi2/ iQ i?2 7mM+@
iBQM Tbb2/ iQ runAnimation bQ i?i Bi +M `2im`M false- vQm +M mb2 
p`B#H2 i?i #Qi? i?2 2p2Mi ?M/H2` M/ i?i 7mM+iBQM ?p2 ++2bb iQX
q?2M }M/BM;  rv iQ mM`2;Bbi2` i?2 ?M/H2`b `2;Bbi2`2/ #v trackKeys
- `2K2K#2` i?i i?2 2t+i bK2 7mM+iBQM pHm2 i?i rb Tbb2/ iQ
addEventListener Kmbi #2 Tbb2/ iQ removeEventListener iQ bm++2bb7mHHv `2@
KQp2  ?M/H2`X h?mb- i?2 handler 7mM+iBQM pHm2 +`2i2/ BM trackKeys
Kmbi #2 pBH#H2 iQ i?2 +Q/2 i?i mM`2;Bbi2`b i?2 ?M/H2`bX
uQm +M //  T`QT2`iv iQ i?2 Q#D2+i `2im`M2/ #v trackKeys- +QMiBMBM;
2Bi?2` i?i 7mM+iBQM pHm2 Q`  K2i?Q/ i?i ?M/H2b i?2 mM`2;Bbi2`BM;
/B`2+iHvX

.`rBM; QM *Mpb
a?T2b
h?2 i`T2xQB/ URV Bb 2bv iQ /`r mbBM;  Ti?X SB+F bmBi#H2 +2Mi2`
+QQ`/BMi2b M/ // 2+? Q7 i?2 7Qm` +Q`M2`b `QmM/ i?iX
h?2 /BKQM/ UkV +M #2 /`rM i?2 2bv rv- rBi?  Ti?- Q` i?2 BMi2`@
2biBM; rv- rBi?  rotate i`Mb7Q`KiBQMX hQ mb2 `QiiBQM- vQm rBHH ?p2
iQ TTHv  i`B+F bBKBH` iQ r?i r2 /B/ BM i?2 flipHorizontally 7mM+iBQMX
"2+mb2 vQm rMi iQ `Qii2 `QmM/ i?2 +2Mi2` Q7 vQm` `2+iM;H2 M/ MQi
`QmM/ i?2 TQBMi Uy-yV- vQm Kmbi }`bi translate iQ i?2`2- i?2M `Qii2- M/
i?2M i`MbHi2 #+FX
6Q` i?2 xB;x; UjV Bi #2+QK2b BKT`+iB+H iQ r`Bi2  M2r +HH iQ lineTo
7Q` 2+? HBM2 b2;K2MiX AMbi2/- vQm b?QmH/ mb2  HQQTX uQm +M ?p2
2+? Bi2`iBQM /`r 2Bi?2` irQ HBM2 b2;K2Mib U`B;?i M/ i?2M H27i ;BMV
Q` QM2- BM r?B+? +b2 vQm Kmbi mb2 i?2 2p2MM2bb U% 2V Q7 i?2 HQQT BM/2t
iQ /2i2`KBM2 r?2i?2` iQ ;Q H27i Q` `B;?iX
uQmǶHH HbQ M22/  HQQT 7Q` i?2 bTB`H U9VX A7 vQm /`r  b2`B2b Q7 TQBMib-
rBi? 2+? TQBMi KQpBM; 7m`i?2` HQM;  +B`+H2 `QmM/ i?2 bTB`HǶb +2Mi2`-
vQm ;2i  +B`+H2X A7- /m`BM; i?2 HQQT- vQm p`v i?2 `/Bmb Q7 i?2 +B`+H2 QM
r?B+? vQm `2 TmiiBM; i?2 +m``2Mi TQBMi M/ ;Q `QmM/ KQ`2 i?M QM+2-

9jN
i?2 `2bmHi Bb  bTB`HX
h?2 bi` U8V /2TB+i2/ Bb #mBHi Qmi Q7 quadraticCurveTo HBM2bX uQm +QmH/
HbQ /`r QM2 rBi? bi`B;?i HBM2bX .BpB/2  +B`+H2 BMiQ 2B;?i TB2+2b- Q`
 TB2+2 7Q` 2+? TQBMi vQm rMi vQm` bi` iQ ?p2X .`r HBM2b #2ir22M
i?2b2 TQBMib- KFBM; i?2K +m`p2 iQr`/ i?2 +2Mi2` Q7 i?2 bi`X qBi?
quadraticCurveTo- vQm +M mb2 i?2 +2Mi2` b i?2 +QMi`QH TQBMiX

h?2 TB2 +?`i


uQm rBHH M22/ iQ +HH fillText M/ b2i i?2 +QMi2tiǶb textAlign M/ textBaseline
T`QT2`iB2b BM bm+?  rv i?i i?2 i2ti 2M/b mT r?2`2 vQm rMi BiX
 b2MbB#H2 rv iQ TQbBiBQM i?2 H#2Hb rQmH/ #2 iQ Tmi i?2 i2ti QM i?2
HBM2 ;QBM; 7`QK i?2 +2Mi2` Q7 i?2 TB2 i?`Qm;? i?2 KB//H2 Q7 i?2 bHB+2X uQm
/QMǶi rMi iQ Tmi i?2 i2ti /B`2+iHv ;BMbi i?2 bB/2 Q7 i?2 TB2 #mi `i?2`
KQp2 i?2 i2ti Qmi iQ i?2 bB/2 Q7 i?2 TB2 #v  ;Bp2M MmK#2` Q7 TBt2HbX
h?2 M;H2 Q7 i?Bb HBM2 Bb currentAngle + 0.5 * sliceAngleX h?2 7QHHQrBM;
+Q/2 }M/b  TQbBiBQM QM i?Bb HBM2- Rky TBt2Hb 7`QK i?2 +2Mi2`,
var middleAngle = currentAngle + 0.5 * sliceAngle ;
var textX = Math . cos ( middleAngle ) * 120 + centerX ;
var textY = Math . sin ( middleAngle ) * 120 + centerY ;

6Q` textBaseline- i?2 pHm2 "middle" Bb T`Q##Hv TT`QT`Bi2 r?2M mbBM;


i?Bb TT`Q+?X q?i iQ mb2 7Q` textAlign /2T2M/b QM i?2 bB/2 Q7 i?2 +B`+H2
r2 `2 QMX PM i?2 H27i- Bi b?QmH/ #2 "right"- M/ QM i?2 `B;?i- Bi b?QmH/
#2 "left" bQ i?i i?2 i2ti Bb TQbBiBQM2/ rv 7`QK i?2 TB2X
A7 vQm `2 MQi bm`2 ?Qr iQ }M/ Qmi r?B+? bB/2 Q7 i?2 +B`+H2  ;Bp2M M;H2
Bb QM- HQQF iQ i?2 2tTHMiBQM Q7 Math.cos BM i?2 T`2pBQmb 2t2`+Bb2X h?2
+QbBM2 Q7 M M;H2 i2HHb mb r?B+? t@+QQ`/BMi2 Bi +Q``2bTQM/b iQ- r?B+?
BM im`M i2HHb mb 2t+iHv r?B+? bB/2 Q7 i?2 +B`+H2 r2 `2 QMX

 #QmM+BM; #HH
 #Qt Bb 2bv iQ /`r rBi? strokeRectX .2}M2  p`B#H2 i?i ?QH/b Bib bBx2
Q` /2}M2 irQ p`B#H2b B7 vQm` #QtǶb rB/i? M/ ?2B;?i /Bz2`X hQ +`2i2
 `QmM/ #HH- bi`i  Ti?- +HH arc(x, y, radius, 0, 7)- r?B+? +`2i2b M
`+ ;QBM; 7`QK x2`Q iQ KQ`2 i?M  r?QH2 +B`+H2- M/ }HH BiX

99y
hQ KQ/2H i?2 #HHǶb TQbBiBQM M/ bT22/- vQm +M mb2 i?2 Vector ivT2
7`QK *?Ti2` R8U5BMi2`+iBp2 Ur?B+? Bb pBH#H2 QM i?Bb T;2V5VX :Bp2 Bi
 bi`iBM; bT22/- T`272`#Hv QM2 i?i Bb MQi Tm`2Hv p2`iB+H Q` ?Q`BxQMiH-
M/ 2p2`v 7`K2- KmHiBTHv i?i bT22/ rBi? i?2 KQmMi Q7 iBK2 i?i
2HTb2/X q?2M i?2 #HH ;2ib iQQ +HQb2 iQ  p2`iB+H rHH- BMp2`i i?2 t
+QKTQM2Mi BM Bib bT22/X GBF2rBb2- BMp2`i i?2 v +QKTQM2Mi r?2M Bi ?Bib
 ?Q`BxQMiH rHHX
7i2` }M/BM; i?2 #HHǶb M2r TQbBiBQM M/ bT22/- mb2 clearRect iQ /2H2i2
i?2 b+2M2 M/ `2/`r Bi mbBM; i?2 M2r TQbBiBQMX

S`2+QKTmi2/ KB``Q`BM;
h?2 F2v iQ i?2 bQHmiBQM Bb i?2 7+i i?i r2 +M mb2  +Mpb 2H2K2Mi b 
bQm`+2 BK;2 r?2M mbBM; drawImageX Ai Bb TQbbB#H2 iQ +`2i2 M 2ti` <canvas
> 2H2K2Mi- rBi?Qmi //BM; Bi iQ i?2 /Q+mK2Mi- M/ /`r Qm` BMp2`i2/
bT`Bi2b iQ Bi- QM+2X q?2M /`rBM; M +imH 7`K2- r2 Dmbi +QTv i?2
H`2/v BMp2`i2/ bT`Bi2b iQ i?2 KBM +MpbX
aQK2 +`2 rQmH/ #2 `2[mB`2/ #2+mb2 BK;2b /Q MQi HQ/ BMbiMiHvX
q2 /Q i?2 BMp2`i2/ /`rBM; QMHv QM+2- M/ B7 r2 /Q Bi #27Q`2 i?2 BK;2
HQ/b- Bi rQMǶi /`r Mvi?BM;X  "load" ?M/H2` QM i?2 BK;2 +M #2
mb2/ iQ /`r i?2 BMp2`i2/ BK;2b iQ i?2 2ti` +MpbX h?Bb +Mpb +M
#2 mb2/ b  /`rBM; bQm`+2 BKK2/Bi2Hv UBiǶHH bBKTHv #2 #HMF mMiBH r2
/`r i?2 +?`+i2` QMiQ BiVX

>hhS
*QMi2Mi M2;QiBiBQM
a22 i?2 p`BQmb 2tKTH2b Q7 mbBM; M XMLHttpRequest BM i?Bb +?Ti2` 7Q` M
2tKTH2 Q7 i?2 K2i?Q/ +HHb BMpQHp2/ BM KFBM;  `2[m2biX uQm +M mb2
 bvM+?`QMQmb `2[m2bi U#v b2iiBM; i?2 i?B`/ T`K2i2` iQ open iQ falseV
B7 vQm rMiX
bFBM; 7Q`  #Q;mb K2/B ivT2 rBHH `2im`M  `2bTQMb2 rBi? +Q/2 9ye-
dzLQi ++2Ti#H2Ǵ- r?B+? Bb i?2 +Q/2  b2`p2` b?QmH/ `2im`M r?2M Bi +MǶi
7mH}HH i?2 Accept ?2/2`X

99R
qBiBM; 7Q` KmHiBTH2 T`QKBb2b
h?2 7mM+iBQM Tbb2/ iQ i?2 Promise +QMbi`m+iQ` rBHH ?p2 iQ +HH then QM
2+? Q7 i?2 T`QKBb2b BM i?2 ;Bp2M ``vX q?2M QM2 Q7 i?2K bm++22/b- irQ
i?BM;b M22/ iQ ?TT2MX h?2 `2bmHiBM; pHm2 M22/b iQ #2 biQ`2/ BM i?2
+Q``2+i TQbBiBQM Q7  `2bmHi ``v- M/ r2 Kmbi +?2+F r?2i?2` i?Bb rb
i?2 Hbi T2M/BM; T`QKBb2 M/ }MBb? Qm` QrM T`QKBb2 B7 Bi rbX
h?2 Hii2` +M #2 /QM2 rBi?  +QmMi2`- r?B+? Bb BMBiBHBx2/ iQ i?2 H2M;i?
Q7 i?2 BMTmi ``v M/ 7`QK r?B+? r2 bm#i`+i R 2p2`v iBK2  T`QKBb2
bm++22/bX q?2M Bi `2+?2b y- r2 `2 /QM2X JF2 bm`2 vQm iF2 i?2
bBimiBQM r?2`2 i?2 BMTmi ``v Bb 2KTiv UM/ i?mb MQ T`QKBb2 rBHH 2p2`
`2bQHp2V BMiQ ++QmMiX
>M/HBM; 7BHm`2 `2[mB`2b bQK2 i?Qm;?i #mi im`Mb Qmi iQ #2 2ti`2K2Hv
bBKTH2X Cmbi Tbb i?2 7BHm`2 7mM+iBQM Q7 i?2 r`TTBM; T`QKBb2 iQ 2+?
Q7 i?2 T`QKBb2b BM i?2 ``v bQ i?i  7BHm`2 BM QM2 Q7 i?2K i`B;;2`b i?2
7BHm`2 Q7 i?2 r?QH2 r`TT2`X

6Q`Kb M/ 6Q`K 6B2H/b


 Cpa+`BTi rQ`F#2M+?
lb2 document.querySelector Q` document.getElementById iQ ;2i ++2bb iQ i?2 2H@
2K2Mib /2}M2/ BM vQm` >hJGX M 2p2Mi ?M/H2` 7Q` "click" Q` "mousedown"
2p2Mib QM i?2 #miiQM +M ;2i i?2 value T`QT2`iv Q7 i?2 i2ti }2H/ M/ +HH
new Function QM BiX
JF2 bm`2 vQm r`T #Qi? i?2 +HH iQ new Function M/ i?2 +HH iQ Bib
`2bmHi BM  try #HQ+F bQ i?i vQm +M +i+? 2t+2TiBQMb i?i Bi T`Q/m+2bX
AM i?Bb +b2- r2 `2HHv /QMǶi FMQr r?i ivT2 Q7 2t+2TiBQM r2 `2 HQQFBM;
7Q`- bQ +i+? 2p2`vi?BM;X
h?2 textContent T`QT2`iv Q7 i?2 QmiTmi 2H2K2Mi +M #2 mb2/ iQ }HH Bi
rBi?  bi`BM; K2bb;2X P`- B7 vQm rMi iQ F22T i?2 QH/ +QMi2Mi `QmM/-
+`2i2  M2r i2ti MQ/2 mbBM; document.createTextNode M/ TT2M/ Bi iQ i?2
2H2K2MiX _2K2K#2` iQ //  M2rHBM2 +?`+i2` iQ i?2 2M/ bQ i?i MQi
HH QmiTmi TT2`b QM  bBM;H2 HBM2X

99k
miQ+QKTH2iBQM
h?2 #2bi 2p2Mi 7Q` mT/iBM; i?2 bm;;2biBQM HBbi Bb "input" bBM+2 i?i rBHH
}`2 BKK2/Bi2Hv r?2M i?2 +QMi2Mi Q7 i?2 }2H/ Bb +?M;2/X
h?2M HQQT Qp2` i?2 ``v Q7 i2`Kb M/ b22 r?2i?2` i?2v bi`i rBi?
i?2 ;Bp2M bi`BM;X 6Q` 2tKTH2- vQm +QmH/ +HH indexOf M/ b22 r?2i?2`
i?2 `2bmHi Bb x2`QX 6Q` 2+? Ki+?BM; bi`BM;- // M 2H2K2Mi iQ i?2
bm;;2biBQMb <div>X uQm b?QmH/ T`Q##Hv HbQ 2KTiv i?i 2+? iBK2 vQm
bi`i mT/iBM; i?2 bm;;2biBQMb- 7Q` 2tKTH2 #v b2iiBM; Bib textContent iQ
i?2 2KTiv bi`BM;X
uQm +QmH/ 2Bi?2` //  "click" 2p2Mi ?M/H2` iQ 2p2`v bm;;2biBQM 2H2@
K2Mi Q` //  bBM;H2 QM2 iQ i?2 Qmi2` <div> i?i ?QH/b i?2K M/ HQQF i
i?2 target T`QT2`iv Q7 i?2 2p2Mi iQ }M/ Qmi r?B+? bm;;2biBQM rb +HB+F2/X
hQ ;2i i?2 bm;;2biBQM i2ti Qmi Q7  .PJ MQ/2- vQm +QmH/ HQQF i Bib
textContent Q` b2i M ii`B#mi2 iQ 2tTHB+BiHv biQ`2 i?2 i2ti r?2M vQm +`2i2
i?2 2H2K2MiX

*QMrvǶb :K2 Q7 GB72


hQ bQHp2 i?2 T`Q#H2K Q7 ?pBM; i?2 +?M;2b +QM+2TimHHv ?TT2M i i?2
bK2 iBK2- i`v iQ b22 i?2 +QKTmiiBQM Q7  ;2M2`iBQM b  Tm`2 7mM+iBQM-
r?B+? iF2b QM2 ;`B/ M/ T`Q/m+2b  M2r ;`B/ i?i `2T`2b2Mib i?2 M2ti
im`MX
_2T`2b2MiBM; i?2 ;`B/ +M #2 /QM2 BM Mv Q7 i?2 rvb b?QrM BM *?Ti2`b
d M/ R8X *QmMiBM; HBp2 M2B;?#Q`b +M #2 /QM2 rBi? irQ M2bi2/ HQQTb-
HQQTBM; Qp2` /D+2Mi +QQ`/BMi2bX hF2 +`2 MQi iQ +QmMi +2HHb QmibB/2
Q7 i?2 }2H/ M/ iQ B;MQ`2 i?2 +2HH BM i?2 +2Mi2`- r?Qb2 M2B;?#Q`b r2 `2
+QmMiBM;X
JFBM; +?M;2b iQ +?2+F#Qt2b iF2 2z2+i QM i?2 M2ti ;2M2`iBQM +M
#2 /QM2 BM irQ rvbX M 2p2Mi ?M/H2` +QmH/ MQiB+2 i?2b2 +?M;2b M/
mT/i2 i?2 +m``2Mi ;`B/ iQ `2~2+i i?2K- Q` vQm +QmH/ ;2M2`i2  7`2b?
;`B/ 7`QK i?2 pHm2b BM i?2 +?2+F#Qt2b #27Q`2 +QKTmiBM; i?2 M2ti im`MX
A7 vQm +?QQb2 iQ ;Q rBi? 2p2Mi ?M/H2`b- vQm KB;?i rMi iQ ii+?
ii`B#mi2b i?i B/2MiB7v i?2 TQbBiBQM i?i 2+? +?2+F#Qt +Q``2bTQM/b iQ
bQ i?i Bi Bb 2bv iQ }M/ Qmi r?B+? +2HH iQ +?M;2X
hQ /`r i?2 ;`B/ Q7 +?2+F#Qt2b- vQm 2Bi?2` +M mb2  <table> 2H2K2Mi
Ub22 *?Ti2` RjV Q` bBKTHv Tmi i?2K HH BM i?2 bK2 2H2K2Mi M/ Tmi

99j
<br> UHBM2 #`2FV 2H2K2Mib #2ir22M i?2 `QrbX

S`QD2+i,  SBMi S`Q;`K


_2+iM;H2b
uQm +M mb2 relativePos iQ }M/ i?2 +Q`M2` +Q``2bTQM/BM; iQ i?2 bi`i Q7
i?2 KQmb2 /`;X 6B;m`BM; Qmi r?2`2 i?2 /`; 2M/b +M #2 /QM2 rBi?
trackDrag Q` #v `2;Bbi2`BM; vQm` QrM 2p2Mi ?M/H2`X
q?2M vQm ?p2 irQ +Q`M2`b Q7 i?2 `2+iM;H2- vQm Kmbi bQK2?Qr i`Mb@
Hi2 i?2b2 BMiQ i?2 `;mK2Mib i?i fillRect 2tT2+ib, i?2 iQT@H27i +Q`M2`-
rB/i?- M/ ?2B;?i Q7 i?2 `2+iM;H2X Math.min +M #2 mb2/ iQ }M/ i?2 H27i@
KQbi t@+QQ`/BMi2 M/ iQTKQbi v@+QQ`/BMi2X hQ ;2i i?2 rB/i? Q` ?2B;?i-
vQm +M +HH Math.abs Ui?2 #bQHmi2 pHm2V QM i?2 /Bz2`2M+2 #2ir22M irQ
bB/2bX
a?QrBM; i?2 `2+iM;H2 /m`BM; i?2 KQmb2 /`; `2[mB`2b  bBKBH` b2i Q7
MmK#2`b #mi BM i?2 +QMi2ti Q7 i?2 r?QH2 T;2 `i?2` i?M `2HiBp2 iQ i?2
+MpbX *QMbB/2` r`BiBM;  7mM+iBQM findRect- r?B+? +QMp2`ib irQ TQBMib
BMiQ M Q#D2+i rBi? top- left- width- M/ height T`QT2`iB2b bQ i?i vQm
/QMǶi ?p2 iQ r`Bi2 i?2 bK2 HQ;B+ irB+2X
uQm +M i?2M +`2i2  <div> MQ/2 M/ b2i Bib style.position iQ absolute
X q?2M b2iiBM; TQbBiBQMBM; bivH2b- /Q MQi 7Q`;2i iQ TT2M/ "px" iQ i?2
MmK#2`bX h?2 MQ/2 Kmbi #2 //2/ iQ i?2 /Q+mK2Mi UvQm +M TT2M/
Bi iQ document.bodyV M/ HbQ `2KQp2/ ;BM r?2M i?2 /`; 2M/b M/ i?2
+imH `2+iM;H2 ;2ib /`rM QMiQ i?2 +MpbX

*QHQ` TB+F2`
uQmǶHH ;BM M22/ iQ mb2 relativePos iQ }M/ Qmi r?B+? TBt2H rb +HB+F2/X
h?2 pixelAt 7mM+iBQM BM i?2 2tKTH2 /2KQMbi`i2b ?Qr iQ ;2i i?2 pHm2b
7Q`  ;Bp2M TBt2HX SmiiBM; i?Qb2 BMiQ M rgb bi`BM; K2`2Hv `2[mB`2b bQK2
bi`BM; +QM+i2MiBQMX
JF2 bm`2 vQm p2`B7v i?i i?2 2t+2TiBQM vQm +i+? Bb M BMbiM+2 Q7
SecurityError bQ i?i vQm /QMǶi ++B/2MiHHv ?M/H2 i?2 r`QM; FBM/ Q7
2t+2TiBQMX

999
6HQQ/ }HH
:Bp2M  TB` Q7 bi`iBM; +QQ`/BMi2b M/ i?2 BK;2 /i 7Q` i?2 r?QH2
+Mpb- i?Bb TT`Q+? b?QmH/ rQ`F,

RX *`2i2 M ``v iQ ?QH/ BM7Q`KiBQM #Qmi H`2/v +QHQ`2/ +QQ`/B@


Mi2bX

kX *`2i2  rQ`F HBbi ``v iQ ?QH/ +QQ`/BMi2b i?i Kmbi #2 HQQF2/


iX Smi i?2 bi`i TQbBiBQM BM BiX

jX q?2M i?2 rQ`F HBbi Bb 2KTiv- r2 `2 /QM2X

9X _2KQp2 QM2 TB` Q7 +QQ`/BMi2b 7`QK i?2 rQ`F HBbiX

8X A7 i?Qb2 +QQ`/BMi2b `2 H`2/v BM Qm` ``v Q7 +QHQ`2/ TBt2Hb- ;Q


#+F iQ bi2T jX

eX *QHQ` i?2 TBt2H i i?2 +m``2Mi +QQ`/BMi2b M/ // i?2 +QQ`/BMi2b
iQ i?2 ``v Q7 +QHQ`2/ TBt2HbX

dX // i?2 +QQ`/BMi2b Q7 2+? /D+2Mi TBt2H r?Qb2 +QHQ` Bb i?2 bK2
b i?2 bi`iBM; TBt2HǶb Q`B;BMH +QHQ` iQ i?2 rQ`F HBbiX

3X _2im`M iQ bi2T jX

h?2 rQ`F HBbi +M bBKTHv #2 M ``v Q7 p2+iQ` Q#D2+ibX h?2 /i bi`m+@
im`2 i?i i`+Fb +QHQ`2/ TBt2Hb rBHH #2 +QMbmHi2/ p2`v Q7i2MX a2`+?BM;
i?`Qm;? i?2 r?QH2 i?BM; 2p2`v iBK2  M2r TBt2H Bb pBbBi2/ rBHH iF2  HQi
Q7 iBK2X uQm +QmH/ BMbi2/ +`2i2 M ``v i?i ?b  pHm2 BM Bi 7Q` 2p2`v
TBt2H- mbBM; ;BM i?2 t Y v × rB/i? b+?2K2 7Q` bbQ+BiBM; TQbBiBQMb
rBi? TBt2HbX q?2M +?2+FBM; r?2i?2`  TBt2H ?b #22M +QHQ`2/ H`2/v-
vQm +QmH/ /B`2+iHv ++2bb i?2 }2H/ +Q``2bTQM/BM; iQ i?2 +m``2Mi TBt2HX
uQm +M +QKT`2 +QHQ`b #v `mMMBM; Qp2` i?2 `2H2pMi T`i Q7 i?2 /i
``v- +QKT`BM; QM2 }2H/ i  iBK2X P` vQm +M dz+QM/2Mb2Ǵ  +QHQ` iQ
 bBM;H2 MmK#2` Q` bi`BM; M/ +QKT`2 i?Qb2X q?2M /QBM; i?Bb- 2Mbm`2
i?i 2p2`v +QHQ` T`Q/m+2b  mMB[m2 pHm2X 6Q` 2tKTH2- bBKTHv //BM;
i?2 +QHQ`Ƕb +QKTQM2Mib Bb MQi b72 bBM+2 KmHiBTH2 +QHQ`b rBHH ?p2 i?2
bK2 bmKX

998
q?2M 2MmK2`iBM; i?2 M2B;?#Q`b Q7  ;Bp2M TQBMi- iF2 +`2 iQ 2t+Hm/2
M2B;?#Q`b i?i `2 MQi BMbB/2 Q7 i?2 +Mpb Q` vQm` T`Q;`K KB;?i `mM
Qz BMiQ QM2 /B`2+iBQM 7Q`2p2`X

LQ/2XDb
*QMi2Mi M2;QiBiBQM- ;BM
.QMǶi 7Q`;2i iQ +HH i?2 end K2i?Q/ QM i?2 Q#D2+i `2im`M2/ #v http.request
BM Q`/2` iQ +imHHv }`2 Qz i?2 `2[m2biX
h?2 `2bTQMb2 Q#D2+i Tbb2/ iQ http.requestǶb +HH#+F Bb  `2/#H2
bi`2KX h?Bb K2Mb i?i Bi Bb MQi 2MiB`2Hv i`BpBH iQ ;2i i?2 r?QH2 `2@
bTQMb2 #Q/v 7`QK BiX h?2 7QHHQrBM; miBHBiv 7mM+iBQM `2/b  r?QH2 bi`2K
M/ +HHb  +HH#+F 7mM+iBQM rBi? i?2 `2bmHi- mbBM; i?2 mbmH Tii2`M Q7
TbbBM; Mv 2``Q`b Bi 2M+QmMi2`b b i?2 }`bi `;mK2Mi iQ i?2 +HH#+F,
function readStreamAsString ( stream , callback ) {
var data = "";
stream . on (" data " , function ( chunk ) {
data += chunk . toString () ;
}) ;
stream . on (" end " , function () {
callback ( null , data );
}) ;
stream . on (" error " , function ( error ) {
callback ( error ) ;
}) ;
}

6BtBM;  H2F
Ai Bb 2MQm;? iQ bi`BT Qmi HH Q++m``2M+2b Q7 irQ /Qib i?i ?p2  bHb?-
 #+FbHb?- Q` i?2 2M/ Q7 i?2 bi`BM; QM #Qi? bB/2bX lbBM; i?2 replace
K2i?Q/ rBi?  `2;mH` 2tT`2bbBQM Bb i?2 2bB2bi rv iQ /Q i?BbX .Q
MQi 7Q`;2i i?2 g ~; QM i?2 2tT`2bbBQM- Q` replace rBHH `2TH+2 QMHv 
bBM;H2 BMbiM+2- M/ T2QTH2 +QmH/ biBHH ;2i `QmM/ i?Bb b72iv K2bm`2 #v
BM+Hm/BM; //BiBQMH /Qm#H2 /Qib BM i?2B` Ti?b5 HbQ KF2 bm`2 vQm /Q
i?2 `2TH+2 7i2` /2+Q/BM; i?2 bi`BM;- Q` Bi rQmH/ #2 TQbbB#H2 iQ 7QBH i?2

99e
+?2+F #v 2M+Q/BM;  /Qi Q`  bHb?X
MQi?2` TQi2MiBHHv rQ``vBM; +b2 Bb r?2M Ti?b bi`i rBi?  bHb?-
r?B+? `2 BMi2`T`2i2/ b #bQHmi2 Ti?bX "mi #2+mb2 urlToPath Tmib 
/Qi +?`+i2` BM 7`QMi Q7 i?2 Ti?- Bi Bb BKTQbbB#H2 iQ +`2i2 `2[m2bib i?i
`2bmHi BM bm+?  Ti?X JmHiBTH2 bHb?2b BM  `Qr- BMbB/2 i?2 Ti?- `2 Q//
#mi rBHH #2 i`2i2/ b  bBM;H2 bHb? #v i?2 }H2 bvbi2KX

*`2iBM; /B`2+iQ`B2b
uQm +M mb2 i?2 7mM+iBQM i?i BKTH2K2Mib i?2 DELETE K2i?Q/ b  #Hm2T`BMi
7Q` i?2 MKCOL K2i?Q/X q?2M MQ }H2 Bb 7QmM/- i`v iQ +`2i2  /B`2+iQ`v
rBi? fs.mkdirX q?2M  /B`2+iQ`v 2tBbib i i?i Ti?- vQm +M `2im`M 
ky9 `2bTQMb2 bQ i?i /B`2+iQ`v +`2iBQM `2[m2bib `2 B/2KTQi2MiX A7 
MQM/B`2+iQ`v }H2 2tBbib ?2`2- `2im`M M 2``Q` +Q/2X h?2 +Q/2 9yy Udz#/
`2[m2biǴV rQmH/ #2 TT`QT`Bi2 ?2`2X

 Tm#HB+ bT+2 QM i?2 r2#


uQm +M +`2i2  <textarea> 2H2K2Mi iQ ?QH/ i?2 +QMi2Mi Q7 i?2 }H2 i?i Bb
#2BM; 2/Bi2/X  GET `2[m2bi- mbBM; XMLHttpRequest- +M #2 mb2/ iQ ;2i i?2
+m``2Mi +QMi2Mi Q7 i?2 }H2X uQm +M mb2 `2HiBp2 l_Gb HBF2 BM/2tX?iKH-
BMbi2/ Q7 ?iiT,ffHQ+H?Qbi,3yyyfBM/2tX?iKH- iQ `272` iQ }H2b QM i?2 bK2
b2`p2` b i?2 `mMMBM; b+`BTiX
h?2M- r?2M i?2 mb2` +HB+Fb  #miiQM UvQm +M mb2  <form> 2H2K2Mi M/
"submit" 2p2Mi Q` bBKTHv  "click" ?M/H2`V- KF2  PUT `2[m2bi iQ i?2
bK2 l_G- rBi? i?2 +QMi2Mi Q7 i?2 <textarea> b `2[m2bi #Q/v- iQ bp2
i?2 }H2X
uQm +M i?2M //  <select> 2H2K2Mi i?i +QMiBMb HH i?2 }H2b BM i?2
b2`p2`Ƕb `QQi /B`2+iQ`v #v //BM; <option> 2H2K2Mib +QMiBMBM; i?2 HBM2b
`2im`M2/ #v  GET `2[m2bi iQ i?2 l_G /X q?2M i?2 mb2` b2H2+ib MQi?2`
}H2 U "change" 2p2Mi QM i?2 }2H/V- i?2 b+`BTi Kmbi 72i+? M/ /BbTHv
i?i }H2X HbQ KF2 bm`2 i?i r?2M bpBM;  }H2- vQm mb2 i?2 +m``2MiHv
b2H2+i2/ }H2MK2X
lM7Q`imMi2Hv- i?2 b2`p2` Bb iQQ bBKTHBbiB+ iQ #2 #H2 iQ `2HB#Hv `2/
}H2b 7`QK bm#/B`2+iQ`B2b bBM+2 Bi /Q2b MQi i2HH mb r?2i?2` i?2 i?BM; r2
72i+?2/ rBi?  GET `2[m2bi Bb  `2;mH` }H2 Q`  /B`2+iQ`vX *M vQm i?BMF
Q7  rv iQ 2ti2M/ i?2 b2`p2` iQ //`2bb i?Bb\

99d
S`QD2+i, aFBHH@a?`BM; q2#bBi2
.BbF T2`bBbi2M+2
h?2 bBKTH2bi bQHmiBQM A +M +QK2 mT rBi? Bb iQ 2M+Q/2 i?2 r?QH2 talks
Q#D2+i b CaPL M/ /mKT Bi iQ  }H2 rBi? fs.writeFileX h?2`2 Bb H`2/v
 7mM+iBQM UregisterChangeV i?i Bb +HH2/ 2p2`v iBK2 i?2 b2`p2`Ƕb /i
+?M;2bX Ai +M #2 2ti2M/2/ iQ r`Bi2 i?2 M2r /i iQ /BbFX
SB+F  }H2MK2- 7Q` 2tKTH2 ./talks.jsonX q?2M i?2 b2`p2` bi`ib- Bi
+M i`v iQ `2/ i?i }H2 rBi? fs.readFile- M/ B7 i?i bm++22/b- i?2 b2`p2`
+M mb2 i?2 }H2Ƕb +QMi2Mib b Bib bi`iBM; /iX
"2r`2- i?Qm;?X h?2 talks Q#D2+i bi`i2/ b  T`QiQivT2@H2bb Q#D2+i bQ
i?i i?2 in QT2`iQ` +QmH/ #2 bM2Hv mb2/X JSON.parse rBHH `2im`M `2;mH`
Q#D2+ib rBi? Object.prototype b i?2B` T`QiQivT2X A7 vQm mb2 CaPL b vQm`
}H2 7Q`Ki- vQmǶHH ?p2 iQ +QTv i?2 T`QT2`iB2b Q7 i?2 Q#D2+i `2im`M2/ #v
JSON.parse BMiQ  M2r- T`QiQivT2@H2bb Q#D2+iX

*QKK2Mi }2H/ `2b2ib


h?2 / ?Q+ TT`Q+? Bb iQ bBKTHv biQ`2 i?2 bii2 Q7  iHFǶb +QKK2Mi
}2H/ UBib +QMi2Mi M/ r?2i?2` Bi Bb 7Q+mb2/V #27Q`2 `2/`rBM; i?2 iHF
M/ i?2M `2b2i i?2 }2H/ iQ Bib QH/ bii2 7i2`r`/X
MQi?2` bQHmiBQM rQmH/ #2 iQ MQi bBKTHv `2TH+2 i?2 QH/ .PJ bi`m+im`2
rBi? i?2 M2r QM2 #mi `2+m`bBp2Hv +QKT`2 i?2K- MQ/2 #v MQ/2- M/
mT/i2 QMHv i?2 T`ib i?i +imHHv +?M;2/X h?Bb Bb  HQi ?`/2` iQ
BKTH2K2Mi- #mi BiǶb KQ`2 ;2M2`H M/ +QMiBMm2b rQ`FBM; 2p2M B7 r2 //
MQi?2` i2ti }2H/X

"2ii2` i2KTHi2b
uQm +QmH/ +?M;2 instantiateTemplate bQ i?i Bib BMM2` 7mM+iBQM iF2b MQi
Dmbi  MQ/2 #mi HbQ  +m``2Mi +QMi2ti b M `;mK2MiX uQm +M i?2M-
r?2M HQQTBM; Qp2`  MQ/2Ƕb +?BH/ MQ/2b- +?2+F r?2i?2` i?2 +?BH/ ?b 
template-repeat ii`B#mi2X A7 Bi /Q2b- /QMǶi BMbiMiBi2 Bi QM+2 #mi BMbi2/
HQQT Qp2` i?2 ``v BM/B+i2/ #v i?2 ii`B#mi2Ƕb pHm2 M/ BMbiMiBi2 Bi
QM+2 7Q` 2p2`v 2H2K2Mi BM i?2 ``v- TbbBM; i?2 +m``2Mi ``v 2H2K2Mi b
+QMi2tiX

993
*QM/BiBQMHb +M #2 BKTH2K2Mi2/ BM  bBKBH` rv- rBi? ii`B#mi2b
+HH2/- 7Q` 2tKTH2- template-when M/ template-unless- r?B+? +mb2  MQ/2
iQ #2 BMbiMiBi2/ QMHv r?2M  ;Bp2M T`QT2`iv Bb i`m2 UQ` 7Hb2VX

h?2 mMb+`BTi#H2b
hrQ +2Mi`H bT2+ib Q7 i?2 TT`Q+? iF2M BM i?Bb +?Ti2`ě +H2M
>hhS BMi2`7+2 M/ +HB2Mi@bB/2 i2KTHi2 `2M/2`BM;ě/QMǶi rQ`F rBi?@
Qmi Cpa+`BTiX LQ`KH >hJG 7Q`Kb +M b2M/ GET M/ POST `2[m2bib #mi
MQi PUT Q` DELETE `2[m2bib M/ +M b2M/ i?2B` /i QMHv iQ  }t2/ l_GX
h?mb- i?2 b2`p2` rQmH/ ?p2 iQ #2 `2pBb2/ iQ ++2Ti +QKK2Mib- M2r
iHFb- M/ /2H2i2/ iHFb i?`Qm;? POST `2[m2bib- r?Qb2 #Q/B2b `2MǶi CaPL
#mi `i?2` mb2 i?2 l_G@2M+Q/2/ 7Q`Ki i?i >hJG 7Q`Kb mb2 Ub22 *?T@
i2` RdVX h?2b2 `2[m2bib rQmH/ ?p2 iQ `2im`M i?2 7mHH M2r T;2 bQ i?i
mb2`b b22 i?2 M2r bii2 Q7 i?2 bBi2 7i2` i?2v KF2  +?M;2X h?Bb rQmH/
MQi #2 iQQ ?`/ iQ 2M;BM22` M/ +QmH/ #2 BKTH2K2Mi2/ HQM;bB/2 i?2
dz+H2MǴ >hhS BMi2`7+2X
h?2 +Q/2 7Q` `2M/2`BM; iHFb rQmH/ ?p2 iQ #2 /mTHB+i2/ QM i?2 b2`p2`X
h?2 index.html }H2- `i?2` i?M #2BM;  biiB+ }H2- rQmH/ ?p2 iQ #2
;2M2`i2/ /vMKB+HHv #v //BM;  ?M/H2` 7Q` Bi iQ i?2 `Qmi2`X h?i
rv- Bi H`2/v BM+Hm/2b i?2 +m``2Mi iHFb M/ +QKK2Mib r?2M Bi ;2ib
b2`p2/X

99N
AM/2t

QT2`iQ`- R9- ky- Red ky9 U>hhS biimb +Q/2V- jNR- jNk
4 QT2`iQ`- je k/ U+Mpb +QMi2tiV- kN3
Y QT2`iQ`- R9- Re- ky- Nd- Red 9yy U>hhS biimb +Q/2V- 99d
YY QT2`iQ`- jd 9y9 U>hhS biimb +Q/2V- jk8- jNy-
Y4 QT2`iQ`- je 9yd- 9yN
@ QT2`iQ`- R9- Re- ky 9y8 U>hhS biimb +Q/2V- j3N
Ĝ QT2`iQ`- jd 9ye U>hhS biimb +Q/2V- 99R
@4 QT2`iQ`- je 8yy U>hhS biimb +Q/2V- jNy- jN8
f QT2`iQ`- R9
f4 QT2`iQ`- je  U>hJG i;V- kk9- k9y- k9k- j98
I4 QT2`iQ`- Rd #2HbQM- >H- ky8
4 QT2`iQ`- k8- ee- R3k- R39- kRj #bQHmi2 Ti?- 99d
44 QT2`iQ`- Rd- ky- eN- 38 #bQHmi2 TQbBiBQMBM;- k9e- k8R- k8N-
444 QT2`iQ`- kR- 38- 9k3 ke9- kdR
\, QT2`iQ`- RN- kk #bi`+i bvMit i`22- b22 bvMit
() U``vV- ek i`22
() Ubm#b+`BTiV- ej #bi`+iBQM- e- 9k- 3e- 3d- Ny- Nd-
W QT2`iQ`- R9- je- jRy- 9k9- 9k8- N3- RyR- Rjy- ky8- kkR- kjk-
9jd- 9jN jjk- jj3
 QT2`iQ`- R3- kR- Ry9 ++2H2`iBQM- kNy
%% QT2`iQ`- R3- kR- 89- Ry9- Rjk- ++2Ti ?2/2`- j9y- jN8- 99R
j88- 9k9 ++2bb +QMi`QH- Rj3- Rej- RNR- 9y9
= QT2`iQ`- Rd ++2bb@*QMi`QH@HHQr@P`B;BM ?2/2`-
=4 QT2`iQ`- Rd jjk
I QT2`iQ`- Rd +iBQMhvT2b Q#D2+i- R9R
&' U#HQ+FV- jj- 9e- NR +iBp21H2K2Mi T`QT2`iv- j99
&' UQ#D2+iV- e8- Rkk +iQ`- kde- k3k- k3d- k33- jRe
kyy U>hhS biimb +Q/2V- jk8- j38 +iQ`i K2i?Q/- k3d
//1Mi`v 7mM+iBQM- eN

98y
//1p2MiGBbi2M2` K2i?Q/- k8j- kNk- TTHB+iBQM UQ7 7mM+iBQMbV- b22 7mM+@
j3e iBQM TTHB+iBQM
//BiBQM- R9- Rke TTHv K2i?Q/- Nk- Ryd
//`2bb- jk9 TT`QtBKiBQM- Rk3
//`2bb #`- kkk- jk9- jke `+- jy9Ĝjye
/QTiBQM- Re9 `+ K2i?Q/- jy8- 99y
;2 /Bz2`2M+2 U2t2`+Bb2V- Ryj- 9k3 `+hQ K2i?Q/- jy9- jy8
H2`i 7mM+iBQM- kd- 9N- kk8 `2- jdR
H;Q`Bi?K- 998 `;mK2Mi- kd- 9N- 89- Rde- kye
HB;MK2Mi- Rkk `;mK2Mib Q#D2+i- dN- NR- 9ke
HH 7mM+iBQM- j9y- 99k BM/2tBM;- 3y
HT?- jd9 `;p T`QT2`iv- jdN
HT?MmK2`B+ +?`+i2`- Ree `Bi?K2iB+- R9- ky- kRj
Hi ii`B#mi2- kje `Kbi`QM;- CQ2- Ry8
Hi F2v- k83 ``v- e9- e8- ed- dj- 39- 33- 3N-
HiE2v T`QT2`iv- k83 Nk- Nj- Ryj- Rk3- RkN- Rek-
K#B;mBiv- kRN Re3- kR3- kde- 9kN
J.- RNd- kyy b ;`B/- RkN- jd9
K2`B+M 1M;HBb?- Red b i#H2- dR
KT2`bM/ +?`+i2`- kk9- jkd +`2iBQM- ek- N3- Rjy- 9ke
MHvbBb- R9N- R8j }Hi2`BM;- N9
M+2biQ` 2H2K2Mi- k3j BM/2tBM;- ej- dj- dd- 33- RRd-
M+2bi`v 2tKTH2- Nk- N9ĜNe- NN- Rjy- Rjk- 9RR- 9ke- 9jd
RyR- Ryj H2M;i? Q7- e9- Rjy
L*1ah_un6AG1 /i b2i- Nj K2i?Q/b- de- dN- 39- 3N- N9-
M;H2- k93- jy8- jye- jdk- 99y N8- Ry9- 9RR
M;H2 #`+F2ib- kkj- kk9 b2`+?BM;- dj- dd
MBKi2 K2i?Q/- k33 i`p2`bH- 33
MBKiBQM- RjN- R9e- k9d- k93- k8R- ``v +QMbi`m+iQ`- Rjy
kej- kdR- kd9- kde- kd3- ``v T`QiQivT2- Ry3- RRR
k38- k3e- k33- kNy- kNR- ``v@HBF2 Q#D2+i- dN- Nk- kyR- kR9-
kNj- kN9- jyN- jRy- jR8- kjk- kjj- k98- j98- j9N-
jR3- jky- jkj- 9jN- 99y j8k- j3j
MQMvKQmb 7mM+iBQM- RNR ``Qr 7mM+iBQM- Rj8
TT2M/*?BH/ K2i?Q/- kj8- k3y- `iB}+BH BMi2HHB;2M+2- Rk3- R9y- R9d-
9je kRd- 9jy
TTH2- kkd `iB}+BH HB72- Rk3- kdj- j8d

98R
`iB}+BH bimTB/Biv U2t2`+Bb2V- R9d- "MFb- AM- kdk
9jy #2M +QmMiBM; U2t2`+Bb2V- ey- 9ke
a*AA `i- j3R #27Q`2mMHQ/ 2p2Mi- ke8
bb2`i 7mM+iBQM- ReR #2?pBQ`- RjR- R9y- R3e- kRd- 9jy-
bb2`iBQM- ReR- Rek 9jR
bbB;MK2Mi- k8- je- R3k- R39- kRN- #2M+?K`F- k9R
9je "2`M2`b@G22- hBK- jk9
bbmKTiBQM- R8N- Rek #2bi T`+iB+2b- j
bi2`BbF- R9- Red #2xB2`*m`p2hQ K2i?Q/- jyj
bvM+?`QMQmb AfP- RNd- jjy- jde- #BM`v /i- 9- RR- j3j
jdd #BM`v MmK#2`- RR- Rk- dk- R8j-
bvM+?`QMQmb T`Q;`KKBM;- RN3Ĝ Rd9- j8y
kyy- kN8- jjy- jjj- jj8- #BM`v QT2`iQ`- R9- Re- kj
jjd- j98- j8k- jdeĜjd3- j3k- #BM/ K2i?Q/- Ryk- Ryd- Rj8
j3e- jNy #Bi- 9- RR- Rk- Rd- dk
ii+F- jjk #BiKT ;`T?B+b- jy3- jkj
ii`B#mi2- kk9- kj3- jeR- 99j "HQ# ivT2- j8j
mi?Q`BxiBQM- 9y9 #HQ+F- jj- j9- 9k- R8d- R83- kye
miQ+QKTH2iBQM U2t2`+Bb2V- j8d- 99j #HQ+F +QKK2Mi- jN- Rd3
miQ7Q+mb ii`B#mi2- j99 #HQ+F 2H2K2Mi- k9y- k9k- k9j
miQKiB+ b2KB+QHQM BMb2`iBQM- k9 #HQ+FBM;- RNd- k9d- kee- ke3- jjy-
pi`- kdj jdd- j39
p2`;2 7mM+iBQM- Nd- Ryj- 9k3- #Hm` 2p2Mi- ke9- ke8
9kN #Hm` K2i?Q/- j99
tBb- k3N- kNN- jRR- jRk #Q/v U>hJG i;V- kkj- kk8- kjy
#Q/v U>hhSV- jke- jkd- jkN- j38-
"##;2- *?`H2b- eR jNR- jNk- 9y3
#+F;`QmM/- kdj- k3y- k3e- k3d- #Q/v T`QT2`iv- kjy- kjR- kj9
jRe #QH/- k9k
#+F;`QmM/ U*aaV- kdR- kdj- k3k #QQF MHQ;v- R33- ky9
#+F;`QmM/_2/6BH2 7mM+iBQM- RN3- "QQF Q7 S`Q;`KKBM;- RR- jde
jjk "QQH2M- Rd- jy- jj- e3- Re8- kRk-
#+FbHb? +?`+i2`- R8- Re9- Ree- kRj
RdN- kk9- jNe- 9jj- 99e +QMp2`bBQM iQ- kR- jy- j9
#+Fi`+FBM;- Rd9- Rd3 "QQH2M 7mM+iBQM- jy
#+Fr`/ +QKTiB#BHBiv- RNy #Q`/2` U*aaV- k9y- k9j
#HH- jkj- 99y #Q`/2`@`/Bmb U*aaV- k8N

98k
#QmM+BM;- RjR- kd8- kdd- k3e- k3N- ++?2- RNe- RN3- 9j9
jkj +HH K2i?Q/- Ryd- RRR- Rkj- Rje-
"QmM+BM;*`Bii2` ivT2- RjR R9k- kR9
#QmM/`v- RdR- Rdj- RdN- R39- R3e- +HH bi+F- 93Ĝ8y- 89- R8e- R8d-
jRe- 9jk R8N- Rey
#Qt- Rej- kkN- kdj- jkj- 99y +HH#+F 7mM+iBQM- k8k- kNj- kN9-
#Qt b?/Qr U*aaV- k3j jjy- jjkĜjj8- jde- jdd- j3k-
#` U>hJG i;V- 99j j3j- j3e- jNj- 9Re- 99e
#`+2b- b22 +m`Hv #`+2b +HHBM; UQ7 7mM+iBQMbV- b22 7mM+@
#`M+?BM;- Rdk- Rd9 iBQM TTHB+iBQM
#`M+?BM; `2+m`bBQM- 8j- jRj +K2H +b2- j3- k99
#`2F F2vrQ`/- je- jd +M+2HMBKiBQM6`K2 7mM+iBQM-
#`2FTQBMi- R89 ke3
"`BiBb? 1M;HBb?- Red +Mpb- kd9- kNd- jyyĜjy8- jydĜ
#`Qrb2`- k- e- kdĜkN- 3k- RNj- RNd- jR9- jRNĜjkk- jek- jed- je3-
kky- kkk- kk8Ĝkkd- k8j- kdj- jdj- 99R
kd9- jkj- jk9- jke- jk3- +QMi2ti- kN3- kNN- jeN
jjy- jjk- jj3- jjN- j9e- Ti?- jyR
j89- j8e- je8- je3- jNe- bBx2- kN3- jyy
9yy- 9yR- 9kj +Mpb U>hJG i;V- kN3- jey
#`Qrb2` r`b- kkd +Mpb T`QT2`iv- jek
"`Qrb2`B7v- RNd *Mpb.BbTHv ivT2- jR9ĜjRe- jR3
#`Qrb2`b- N +TBiHBxiBQM- j3- RyN- Re3- k99-
#`mb?- jey- je8- jee- jdy k8y- jk3- jkN- j3d- 9jd
#m##HBM;- b22 2p2Mi T`QT;iBQM +Tim`2 ;`QmT- ReN- RdR- Rde- 9ye
#m+F2i }HH- jd9- 998 +`22`- kdk
#m/;2i- 9kj +`2i +?`+i2`- Ree- RdR- R39
"mz2` ivT2- j3j- j3e- j3d +`MBpQ`2- R93
#m;- 3e- R9N- R8j- RdN- R3R- R3e- +``B;2 `2im`M- R3j
R3N- RNy- kkd- jNe +b+/BM;- k99
#mbBM2bb bQ7ir`2- jk3 *b+/BM; aivH2 a?22ib- b22 *aa
#miiQM- k8k- jke- j98- j83- jdy +b2 +QMp2`bBQM- e9
#miiQM U>hJG i;V- kke- k8j- k83- +b2 F2vrQ`/- jd
kdR- j9e- j89- j8d +b2 b2MbBiBpBiv- Re3- jkN- 9jj
#miiQMb T`QT2`iv- keR +bmH +QKTmiBM;- R
#vLK2 Q#D2+i- NN- Ryj +iǶb ?i U2t2`+Bb2V- k8R
+i+? F2vrQ`/- R8e- R8d- R8N- Rey-

98j
Rej- 9jk +H2`BM;- kjN- kNd- jyN- jRe- 99R
+i+? K2i?Q/- jjd +H2`AMi2`pH 7mM+iBQM- ke3
*.- RR +H2`_2+i K2i?Q/- jyN- 99R
+2H2`v- jNN +H2`hBK2Qmi 7mM+iBQM- ked- ke3
+2HH- j8d +H2p2`M2bb- kyR
+2MbQ`2/ F2v#Q`/ U2t2`+Bb2V- kdy- +HB+F 2p2Mi- k8j- k88- k8N- 99k-
9jd 99j- 99d
+2Mi2`- k39 +HB2Mi- kkR- jj3- j38- 9yy- 9Rj
+2Mi2`BM;- k9d +HB2Mi>2B;?i T`QT2`iv- k9y
+2Mim`v- Ryj- 9kN +HB2MiqB/i? T`QT2`iv- k9y
+2`iB}+i2- jjN +HB2Mis T`QT2`iv- key- jej
+?BMBM;- jje- jN9 +HB2Miu T`QT2`iv- key- jej
+?M;2 2p2Mi- j99- j93- j8e- jey- +HBT#Q`/- kke- kdy
jee- jeN- 99j- 99d +HBTTBM;- jRe
+?Ti2`- R33 +HQM2LQ/2 K2i?Q/- 9R3
+?`+i2`- R8- k83- j9d +HQMBM;- 9R3
+?`+i2` +i2;Q`v- R38 +HQb2Si? K2i?Q/- jyk
+?`+i2` 2M+Q/BM;- j3j +HQbBM; i;- kk9- kk8
+?`i K2i?Q/- ey- dN +HQbm`2- 8y- NR- kR3- j8k- 9j8- 9je-
+?`*Q/2 T`QT2`iv- k83- 9jd 9j3- 9jN
+?`*Q/2i K2i?Q/- k8d +Q/2- 3- Rdd- kdk
+?i- kkR bi`m+im`2 Q7- kj- 99
+?2+F#Qt- j9k- j93- j83- 99j +Q/2 ;QH7- R3e
+?2+F2/ ii`B#mi2- j9k- j93 +Q/2 bi`m+im`2- j9- 9k- Rk9- R33
+?2bb #Q`/ U2t2`+Bb2V- 9R- 9k8 +QBM- kdjĜkd8- k3d- k3NĜkNk- jRN
+?BH/ MQ/2- kjR- kjj- kj9- kek *QBM ivT2- kd3- k3N
+?BH/LQ/2b T`QT2`iv- kjj- kje- 9j3 +QHH#Q`iBQM- kky
+?QB+2- Rdk +QHH2+iBQM- e- ek- e8- ed- 39- Rke-
*?`QK2- kkd 9jy
+B`+H2- k93- jy9- jy8- jdk +QHHBbBQM /2i2+iBQM- k3e- k3d- k3NĜ
+B`+H2 Uao: i;V- kN3 kNR- 99y
+B`+mH` /2T2M/2M+v- ky9- 9j9 +QHQM +?`+i2`- RN- jd- ee- k9j
+B`+mb- de +QHQ`- kN3- jyy- jRe- jey- je8- jdj
+Hbb ii`B#mi2- kj8- k9y- k99- k3y- +QHQ` U*aaV- k9j
k3k- k3j- jek- 9Rd +QHQ` TB+F2`- je8
+HbbLK2 T`QT2`iv- k9y +QHQ` TB+F2` U2t2`+Bb2V- jdj- 999
+H2MBM; mT- R8d- k38 +QHqB/i?b 7mM+iBQM- RRe

989
+QKK +?`+i2`- kye +QM+m``2M+v- kee
+QKKM/ F2v- k83 +QM/BiBQMH 2t2+miBQM- RN- jy- jd-
+QKKM/ HBM2- jde- jd3Ĝj3y 9R- kRk- 9kk
+QKK2Mi- jN- Nj- Rdd- R3k- R39- +QM/BiBQMH QT2`iQ`- RN- kk
kR3- kjR- 9yy- 9yj- 9yN- +QM};m`iBQM- R3k
9RN- 9j8 +QM}`K 7mM+iBQM- kN
+QKK2Mi }2H/ `2b2i U2t2`+Bb2V- 9kk- *QM7m+Bmb- k
993 +QMM2+iBQM- kkR- jk9- jjy- jjj-
*PJJ1LhnLP.1 +Q/2- kjR jjN- 9yy- 9yR
*QKKQMCa- RN9- RN8- RNd- ky9- +QMbBbi2M+v- j3- kky- kjk
j3y- j3R +QMbQH2XHQ;- e- Ry- Re- k3- 93- 8y-
+QKKmMB+iBQM- kky- jj3 83- 3y- R89- jdN- j33
+QKKmMBiv- jdd +QMbiMi- 3R- kNy
+QKT`BbQM- Rd- kR- jj- jd- 38- +QMbi`m+iQ`- j3- RyN- RRy- RkRĜ
kRj- 9ke Rk9- Rke- RjR- Rjk- Rj9-
Q7 +QHQ`b- 998 R9R- R8R- R8d- Rdy- RdN-
Q7 .PJ MQ/2b- 993 kd8
Q7 LL- R3 +QMi2Mi M2;QiBiBQM U2t2`+Bb2V- j9y-
Q7 MmK#2`b- Rd- k3 jN8- 99R- 99e
Q7 Q#D2+ib- eN *QMi2Mi@G2M;i? ?2/2`- jk8
Q7 bi`BM;b- Rd *QMi2Mi@hvT2 ?2/2`- jk8- j38-
Q7 mM/2}M2/ pHm2b- ky j3N- jNd
+QKTbb /B`2+iBQM- RjR- R9y +QMi2ti- kNN- jek- jej- jeN
+QKTiB#BHBiv- d- kky- kkd- jk3- +QMi2ti K2Mm- k8e
je8 +QMi2ti T`K2i2`- Rj8- Rje
+QKTBHiBQM- kRe- 9j8 +QMiBMm2 F2vrQ`/- je
+QKTH2iBQM- jk3- j8d +QMi`QH ~Qr- jy- jk- j9- j8- 93-
+QKTH2tBiv- j- 9- 3e- N3- Ry8- Rk9- NR- R8e- k8k- jjd- jd3
Rd8- kyk- k98- kee- kdN +QMi`QH F2v- k83
+QKTQb#BHBiv- e- Nd- N3- kyR +QMi`QH TQBMi- jykĜjy9
+QKTQbBiBM;- je8 +QMi`QHb Q#D2+i- jeR- je8
+QKTQbBiBQM- Rk9 +QMp2MiBQM- j3- kyR
+QKTmi2/ T`QT2`iv- ej *QMrvǶb :K2 Q7 GB72- j8d
+QKTmi2`- R- j +QQ`/BMi2b- Rke- RkN- Rjy- Rjj-
+QM+i K2i?Q/- dd- Ryj- Rky- 9je k93- k8N- key- kde- k3R-
+QM+i2MiBQM- Re- dd- Rky- 9je- k39- k3d- kNN- jyy- jy8-
999- 99e jRR- jej- 999- 998

988
+QTv@Tbi2 T`Q;`KKBM;- 8e- R3N /b? +?`+i2`- R9- Ree- k99
+QTvBM;- 9R3 /i- j- RR- eR
+Q``2HiBQM- dy- dR- dj- d8- de /i ii`B#mi2- kj3- kjN- kdR
+QbBM2- 3R- k93 /i 2p2Mi- j3d
+QmMi2` p`B#H2- jk- j8- k93- 9k8- /i 7Q`Ki- Nj- kjk- jjR
9ke- 9jd- 99k /i HQbb- 9kR
*Sl- jdd /i b2i- dk- Nk- RRN
+`b?- R8N- Rek- jNj- 9y3- 9kR /i bi`m+im`2- eR- ek- d9- 39- NN-
+`2i21H2K2Mi K2i?Q/- kjd- jey- RkN- kyR- kye- kjR- jky-
9je j83- 9jR
+`2i2SBMi 7mM+iBQM- jeR /i l_G- jed
+`2i2_2/ai`2K 7mM+iBQM- j3d- /i#b2- jk3
jNy /ih#H2 7mM+iBQM- Rky- Rkj
+`2i2a2`p2` 7mM+iBQM- j39- j3e- /i2- Ree- Re3ĜRdy
9y9- 9ye .i2 +QMbi`m+iQ`- Rdy
+`2i2h2tiLQ/2 K2i?Q/- kje- 99k /i2 }2H/- je8
+`2i2q`Bi2ai`2K 7mM+iBQM- j3e- .i2 ivT2- RNR- kyj
jNk .i2XMQr 7mM+iBQM- Rdy- 9yj
+`BbT- jky /#H+HB+F 2p2Mi- k8N
+`Bii2`- Rk3- RjR- Rje- R9y- R9j- /2#QmM+BM;- ke3
R98- R93 /2#m;;2` bii2K2Mi- R89
*`Q+F7Q`/- .Qm;Hb- kky /2#m;;BM;- d- R9NĜR8R- R8j- R89-
+`Qbb@/QKBM `2[m2bi- jjk- je3- R8d- ReyĜRek- R3e
jdj /2+2Mi`HBxiBQM- kky
+`vBM;- Re3 /2+BKH MmK#2`- RR- R8j- Rd9
+`vTiQ;`T?v- jjN /2+H`iBQM- k9j
*aa- k9j- k99- kek- k3RĜk3j- k38- /2+Q/2l_A*QKTQM2Mi 7mM+iBQM-
kNd- jyy- jek jkd- j3N- 9ye- 99e
+i`HE2v T`QT2`iv- k83 /2+QmTHBM;- RNy
+m`H T`Q;`K- jNk /22T +QKT`BbQM- eN- 38
+m`Hv #`+2b- jj- 9k- e8- ee- 3N- /22T +QKT`BbQM U2t2`+Bb2V- 38-
Re3- 9k8 9k3
+m`bQ`- j9d- j93 /27mHi #2?pBQ`- k9k- k8e- 9jd
+m`p2- jykĜjy9 /27mHi F2vrQ`/- jd
+v+H2- kjR /27mHi pHm2- kR- Ryy- jyy- j88-
9ke
.`F "Hm2 U;K2V- kdk /272MbBp2 T`Q;`KKBM;- Rjd- RjN

98e
/2}M2 7mM+iBQM- RN3Ĝkyy /Q+mK2Mi 7Q`Ki- jj3- j9y
/2}M2S`QT2`iv 7mM+iBQM- RRj- Rkk- .Q+mK2Mi P#D2+i JQ/2H- b22 .PJ
9kN /Q+mK2MiiBQM- kyR- jde
/2;`22- jy8- jRR /Q+mK2Mi1H2K2Mi T`QT2`iv- kjy-
.1G1h1 K2i?Q/- jk8- jke- j33- jjy
jNR- 9yd- 9RN /QHH` bB;M- k8- RdR- Rde- R39
/2H2i2 QT2`iQ`- ed .PJ- kjyĜkjk- kj9- kj8- kj3- k98-
/2MQ/2B7v 7mM+iBQM- jNj k8j- k83- kdj- kd9- k3y-
/2T2M/2M+2- dy k3k- k3j- kNd- kN3- jky-
/2T2M/2M+v- R3N- RNy- RN9- RNd- jjR- j9k- j9d- jey- 9R9-
RNN- ky9- j3k 9R3
/2b2`BHBxiBQM- Nj +QMbi`m+iBQM- kjk- kj8- kjd-
/2p2HQT2` iQQHb- 3- k3- R89- R8N jey- 9R9
/BHQ; #Qt- kd- kN /QKBM- kkk- jk8- jjk- j89- je3
/BKQM/- jkk- 9jN /QKBM@bT2+B}+ HM;m;2- 3e- R8k-
/B;Bi- RR- Rj- R8j- ReeĜReN- R3d Re9- kRd- k98- jjd- 9R9
.BDFbi`- 1/b;2`- Rk3 .PJ.BbTHv ivT2- k3y- k3R- jR9
/BK2MbBQMb- Rke- Rk3- k9y- kdk- /Qi +?`+i2`- b22 T2`BQ/ +?`+@
kd9- k3e- kN3- 9k8 i2`
/BMQbm`- kRd /Qm#H2 +HB+F- k8N
/B`2+i +?BH/ MQ/2- k98 /Qm#H2@[mQi2 +?`+i2`- R8- R3d-
/B`2+iBQMb Q#D2+i- RjR- R9y ky8- kk9
/B`2+iQ`v- j3k- j39- j33ĜjNR- jNe- /QrMHQ/- 3- RNy- k8y- jNk- 9yy-
jNd- 99d 9kR
/Bb#H2/ ii`B#mi2- j98 /`;;#H2 #` 2tKTH2- k