13 |
Imprint
14 |
Eloquent JavaScript
15 |
16 |
Eloquentjavascript.net is a provided and maintained by:
17 |
Marijn Haverbeke
Ostpreußendamm 66 H
12207 Berlin
Germany
Email: marijnh@gmail.com
18 |
Registered as an Einzelunternehmen in Berlin Steglitz.
19 |
20 | | Tax number: | 20/334/00047 |
21 |
22 | | VAT ID: | DE275453213 |
23 |
24 |
The person responsible for the contents of eloquentjavascript.net as per Art. 55 RStV [German Interstate Broadcasting Treaty]: Marijn Haverbeke.
25 |
← back to cover
26 |
Register now, and be the first to hear about all our
10 | spectacular deals on our unique products!
11 |
9 |
Donating
10 |
11 |
I wasn't really planning to make any money off this thing,
12 | but a few people have suggested I should put up a donation
13 | link. So here it is -- if you feel the inclination, and you
14 | have a PayPal account, the
15 | button below can be used to donate something.
16 |
17 |
©
Marijn Haverbeke, (
license), last modified
27 | on August 6 2007.
43 |
44 |
Eloquent JavaScript
45 |
A Modern Introduction to Programming
46 |
by Marijn Haverbeke
47 |
48 |
49 |
53 |
54 |
Eloquent JavaScript is a book providing an
55 | introduction to the JavaScript programming language and
56 | programming in general.
57 |
58 |
59 | A concise and balanced mix of principles and pragmatics. I loved the tutorial-style game-like program development. This book rekindled my earliest joys of programming. Plus, JavaScript!
60 | —Brendan Eich, the man who gave us JavaScript
61 |
62 |
63 |
The book exists in two forms. It was originally written and
64 | published in digital form, which
65 | includes interactive examples and a mechanism for playing with
66 | all the example code. This version is released under an open
68 | license.
69 |
70 |
I have published a revised version of the book on paper. The
71 | structure of this version remained largely the same, but the
72 | whole text has been thoroughly edited and updated. You can order
73 | from Amazon
75 | here. There is still an interactive coding environment for this
76 | version, as a separate page. Errata are
77 | here.
78 |
79 |
The digital version is available in the following formats:
80 |
81 |
86 |
87 |
The following translations are available:
88 |
89 |
94 |
95 |
97 |
98 |
Mr. Stroustrup is the inventor of the C++ programming language, but quite an insightful person nevertheless.
12 |
13 |
14 |
These are the known mistakes in the first print of the
15 | paper edition of Eloquent JavaScript. If you think you
16 | have found another one, please send me an email.
18 |
19 |
Chapter 1
20 |
21 |
Page 12: In the example 'You
22 | ain't never seen a donkey fly!', the quote
23 | in ain't should be escaped.
24 |
25 |
Page 17: "can be evoked" should say
26 | "can be invoked".
27 |
28 |
Page 21: Bottom paragraph, "writen"
29 | should be "written".
30 |
31 |
Page 24: In the paragraph above
32 | "Capitalization" header, an "s" is missing in "Then it start
33 | executing".
34 |
35 |
Page 27: In the top paragraph,
36 | NaN should also be listed as a value that is
37 | falsy.
38 |
39 |
Chapter 2
40 |
41 |
Page 35: In the code snippet
42 | that defines a power function, the first argument
43 | to the function should be base, not
44 | number.
45 |
46 |
Page 39: The part "all the operators
47 | that were performed" should be "all the operations...".
48 |
49 |
Chapter 3
50 |
51 |
Page 48: Third paragraph, "the value
52 | of which is a property" should say "the value of which it is
53 | a property".
54 |
55 |
Chapter 5
56 |
57 |
Pages 79, 81, 82, and 85: All
58 | instances of the word 'header' should say 'heading' instead.
59 |
60 |
Page 82: The second line of code
61 | snippet at the top of the page should be
62 | paragraphs.length (with an s), not
63 | paragraph.length.
64 |
65 |
Page 83: At the bottom of the
66 | page, the line that calls indexOrEnd has one too
67 | many closing parentheses at the end.
68 |
69 |
Page 87: At the very end of the page, there's a double quote missing at the end of the string " src=\"picture.png\" alt=\"The Picture\"".
70 |
71 |
Page 88: In the code fragment at the
72 | top, a semicolon is missing after the first return, though I claimed
73 | I'd write out all semicolons.
74 |
75 |
Page 89: In the
76 | renderFragment code snippet, the references to
77 | number should say fragment.number
78 | instead. Further down, the paragraph that starts "Rending a
79 | whole paragraph..." should say "Rendering a whole
81 | paragraph" instead.
82 |
83 |
Chapter 6
84 |
85 |
Page 106: Second paragraph,
86 | where it says "above and to the left", it should say "above and
87 | to the right".
88 |
89 |
Page 108: In the code snippet
90 | that introduces bind, as well as the text below
91 | that, any references to testArray should actually
92 | read x.
93 |
94 |
Page 109: In the definition of
95 | method, a return should be written
96 | before the expression in the inner function.
97 |
98 |
Page 110 and
99 | 116: In both definitions of processCreate,
100 | all references to creature should be replaced by
101 | creature.object, and all references to
102 | point with creature.point.
103 |
104 |
Page 117: In the code that
105 | defines creatureMove, the boolean operator in the
106 | if should be &&, not
107 | ||.
108 |
109 |
Page 120: In the code example,
110 | the inner loop variable should be j, not
111 | i.
112 |
113 |
Page 122: In the code snippet,
114 | the condition surroundings[this.direction] != ""
115 | should have && emptySpace.length > 0
116 | appended to it.
117 |
118 |
Page 125: In the call to
119 | print at the bottom of the page, the comma and the
120 | dot before this.details should be switched (dot in
121 | quotes, comma after them).
122 |
123 |
Chapter 7
124 |
125 |
Page 131: First paragraph under "The
126 | Shape of a Module", "come up some techniques" should be "come
127 | up with some techniques".
128 |
129 |
Page 136: Third paragraph, first
130 | sentence, "return true" should be "returns true".
131 |
132 |
Chapter 8
133 |
134 |
Page 140: In the code example at
135 | the bottom of the page, the result of the search
136 | call should be 2, not 3.
137 |
138 |
Chapter 11
139 |
140 |
Page 181: In the code, the
141 | semicolon after boulders should be a colon.
142 |
143 |
145 |
146 |
14 |
15 |
--------------------------------------------------------------------------------
/web/css/highlight.css:
--------------------------------------------------------------------------------
1 | .editbox {
2 | border-width: 0;
3 | margin: .4em;
4 | padding: 0;
5 | font-family: monospace;
6 | font-size: 10pt;
7 | color: black;
8 | }
9 |
10 | .editbox pre, .editbox p {
11 | margin: 0;
12 | padding: 0;
13 | }
14 |
15 | span.keyword {
16 | color: #770088;
17 | }
18 |
19 | span.atom {
20 | color: #448888;
21 | }
22 |
23 | span.variable {
24 | color: black;
25 | }
26 |
27 | span.variabledef {
28 | color: #0000FF;
29 | }
30 |
31 | span.localvariable {
32 | color: #004499;
33 | }
34 |
35 | span.property {
36 | color: black;
37 | }
38 |
39 | span.comment {
40 | color: #AA7700;
41 | }
42 |
43 | span.string {
44 | color: #AA2222;
45 | }
46 |
47 | pre.code, .editbox {
48 | color: #666666;
49 | }
50 |
--------------------------------------------------------------------------------
/renderer/Html.hs:
--------------------------------------------------------------------------------
1 | module Html where
2 |
3 | data HTML = Tx String | Tg String [(String, String)] [HTML]
4 |
5 | instance Show HTML where
6 | show (Tx s) = escapeHtml s
7 | show (Tg tag props []) = "<" ++ tag ++ (propString props) ++ "/>"
8 | show (Tg tag props children) = "<" ++ tag ++ (propString props) ++ ">" ++ (concatMap show children) ++ ""
9 |
10 | tg tag children = Tg tag [] children
11 |
12 | propString [] = ""
13 | propString ((prop, value):props) = " " ++ prop ++ "=\"" ++ (escapeHtml value) ++ "\"" ++ (propString props)
14 |
15 | escapeHtml = concatMap fixChar
16 | where fixChar '<' = "<"
17 | fixChar '>' = ">"
18 | fixChar '&' = "&"
19 | fixChar '"' = """
20 | fixChar c = [c]
21 |
--------------------------------------------------------------------------------
/web/example_events.html:
--------------------------------------------------------------------------------
1 |
2 |
3 | 
![](\"img/ostrich.png\"/)
";
8 |
--------------------------------------------------------------------------------
/web/css/book.css:
--------------------------------------------------------------------------------
1 | body {
2 | margin: 0;
3 | }
4 |
5 | div.content {
6 | font-family: tahoma, arial, sans-serif;
7 | padding: 3em 5em;
8 | padding-right: 4em;
9 | max-width: 850px;
10 | color: #222;
11 | line-height: 150%;
12 | }
13 |
14 | h1 {
15 | font-size: 200%;
16 | margin-left: -1em;
17 | margin-bottom: 1.4em;
18 | page-break-before: left;
19 | }
20 |
21 | h1 .number {
22 | display: block;
23 | font-size: 45%;
24 | font-weight: normal;
25 | }
26 |
27 | h2 {
28 | font-size: 150%;
29 | }
30 |
31 | div.block {
32 | padding: 0 .5em;
33 | position: relative;
34 | }
35 |
36 | div.exercisenum {
37 | top: 0;
38 | width: 7em;
39 | margin-left: -8em;
40 | position: absolute;
41 | text-align: right;
42 | z-index: 11;
43 | font-size: 85%;
44 | color: #AAAAAA;
45 | }
46 |
47 | div.exercise {
48 | border-left: .2em solid #FFBBBB;
49 | margin-left: -.7em;
50 | padding-left: .5em;
51 | }
52 |
53 | div.solution {
54 | border-left: .2em solid #AAEEAA;
55 | margin-left: -.7em;
56 | padding-left: .5em;
57 | position: relative;
58 | }
59 |
60 | div.solutionarrow {
61 | position: absolute;
62 | top: 0;
63 | margin-left: -4em;
64 | width: 3em;
65 | text-align: right;
66 | z-index: 11;
67 | color: #AAAAAA;
68 | cursor: pointer;
69 | }
70 |
71 | code {
72 | font-family: courier new, courier, monospace;
73 | color: #033;
74 | }
75 |
76 | p {
77 | margin: 1em 0;
78 | orphans: 2;
79 | }
80 |
81 | pre.preformatted, pre.code {
82 | margin: 1.1em 12px;
83 | border: 1px solid #CCCCCC;
84 | padding: .4em;
85 | font-family: courier new, courier, monospace;
86 | font-size: 90%;
87 | page-break-inside: avoid;
88 | }
89 |
90 | pre.invalid {
91 | border: 1px solid #FF9999;
92 | }
93 |
94 | a:link {
95 | color: #223388;
96 | text-decoration: none;
97 | }
98 |
99 | a:visited {
100 | color: #554477;
101 | text-decoration: none;
102 | }
103 |
104 | a:hover {
105 | text-decoration: underline;
106 | }
107 |
108 | .footref, span.exponent {
109 | vertical-align: super;
110 | font-size: 60%;
111 | }
112 |
113 | span.footref {
114 | color: #223388;
115 | cursor: pointer;
116 | }
117 |
118 | ol.footnotes {
119 | font-size: 70%;
120 | padding-left: 2em;
121 | }
122 |
123 | div.footnotefloat {
124 | font-size: 80%;
125 | }
126 |
127 | div.footnotefloat code {
128 | color: #002222;
129 | }
130 |
131 | /* Revolting hack to make image-rulers work in IE */
132 | hr {
133 | background: url(../img/hr.png) no-repeat top center;
134 | filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/hr.png');
135 | width: 1px;
136 | height: 1px;
137 | border: 0;
138 | }
139 | * > hr {
140 | width: 100%;
141 | height: 10px;
142 | }
143 |
144 | blockquote {
145 | font-style: italic;
146 | page-break-inside: avoid;
147 | }
148 |
149 | blockquote em {
150 | font-style: normal;
151 | }
152 |
153 | div.illustration {
154 | padding-left: 1em;
155 | page-break-inside: avoid;
156 | }
157 |
158 | div.picture {
159 | text-align: center;
160 | page-break-inside: avoid;
161 | }
162 |
163 | div.navigation {
164 | font-size: 85%;
165 | color: #AAAAAA;
166 | margin-top: 2em;
167 | }
168 |
169 | div.navigation a:link {
170 | color: #888888;
171 | }
172 |
173 | div.navigation a:visited {
174 | color: #888888;
175 | }
176 |
177 | ul.index {
178 | list-style-type: none;
179 | margin: 1em 0;
180 | padding: 0;
181 | }
182 |
183 | div.toggle {
184 | color: #AA0000;
185 | cursor: pointer;
186 | }
187 |
188 | div.toggle:hover {
189 | text-decoration: underline;
190 | }
191 |
192 | div.floater {
193 | position: absolute;
194 | border: 1px solid #888888;
195 | background-color: #EEEEEE;
196 | padding: .3em;
197 | z-index: 12;
198 | }
199 |
200 | button.react {
201 | position: absolute;
202 | z-index: 10;
203 | left: 3px;
204 | top: 3px;
205 | border: 0;
206 | height: 23px;
207 | width: 30px;
208 | padding: 0;
209 | background-image: url(../img/react.png);
210 | background-color: transparent;
211 | cursor: pointer;
212 | }
213 |
214 | div.reactpopup {
215 | position: absolute;
216 | font-family: tahoma, arial, sans-serif;
217 | padding: .2em .5em;
218 | border: 1px solid #888888;
219 | background-color: #EEEEEE;
220 | top: 27px;
221 | left: 3px;
222 | z-index: 12;
223 | overflow: auto; /* workaround for FF invisible-cursor bug */
224 | }
225 |
226 | div.reactpopup p {
227 | margin: .3em 0;
228 | }
229 |
230 | div.reactpopup span {
231 | width: 7.5em;
232 | display: block;
233 | float: left;
234 | }
235 |
236 | div.reactpopup input {
237 | border: 1px solid #888888;
238 | padding: 2px;
239 | vertical-align: middle;
240 | width: 12.5em;
241 | }
242 |
243 | div.reactpopup textarea {
244 | width: 24em;
245 | height: 10em;
246 | border: 1px solid #888888;
247 | padding: 2px;
248 | font-family: tahoma, arial, sans-serif;
249 | }
250 |
251 | div.reactpopup button {
252 | border: 1px solid #888888;
253 | background-color: white;
254 | }
255 |
256 | div.footer {
257 | font-size: 80%;
258 | color: #AAAAAA;
259 | margin-top: 2em;
260 | }
261 |
262 | div.footer a:link, div.footer a:visited {
263 | color: #6688BB;
264 | }
265 |
266 | a.donate {
267 | position: absolute;
268 | font-family: tahoma, arial, sans-serif;
269 | z-index: 12;
270 | left: 6px;
271 | top: 33px;
272 | text-decoration: none;
273 | color: #CCCCCC;
274 | font-size: 70%;
275 | font-weight: bold;
276 | }
277 |
278 | a.paragraph {
279 | position: absolute;
280 | color: white;
281 | color: transparent;
282 | display: block;
283 | right: 0px;
284 | padding: 0 1em;
285 | margin-right: -2em;
286 | text-decoration: none;
287 | }
288 |
289 | p:hover a.paragraph, a.paragraph:hover { color: #aaa; }
290 |
--------------------------------------------------------------------------------
/web/errata.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |