The JavaScript Pocket Guide (Peachpit Pocket Guide)

JavaScript is an object-oriented scripting language that enables you to modify a document's structure, styling, and content in response to user actions. This handy pocket serves as both a quick introduction to the language and acts a valuable reference. It's packed with tips as well as JavaScript syntax, methods, and properties. Concise and inexpensive, it's exactly the guide many web designers and developers need. Cover 1 Contents 6 Introduction 18 Why JavaScript Is Cool 19 Who Should Read This Book 20 What You Need to Follow Along 20 What’s in This Book 20 What’s Not in This Book 21 Resources 21 Writing JavaScript Code 22 Case Sensitivity 22 Comments 22 Semicolons 23 Whitespace and New Lines 23 Reserved Words 23 Balanced Brackets and Quotes 25 Firebug 25 Chapter 1: JavaScript Basics 28 Expressions and Statements 29 Variables and Data 30 Values 31 Comparison 32 Truthiness and Falsiness 33 Functions and Objects 35 Objects 36 Loops 37 Control Flow 38 if/if-else/else 38 switch/case 39 try/catch/finally 40 throw 40 break and continue 41 Compound Expressions 42 Boolean Operators 42 Logical NOT: ! 42 Logical AND: && 43 Logical OR: || 44 Combining Boolean Operators 45 Ternary Expressions 46 Chapter 2: Numbers 48 Basic Math 49 Number Formats 51 Constants and Functions 52 The Math Object 52 Even More Properties and Methods 53 Generating Random Integers 53 Conversion 53 Number Precision 56 Chapter 3: Strings 58 Escape Characters 59 Operators 59 Properties 60 Methods 60 Changing Case: toUpperCase(), toLowerCase() 61 Extracting Parts of a String 61 charAt(x), charCodeAt(x) 61 slice(x[, y]) 62 substr(x[, y]) 63 Converting Strings to Arrays: split([delimiter, limit]) 63 Search and Replace 64 indexOf(substring[, start]) 64 lastIndexOf(substring[, start]) 66 search(regexp) 67 match(regexp) 67 replace(pattern, replacement) 67 Helper Functions 69 stringTrim() 69 Global Functions 69 escape(string), unescape(string) 69 encodeURI(string), decodeURI(string) 70 encodeURIComponent(string), decodeURIComponent(string) 70 Chapter 4: Arrays 72 Creating Arrays 73 Properties 73 Looping Over Arrays 74 forEach(loopFunc) 75 Methods 76 Adding Items to Arrays 76 concat(x[,y,z ...]) 77 push(x[,y,z ...]) 77 unshift(x[,y,z ...]) 77 Removing Items from Arrays 78 pop() 78 shift() 78 Extracting Items from Arrays 78 slice(x[,y]) 79 splice(start[, length, newValue ...]) 79 Ordering Arrays 80 reverse() 81 sort([func]) 81 Converting Arrays to Strings 82 join([delimiter]) 82 toString() 83 Chapter 5: Functions 84 Creating Functions 85 Declarations 85 Expressions 85 Self-invoking Functions 86 Arguments 87 Default Values for Arguments 88 Objects as Arguments 90 Return Values 92 Functions as Methods 93 Context Binding 95 Closures 97 Recursion 101 Caching 102 Memoization 104 Chapter 6: Objects 106 Basics 107 Looping Over Properties 108 Enumerable Properties 110 Deleting Properties 112 Constructor Functions 113 Prototypes 114 Changing Built-in Prototypes 116 Adding Modern JavaScript to Older Browsers 117 Prototypes for Custom Data Types 118 How to Understand Constructor Functions and Prototypes 119 Object-Oriented Patterns 121 Namespacing 123 Local References 125 Chapter 7: The Global Object 126 Global Variables 127 Accidentally Creating Global Variables 128 Global Functions 129 Timers 129 setTimeout(func, delay) 129 setInterval(func, delay) 130 clearInterval(id), clearTimeout(id) 131 Chapter 8: Client-Side Scripting 134 Script Tags 135 Inline Scripts 135 Remote Scripts 135 Where to Include the Tag 136 The Browser Problem 138 Progressive Enhancement 139 Handling Non-JavaScript Situations 141 The Tag 141 JavaScript-Specific CSS Classes 142 Chapter 9: Browsers and Windows 144 Properties 145 Global Functions 146 Dialog Boxes 146 Manipulating Browser Windows 147 The history Object 149 The location Object 149 Cookies 150 Setting Cookies 150 Reading Cookies 152 Deleting Cookies 153 The navigator Object 153 Chapter 10: The DOM 156 Nodes 157 Node Collections 157 Node Trees 158 Node Properties 160 nodeName 160 nodeType 161 nodeValue 161 Walking the DOM 162 Starting with document 162 Managing Whitespace 164 children 165 Finding Nodes 166 getElementById(domId) 166 getElementsByTagName(name) 166 getElementsByClassName(name) 166 querySelector(selector) 168 querySelectorAll(selector) 169 Creating Nodes 169 Using DOM Methods 169 createElement(tagName) 169 createTextNode(nodeValue) 170 cloneNode(deep) 170 Using innerHTML 171 Using Document Fragments 172 Adding, Removing, and Reordering Nodes 172 appendChild(node) 173 insertBefore(node, reference) 173 removeChild(childNode) 173 Utility Functions 173 Inspecting and Changing Elements 176 Attributes 176 Calculated Attribute Values 177 Special Properties 179 Element Styles 181 The class Attribute 181 The style Attribute 183 Computed Styles 184 Chapter 11: Events 186 Event Attributes 187 Return Values 188 Event Attribute Method Context 188 Multiple Event Handlers 189 Event Methods 190 addEventListener(eventType, handler, capture) 191 removeEventListener(eventType, handler, capture) 191 The Event Object 193 Properties 193 Methods 193 Event Bubbling and Capturing 194 Bubbling 195 Capturing 196 Stop Propagation 198 Event Delegation 198 Event Examples 200 Browser Events 200 load 200 unload 200 beforeunload 201 resize 201 DOMContentLoaded 202 Mouse Events 202 click 203 mousedown, mouseup 204 dblclick 204 mouseover, mouseout 205 mouseenter, mouseleave 206 Keyboard Events 207 keydown 207 keypress 207 keyup 208 Form Element Events 209 change 210 submit 210 Other Events 210 focus 210 blur 211 Chapter 12: Libraries 212 Choosing a Library 213 Using Libraries with This Book 215 jQuery 216 Coding with jQuery 216 jQuery Objects 217 jQuery Utilities 218 jQuery UI 219 YUI [(sub)3] 219 Coding with YUI [(sub)3] 219 YUI [(sub)3] Gallery 221 MooTools 221 Coding with MooTools 221 Namespacing 222 MooTools More 222 Chapter 13: Image Slideshow 224 Debugging Your Code 225 Slideshow Ingredients 226 Slideshow HTML 227 Slideshow CSS 229 Slideshow JavaScript 230 Creating the Slideshow Images 231 Centering the Images 233 The Slideshow Code 235 Slideshow Controls 236 jQuery Glossary 239 The jQuery Function: $() 239 jQuery Object Methods 239 Chapter 14: Drop-Down Menus 242 Menu HTML 243 Menu Markup 244 Menu CSS 245 Progressive Enhancement 246 Menu JavaScript 248 MooTools Constructor Functions 249 Arrays in MooTools 250 Event Handlers in MooTools Classes 250 Showing and Hiding Submenus 253 Clicking Outside the Menus 255 Extending the Menu Class 256 Overriding Inherited Methods 258 Using MooTools Effects 258 MooTools Glossary 262 Element Utilities 262 Element Methods 262 Array Utilities 263 Function Utilities 263 Chapter 15: Ajax 264 Ajax Considerations 265 Servers 265 Same-Origin Policy 265 Data Formats 265 User Experience 266 Ajax Example 267 Setup 268 Data File 268 Controller File 269 Reading Data from the File 270 Get the Page Number from the Query String 270 Saving Form Data to the File 271 Arrange the Data Just for the Page 272 Send JSON for Ajax Requests 272 Send an HTML Template for Normal Page Requests 272 The HTML Template 273 HTML Page Outline 273 Data Table Markup 274 Navigation Links 275 Form Markup 275 Checking Your Work 276 Ajaxifying the Page 276 Script Outline 276 Overriding the Previous and Next Links 277 Waiting for the Request to Load 277 Error Handling 278 Handling the Response 278 Updating the User Interface 280 Overriding the Form 282 Getting Around the Same-Origin Policy 283 Proxies 283 JSON-P 283 Chapter 16: Animation 286 Simple Animation 287 Time-Based Animation 289 Easing 292 Animation with Libraries 294 YUI [(sub)3] Animation Objects 295 The jQuery animate() Method 296 Resetting Animation 297 Using Animation 298 Index 300 A 301 B 301 C 302 D 303 E 304 F 305 G 305 H 306 I 306 J 306 K 307 L 307 M 307 N 308 O 308 P 309 Q 310 R 310 S 310 T 311 U 312 V 312 W 312 X 312 Y 312 Z 312 Cover......Page 1 Contents......Page 6 Introduction......Page 18 Why JavaScript Is Cool......Page 19 What’s in This Book......Page 20 Resources......Page 21 Comments......Page 22 Reserved Words......Page 23 Firebug......Page 25 Chapter 1: JavaScript Basics......Page 28 Expressions and Statements......Page 29 Variables and Data......Page 30 Values......Page 31 Comparison......Page 32 Truthiness and Falsiness......Page 33 Functions and Objects......Page 35 Objects......Page 36 Loops......Page 37 if/if-else/else......Page 38 switch/case......Page 39 throw......Page 40 break and continue......Page 41 Logical NOT: !......Page 42 Logical AND: &&......Page 43 Logical OR: ||......Page 44 Combining Boolean Operators......Page 45 Ternary Expressions......Page 46 Chapter 2: Numbers......Page 48 Basic Math......Page 49 Number Formats......Page 51 The Math Object......Page 52 Conversion......Page 53 Number Precision......Page 56 Chapter 3: Strings......Page 58 Operators......Page 59 Methods......Page 60 charAt(x), charCodeAt(x)......Page 61 slice(x[, y])......Page 62 Converting Strings to Arrays: split([delimiter, limit])......Page 63 indexOf(substring[, start])......Page 64 lastIndexOf(substring[, start])......Page 66 replace(pattern, replacement)......Page 67 escape(string), unescape(string)......Page 69 encodeURIComponent(string), decodeURIComponent(string)......Page 70 Chapter 4: Arrays......Page 72 Properties......Page 73 Looping Over Arrays......Page 74 forEach(loopFunc)......Page 75 Adding Items to Arrays......Page 76 unshift(x[,y,z ...])......Page 77 Extracting Items from Arrays......Page 78 splice(start[, length, newValue ...])......Page 79 Ordering Arrays......Page 80 sort([func])......Page 81 join([delimiter])......Page 82 toString()......Page 83 Chapter 5: Functions......Page 84 Expressions......Page 85 Self-invoking Functions......Page 86 Arguments......Page 87 Default Values for Arguments......Page 88 Objects as Arguments......Page 90 Return Values......Page 92 Functions as Methods......Page 93 Context Binding......Page 95 Closures......Page 97 Recursion......Page 101 Caching......Page 102 Memoization......Page 104 Chapter 6: Objects......Page 106 Basics......Page 107 Looping Over Properties......Page 108 Enumerable Properties......Page 110 Deleting Properties......Page 112 Constructor Functions......Page 113 Prototypes......Page 114 Changing Built-in Prototypes......Page 116 Adding Modern JavaScript to Older Browsers......Page 117 Prototypes for Custom Data Types......Page 118 How to Understand Constructor Functions and Prototypes......Page 119 Object-Oriented Patterns......Page 121 Namespacing......Page 123 Local References......Page 125 Chapter 7: The Global Object......Page 126 Global Variables......Page 127 Accidentally Creating Global Variables......Page 128 setTimeout(func, delay)......Page 129 setInterval(func, delay)......Page 130 clearInterval(id), clearTimeout(id)......Page 131 Chapter 8: Client-Side Scripting......Page 134 Remote Scripts......Page 135 Where to Include the Tag......Page 136 The Browser Problem......Page 138 Progressive Enhancement......Page 139 The Tag......Page 141 JavaScript-Specific CSS Classes......Page 142 Chapter 9: Browsers and Windows......Page 144 Properties......Page 145 Dialog Boxes......Page 146 Manipulating Browser Windows......Page 147 The location Object......Page 149 Setting Cookies......Page 150 Reading Cookies......Page 152 The navigator Object......Page 153 Chapter 10: The DOM......Page 156 Node Collections......Page 157 Node Trees......Page 158 nodeName......Page 160 nodeValue......Page 161 Starting with document......Page 162 Managing Whitespace......Page 164 children......Page 165 getElementsByClassName(name)......Page 166 querySelector(selector)......Page 168 createElement(tagName)......Page 169 cloneNode(deep)......Page 170 Using innerHTML......Page 171 Adding, Removing, and Reordering Nodes......Page 172 Utility Functions......Page 173 Attributes......Page 176 Calculated Attribute Values......Page 177 Special Properties......Page 179 The class Attribute......Page 181 The style Attribute......Page 183 Computed Styles......Page 184 Chapter 11: Events......Page 186 Event Attributes......Page 187 Event Attribute Method Context......Page 188 Multiple Event Handlers......Page 189 Event Methods......Page 190 removeEventListener(eventType, handler, capture)......Page 191 Methods......Page 193 Event Bubbling and Capturing......Page 194 Bubbling......Page 195 Capturing......Page 196 Event Delegation......Page 198 unload......Page 200 resize......Page 201 Mouse Events......Page 202 click......Page 203 dblclick......Page 204 mouseover, mouseout......Page 205 mouseenter, mouseleave......Page 206 keypress......Page 207 keyup......Page 208 Form Element Events......Page 209 focus......Page 210 blur......Page 211 Chapter 12: Libraries......Page 212 Choosing a Library......Page 213 Using Libraries with This Book......Page 215 Coding with jQuery......Page 216 jQuery Objects......Page 217 jQuery Utilities......Page 218 Coding with YUI [(sub)3]......Page 219 Coding with MooTools......Page 221 MooTools More......Page 222 Chapter 13: Image Slideshow......Page 224 Debugging Your Code......Page 225 Slideshow Ingredients......Page 226 Slideshow HTML......Page 227 Slideshow CSS......Page 229 Slideshow JavaScript......Page 230 Creating the Slideshow Images......Page 231 Centering the Images......Page 233 The Slideshow Code......Page 235 Slideshow Controls......Page 236 jQuery Object Methods......Page 239 Chapter 14: Drop-Down Menus......Page 242 Menu HTML......Page 243 Menu Markup......Page 244 Menu CSS......Page 245 Progressive Enhancement......Page 246 Menu JavaScript......Page 248 MooTools Constructor Functions......Page 249 Event Handlers in MooTools Classes......Page 250 Showing and Hiding Submenus......Page 253 Clicking Outside the Menus......Page 255 Extending the Menu Class......Page 256 Using MooTools Effects......Page 258 Element Methods......Page 262 Function Utilities......Page 263 Chapter 15: Ajax......Page 264 Data Formats......Page 265 User Experience......Page 266 Ajax Example......Page 267 Data File......Page 268 Controller File......Page 269 Get the Page Number from the Query String......Page 270 Saving Form Data to the File......Page 271 Send an HTML Template for Normal Page Requests......Page 272 HTML Page Outline......Page 273 Data Table Markup......Page 274 Form Markup......Page 275 Script Outline......Page 276 Waiting for the Request to Load......Page 277 Handling the Response......Page 278 Updating the User Interface......Page 280 Overriding the Form......Page 282 JSON-P......Page 283 Chapter 16: Animation......Page 286 Simple Animation......Page 287 Time-Based Animation......Page 289 Easing......Page 292 Animation with Libraries......Page 294 YUI [(sub)3] Animation Objects......Page 295 The jQuery animate() Method......Page 296 Resetting Animation......Page 297 Using Animation......Page 298 Index......Page 300 B......Page 301 C......Page 302 D......Page 303 E......Page 304 G......Page 305 J......Page 306 M......Page 307 O......Page 308 P......Page 309 S......Page 310 T......Page 311 Z......Page 312