JavaScript Crash Course: A Hands-On, Project-Based Introduction to Programming

Praise for Javascript Crash Course....9 Title Page....11 Copyright....12 Dedication....13 About the Author and Technical Reviewer....14 Acknowledgments....15 Introduction....16 Who Is This Book For?....17 Why JavaScript?....17 What Can You Expect to Learn?....18 Online Resources....20 Part I: The Language....22 1. Getting Started....23 Using the JavaScript Console....23 Using a Text Editor....25 Summary....27 2. The Basics....28 Expressions and Statements....28 Numbers and Operators....30 Order of Operations....30 Floating Point....31 Bindings....32 Variables....32 Constants....34 Naming Conventions....36 Incrementing and Decrementing....37 Addition and Subtraction Assignment....39 Multiplication and Division Assignment....40 Strings....40 Joining Strings....41 Finding the Length of a String....42 Getting a Character from a String....43 Getting Multiple Characters from a String....44 Trimming Whitespace from a String....45 Other Useful String Methods....45 Escape Sequences....46 Template Literals....48 Undefined and Null....49 Booleans....50 Logical Operators....51 Comparison Operators....54 Type Coercion....56 Equality with Coercion....57 Truthiness....58 Uses for Truthiness....60 Summary....62 3. Compound Data Types....64 Arrays....64 Creation and Indexing....65 Arrays of Arrays....66 Array Methods....69 Objects....76 Creating Objects....77 Accessing Object Values....78 Setting Object Values....79 Working with Objects....80 Nesting Objects and Arrays....83 Nesting with Literals....84 Nesting with Variables....85 Exploring Nested Objects in the Console....86 Printing Nested Objects with JSON.stringify....88 Summary....89 4. Conditionals and Loops....91 Making Decisions with Conditionals....92 if Statements....92 if…else Statements....93 More Complex Conditions....94 Chained if…else Statements....96 Repeating Code with Loops....99 while Loops....99 for Loops....101 for…of Loops....104 for…in Loops....107 Summary....108 5. Functions....109 Declaring and Calling Functions....109 Return Values....111 Parameter Types....113 Side Effects....114 Passing a Function as an Argument....116 Other Function Syntaxes....117 Function Expressions....118 Arrow Functions....120 Rest Parameters....123 Higher-Order Functions....124 Array Methods That Take Callbacks....125 Custom Functions That Take Callbacks....128 Functions That Return Functions....130 Summary....132 6. Classes....134 Creating Classes and Instances....134 Inheritance....139 Prototype-Based Inheritance....144 Using Constructors and Prototypes....145 Comparing Constructors and Classes....148 Exploring Object.prototype....149 Walking the Prototype Chain....151 Overriding a Method....153 Summary....154 Part II: Interactive Javascript....156 7. HTML, the DOM, and CSS....157 HTML....157 Creating an HTML Document....158 Understanding Nested Relationships....160 The Document Object Model....161 The DOM API....163 Element Identifiers....163 script Elements....167 CSS....169 link Elements....169 Rulesets....170 Selectors....171 Using CSS Selectors in JavaScript....175 Summary....176 8. Event-based Programming....178 Event Handlers....178 Event Bubbling....181 Event Delegation....183 Mouse Movement Events....187 Keyboard Events....191 Summary....194 9. The Canvas Element....195 Creating a Canvas....195 Making Static Drawings....196 Drawing Outlined Rectangles....198 Drawing Other Shapes Using Paths....200 Interacting with the Canvas....203 Animating the Canvas....209 Summary....211 Part III: Projects....213 Project 1: Creating a Game....215 10. Pong....216 The Game....216 Setup....217 The Ball....218 Refactoring....220 The Game Loop....221 Bouncing....224 The Paddles....226 Moving the Paddles with Player Input....229 Detecting Paddle Collisions....230 Bouncing Near the Paddle Ends....235 Scoring Points....238 Computer Control....243 Game Over....245 The Complete Code....249 Summary....253 11. Object-Oriented Pong....255 Object-Oriented Design....256 The File Structure....257 The GameView Class....258 The Game Elements....260 The Paddles....261 The Ball....262 The Scores and Computer Classes....266 The Game Class....267 Starting the Game....271 Summary....272 Project 2: Making Music....273 12. Generating Sounds....274 The Web Audio API....274 Setting Up....275 Generating a Tone with the Web Audio API....276 The Tone.js Library....280 Generating a Tone with Tone.js....280 Understanding the Tone.Synth Options....282 Playing More Notes in Sequence....287 Playing Multiple Notes at Once....289 The Tone.js Transport....290 Tone.Loop....291 Tone.Sequence....295 Tone.Part....297 Making Drum Sounds....299 Hi-Hat Synthesis....299 Snare Synthesis....301 Kick Synthesis....304 Reverb....305 A Drum Loop....307 Working with Samples....310 Summary....313 13. Writing a Song....314 Getting Organized....314 Event Handling....315 Making the Drumbeat....316 Adding the Bass Lines....320 Adding Chords....324 Playing a Tune....326 The Complete Code....330 Summary....336 Project 3: Visualizing Data....337 14. Introducing the D3 Library....338 The SVG Graphics Format....339 Grouping Elements....341 Drawing Circles....344 Defining Paths....346 Styling Elements with CSS....350 Adding Interactivity with JavaScript....353 The D3 Library....355 Setup....355 Selections....356 Data Binding....358 Data Joins....360 Real-Time Updates....362 Transitions and Key Functions....365 Advanced Joins....367 Creating a Bar Graph....371 Setting Up....371 Calculating Character Frequencies....372 Drawing the Bar Graph....375 Styling with CSS and Regular Expressions....388 Cleaning the Data....392 Animating the Changes....393 Summary....395 15. Visualizing Data from the Github Search API....397 Setting Up....398 Fetching Data....398 The Basic Visualization....403 Creating the Elements....403 Drawing the Axes....404 Drawing the Bars....408 Improving the Visualization....411 Showing Repository Info....411 Color-Coding the Bars....417 Labeling the Left Axis....422 Adding Interactivity....423 Filtering the Data by License....423 Animating the Changes....428 The Complete Code....432 Summary....436 Afterword....437 Index....445