Preface |
|
xv | |
Acknowledgements |
|
xvii | |
Authors |
|
xix | |
|
|
1 | (18) |
|
1.1 Introduction to Web Development |
|
|
1 | (2) |
|
1.2 Client-Side and Server-Side JavaScript |
|
|
3 | (1) |
|
1.3 Origin, History and Evolution of JavaScript |
|
|
4 | (2) |
|
1.4 Features of JavaScript |
|
|
6 | (2) |
|
1.5 Advantages and Limitations |
|
|
8 | (2) |
|
1.6 Structure of Browsers |
|
|
10 | (1) |
|
1.7 Saying Hello World to JS |
|
|
11 | (4) |
|
|
12 | (1) |
|
|
13 | (1) |
|
1.7.2.1 Examples of Framework, Library and Tools |
|
|
14 | (1) |
|
|
15 | (2) |
|
|
17 | (2) |
|
|
17 | (1) |
|
|
17 | (1) |
|
1.9.3 Multiple-Choice Questions |
|
|
18 | (1) |
|
|
19 | (28) |
|
|
19 | (1) |
|
|
19 | (3) |
|
2.2.1 Whitespace and Comments |
|
|
20 | (1) |
|
|
20 | (1) |
|
|
20 | (1) |
|
|
21 | (1) |
|
|
21 | (1) |
|
|
21 | (1) |
|
|
22 | (2) |
|
2.3.1 Variable Declaration and Scope |
|
|
22 | (2) |
|
|
24 | (5) |
|
2.4.1 Primitive Data Types |
|
|
25 | (2) |
|
2.4.2 Nonprimitive Data Types |
|
|
27 | (1) |
|
|
27 | (1) |
|
|
28 | (1) |
|
|
29 | (5) |
|
2.5.1 Arithmetic Operators |
|
|
29 | (1) |
|
2.5.2 Comparison Operators |
|
|
29 | (2) |
|
|
31 | (1) |
|
|
31 | (1) |
|
2.5.5 Assignment Operator |
|
|
31 | (1) |
|
|
32 | (1) |
|
|
33 | (1) |
|
|
33 | (1) |
|
|
34 | (1) |
|
|
34 | (1) |
|
2.6 Control Flow Statements |
|
|
34 | (5) |
|
2.6.1 Decision Statements |
|
|
34 | (1) |
|
|
35 | (1) |
|
2.6.1.2 Switch Case Statement |
|
|
36 | (1) |
|
2.6.2 Loops and Iterations |
|
|
37 | (1) |
|
|
37 | (1) |
|
|
38 | (1) |
|
|
38 | (1) |
|
|
39 | (1) |
|
|
39 | (2) |
|
|
39 | (1) |
|
|
40 | (1) |
|
2.7.3 Multiple-Choice Questions |
|
|
40 | (1) |
|
2.8 Demo and Hands-On for Variables and Assignment Operator |
|
|
41 | (2) |
|
|
41 | (1) |
|
|
41 | (1) |
|
|
42 | (1) |
|
|
42 | (1) |
|
|
42 | (1) |
|
|
43 | (1) |
|
2.9 Demo and Hands-On for Control Flow Statements |
|
|
43 | (4) |
|
|
43 | (1) |
|
|
44 | (1) |
|
|
44 | (1) |
|
|
44 | (1) |
|
|
45 | (2) |
|
|
47 | (34) |
|
|
48 | (2) |
|
3.2 Properties of Objects |
|
|
50 | (2) |
|
3.2.1 Property Configuration Descriptors |
|
|
50 | (2) |
|
|
52 | (2) |
|
3.4 Objects as Record and Dictionary |
|
|
54 | (1) |
|
3.5 Operations on Objects |
|
|
55 | (8) |
|
3.5.1 Accessors and Mutators |
|
|
55 | (2) |
|
3.5.2 Useful Operations and Loops |
|
|
57 | (3) |
|
|
60 | (1) |
|
3.5.4 Built-in Object Methods |
|
|
61 | (2) |
|
3.6 Prototypal Inheritance |
|
|
63 | (2) |
|
|
64 | (1) |
|
|
65 | (6) |
|
3.7.1 Constructor, Properties and Methods |
|
|
66 | (2) |
|
|
68 | (1) |
|
3.7.3 Getters and Setters in Classes |
|
|
69 | (1) |
|
|
70 | (1) |
|
|
71 | (2) |
|
|
73 | (2) |
|
|
73 | (1) |
|
|
73 | (1) |
|
3.9.3 Multiple-Choice Questions |
|
|
74 | (1) |
|
3.10 Demo and Hands-On for Objects |
|
|
75 | (6) |
|
|
75 | (1) |
|
|
75 | (1) |
|
|
75 | (1) |
|
|
76 | (1) |
|
|
77 | (1) |
|
|
78 | (3) |
|
|
81 | (18) |
|
4.1 Functions in JavaScript |
|
|
81 | (1) |
|
4.2 Function Variable Scope |
|
|
82 | (2) |
|
|
84 | (5) |
|
4.3.1 Traditional Function Declaration |
|
|
85 | (1) |
|
4.3.2 Function Expressions |
|
|
85 | (1) |
|
4.3.3 Arrow Function Expressions |
|
|
86 | (1) |
|
4.3.3.1 Limitations of Arrow Functions |
|
|
87 | (2) |
|
4.4 Parameters in a Function |
|
|
89 | (2) |
|
4.4.1 Return Keyword in Functions |
|
|
89 | (1) |
|
4.4.2 Invoking a Function |
|
|
89 | (1) |
|
|
90 | (1) |
|
|
90 | (1) |
|
|
91 | (2) |
|
|
91 | (1) |
|
|
91 | (1) |
|
4.5.3 Multiple-Choice Questions |
|
|
92 | (1) |
|
4.6 Demo and Hands-On for Functions |
|
|
93 | (6) |
|
|
93 | (1) |
|
|
93 | (1) |
|
|
93 | (1) |
|
|
94 | (2) |
|
|
96 | (3) |
|
|
99 | (28) |
|
|
99 | (1) |
|
|
100 | (1) |
|
|
100 | (2) |
|
|
101 | (1) |
|
5.3.2 Using the New Keyword and Array Constructor |
|
|
101 | (1) |
|
|
102 | (1) |
|
5.5 Built-in Methods inside Array |
|
|
103 | (13) |
|
|
103 | (4) |
|
|
107 | (4) |
|
|
111 | (1) |
|
5.5.3.1 Using Fundamental Loops |
|
|
112 | (1) |
|
5.5.3.2 Predefined Iterator Methods |
|
|
112 | (4) |
|
5.6 Nesting and Multidimensional Arrays |
|
|
116 | (1) |
|
|
117 | (2) |
|
|
119 | (1) |
|
|
120 | (2) |
|
|
120 | (1) |
|
|
120 | (1) |
|
5.9.3 Multiple-Choice Questions |
|
|
120 | (2) |
|
5.10 Demo and Hands-On for Arrays |
|
|
122 | (5) |
|
|
122 | (1) |
|
|
122 | (1) |
|
|
122 | (1) |
|
|
122 | (1) |
|
|
123 | (2) |
|
|
125 | (2) |
|
|
127 | (18) |
|
|
127 | (2) |
|
|
129 | (5) |
|
6.2.1 Properties of Window Object |
|
|
131 | (1) |
|
6.2.2 Methods of Window Object |
|
|
132 | (2) |
|
|
134 | (2) |
|
6.3.1 Properties of History Object |
|
|
135 | (1) |
|
6.3.2 Methods of History Object |
|
|
135 | (1) |
|
|
136 | (2) |
|
6.4.1 Properties and Methods of Navigator Object |
|
|
137 | (1) |
|
|
138 | (1) |
|
6.5.1 Properties of Location Object |
|
|
138 | (1) |
|
6.5.2 Methods of Location Object |
|
|
139 | (1) |
|
|
139 | (1) |
|
6.6.1 Properties of Screen Object |
|
|
139 | (1) |
|
|
140 | (1) |
|
|
140 | (2) |
|
|
140 | (1) |
|
|
140 | (1) |
|
6.8.3 Multiple-Choice Questions |
|
|
141 | (1) |
|
6.9 Demo and Hands-On for BOM |
|
|
142 | (3) |
|
|
142 | (1) |
|
|
142 | (1) |
|
|
142 | (1) |
|
|
142 | (1) |
|
|
143 | (2) |
|
|
145 | (34) |
|
7.1 Document Object Model (DOM) |
|
|
145 | (3) |
|
7.2 Relationship between BOM, DOM and JavaScript |
|
|
148 | (3) |
|
7.3 Understanding DOM Tree and Nodes |
|
|
151 | (4) |
|
7.3.1 Properties of Node Object |
|
|
153 | (1) |
|
7.3.2 Method of Node Object |
|
|
154 | (1) |
|
|
155 | (2) |
|
7.4.1 Properties of Document Object |
|
|
155 | (1) |
|
7.4.2 Methods for Document Object |
|
|
156 | (1) |
|
|
157 | (2) |
|
7.5.1 Properties of Element Object |
|
|
157 | (1) |
|
7.5.2 Methods for Element Object |
|
|
158 | (1) |
|
7.6 Accessing Elements in the DOM |
|
|
159 | (3) |
|
7.7 Event Handling Using DOM |
|
|
162 | (2) |
|
|
164 | (1) |
|
|
164 | (1) |
|
|
164 | (1) |
|
7.8.3 Multiple-Choice Questions |
|
|
164 | (1) |
|
7.9 Demo and Hands-On DOM |
|
|
165 | (9) |
|
|
165 | (1) |
|
|
165 | (1) |
|
|
166 | (1) |
|
|
166 | (1) |
|
|
167 | (2) |
|
|
169 | (1) |
|
|
170 | (4) |
|
7.10 Demo and Hands-On for Event Delegation |
|
|
174 | (5) |
|
|
174 | (1) |
|
|
174 | (1) |
|
|
175 | (1) |
|
|
175 | (2) |
|
|
177 | (2) |
|
8 Standard Built-in Objects |
|
|
179 | (32) |
|
|
179 | (22) |
|
8.1.1 Fundamental Objects |
|
|
180 | (1) |
|
|
180 | (1) |
|
|
181 | (1) |
|
|
181 | (2) |
|
|
183 | (1) |
|
|
184 | (1) |
|
|
184 | (1) |
|
|
184 | (2) |
|
|
186 | (2) |
|
|
188 | (2) |
|
8.1.4 Text or String Processing |
|
|
190 | (1) |
|
|
190 | (3) |
|
|
193 | (2) |
|
|
195 | (1) |
|
|
195 | (1) |
|
|
196 | (1) |
|
8.1.6 Indexed Collections |
|
|
197 | (1) |
|
|
197 | (2) |
|
|
199 | (1) |
|
|
199 | (1) |
|
8.1.9 Function Properties |
|
|
200 | (1) |
|
|
201 | (2) |
|
|
201 | (1) |
|
|
202 | (1) |
|
8.2.3 Multiple-Choice Questions |
|
|
202 | (1) |
|
8.3 Demo and Hands-On for Loops |
|
|
203 | (4) |
|
|
203 | (1) |
|
|
203 | (1) |
|
|
203 | (1) |
|
|
203 | (1) |
|
|
204 | (1) |
|
|
205 | (2) |
|
8.4 Demo and Hands-On for Hoisting |
|
|
207 | (4) |
|
|
207 | (1) |
|
|
207 | (1) |
|
|
207 | (1) |
|
|
208 | (1) |
|
|
209 | (2) |
|
9 Validation, Error Handling and Cookies |
|
|
211 | (18) |
|
|
211 | (4) |
|
9.1.1 Server- and Client-Side Validation |
|
|
212 | (1) |
|
9.1.2 Using Built-in Form Validation |
|
|
212 | (2) |
|
9.1.3 Using JavaScript for Validation |
|
|
214 | (1) |
|
|
215 | (4) |
|
|
216 | (1) |
|
|
217 | (1) |
|
|
218 | (1) |
|
|
219 | (1) |
|
|
219 | (1) |
|
|
220 | (2) |
|
|
222 | (2) |
|
|
224 | (2) |
|
|
224 | (1) |
|
|
225 | (1) |
|
9.6.3 Multiple-Choice Questions |
|
|
225 | (1) |
|
9.7 Demo and Hands-On for Form Validation and Cookies |
|
|
226 | (3) |
|
|
226 | (1) |
|
|
226 | (1) |
|
|
226 | (1) |
|
|
226 | (3) |
|
10 Miscellaneous Case Studies |
|
|
229 | (16) |
|
10.1 Case Study-1: Introduction to Fetch API |
|
|
229 | (2) |
|
|
229 | (1) |
|
|
229 | (1) |
|
|
230 | (1) |
|
|
230 | (1) |
|
10.2 Case Study-2: Integrating MongoDB in Cloud |
|
|
231 | (6) |
|
|
231 | (1) |
|
|
231 | (1) |
|
10.2.2.1 MongoDB Cloud Connection |
|
|
231 | (1) |
|
10.2.2.2 Docker Container for Node.js |
|
|
232 | (1) |
|
|
233 | (1) |
|
|
233 | (1) |
|
10.2.4.1 Front-End Script for Invoking Our Custom APIs |
|
|
233 | (1) |
|
10.2.4.2 Code Walkthrough |
|
|
234 | (1) |
|
10.2.4.3 Creating Node.js Backend |
|
|
234 | (3) |
|
10.3 Case Study-3: Visualizing Graphs with JavaScript |
|
|
237 | (2) |
|
|
237 | (1) |
|
|
237 | (1) |
|
|
237 | (1) |
|
|
237 | (1) |
|
10.3.5 Front-End Script for Invoking Our Custom APIs |
|
|
237 | (2) |
|
10.4 Case Study-4: Integrating Firebase Auth |
|
|
239 | (6) |
|
|
239 | (1) |
|
|
239 | (1) |
|
|
239 | (1) |
|
|
240 | (1) |
|
|
240 | (1) |
|
10.4.5.1 Creating a Login Page |
|
|
240 | (1) |
|
10.4.5.2 Code Walkthrough |
|
|
241 | (1) |
|
10.4.5.3 Creating Home Page |
|
|
242 | (1) |
|
10.4.5.4 Code Walkthrough |
|
|
243 | (2) |
References |
|
245 | (8) |
Index |
|
253 | |