JavaScript for Absolute Beginners (Getting Started)

505 Pages·2010·11.48 MB·English

by  Terry McNavage

CYAN YELLOW
MAGENTA BLACK
PANTONE 123 C
BOOKS FOR PROFESSIONALS BY PROFESSIONALS® THE EXPERT’S VOICE® IN WEB DEVELOPMENT
Companion
eBook
Available
JavaScript for Absolute Beginners
J
Dear Reader, a
v
Even though I’ve been hand-coding JavaScript for twelve years, I haven’t forgot-
ten what it’s like to be just starting out. With this in mind, I wrote this book in a a
friendly, conversational style for web designers new to both JavaScript and pro- S
gramming. I assume a familiarity with HTML and CSS, but nothing more. I’m
c
also aware that just passively staring at code samples in a book is no way to learn
JavaScript
how to program. r
So, as we explore ECMAScript, a standard defining JavaScript’s core syn- i
p
tax, and DOM, a standard providing features for working with HTML, CSS, and
events, you will enter and run hundreds of code snippets to see exactly how the t
techniques you’re learning work in the real world. All this will be done in the safe-
f
ty of the JavaScript console of Firebug, a free add-on to Firefox for PC, Mac, or o
Linux. Then in the last two chapters of the book, you’ll leave the nest and hand- r
code a real-world application in your preferred text editor. That application will
A
contain features like drag-and-drop, animated scrolling, sprites, and skin swap-
ping. Moreover, it will dynamically add five galleries either by way of Ajax and b
data encoded JSON, XML, and HTML, or by dynamic script insertion and JSON s Absolute Beginners
with Padding (JSON-P). Don’t worry if that sounds a bit bewildering now, it’ll all o for
make sense soon enough!
Finally, you’ll make your script snappier, by incorporating leading-edge l
u
optimizations, such as advance conditional definition, lazy loaders, reverse
loops, closure, minimizing reflows, and thread yielding. And even some new t
e
features from DOM3 and HTML5 that Explorer, Firefox, Safari, and Opera now
implement. So, by the end of the book, you will know how to hand-code ultra-
responsive interfaces. And you’ll have the kinds of JavaScript tools in your B
pocket that employers crave.
e
g
Terry McNavage
Companion eBook i Learn to write effective JavaScript
n
code from scratch
THE APRESS ROADMAP n
e
Pro Pro
JavaScript Beginning JavaScript RIA JavaScript
See last page for details for Absolute Beginners HTML5 and CSS3 Techniques with Mootools r
on $10 eBook version s
M
SOURCE CODE ONLINE c Terry McNavage
N
www.apress.com ISBN 978-1-4302-7219-9 a
52999 v
a
g
US $29.99 e
Shelve in
Web Development\JavaScript
User level:
9 781430 272199
Beginner
this print for content only—size & color not accurate 7.5 x 9.25 spine = 0.9375" 504 page count
>
m
o
ok.c
o
b
e
w
o
w
w.
w
w
<
ok
o
B
e
w!
o
W
m
o
d fr
a
o
nl
w
o
D
JavaScript for
Absolute Beginners

■ ■ ■
Terry McNavage

i
JavaScript for Absolute Beginners
Copyright © 2010 by Terry McNavage
All rights reserved. No part of this work may be reproduced or transmitted in any form or by any means,
electronic or mechanical, including photocopying, recording, or by any information storage or retrieval
system, without the prior written permission of the copyright owner and the publisher.
ISBN-13 (pbk): 978-1-4302-7219-9
ISBN-13 (electronic): 978-1-4302-7218-2
Printed and bound in the United States of America 9 8 7 6 5 4 3 2 1
Trademarked names, logos, and images may appear in this book. Rather than use a trademark symbol
with every occurrence of a trademarked name, logo, or image we use the names, logos, and images only
in an editorial fashion and to the benefit of the trademark owner, with no intention of infringement of
the trademark.
The use in this publication of trade names, trademarks, service marks, and similar terms, even if they are
not identified as such, is not to be taken as an expression of opinion as to whether or not they are subject
to proprietary rights.
President and Publisher: Paul Manning
Lead Editors: Ben Renow-Clarke, Matthew Moodie
Technical Reviewers: Kristian Besley, Rob Drimmie, Tom Barker
Editorial Board: Steve Anglin, Mark Beckner, Ewan Buckingham, Gary Cornell, Jonathan Gennick,
Jonathan Hassell, Michelle Lowman, Matthew Moodie, Duncan Parkes, Jeffrey Pepper, Frank
Pohlmann, Douglas Pundick, Ben Renow-Clarke, Dominic Shakeshaft, Matt Wade, Tom Welsh
Coordinating Editor: Mary Tobin
Copy Editor: Kim Wimpsett
Compositor: MacPS, LLC
Indexer: Toma Mulligan
Cover Designer: Anna Ishchenko
Distributed to the book trade worldwide by Springer Science+Business Media, LLC., 233 Spring Street,
6th Floor, New York, NY 10013. Phone 1-800-SPRINGER, fax [phone], e-mail orders-ny@springer-
sbm.com, or visit www.springeronline.com.
For information on translations, please e-mail [email protected], or visit www.apress.com.
Apress and friends of ED books may be purchased in bulk for academic, corporate, or promotional use.
eBook versions and licenses are also available for most titles. For more information, reference our
Special Bulk Sales–eBook Licensing web page at www.apress.com/info/bulksales.
The information in this book is distributed on an “as is” basis, without warranty. Although every
precaution has been taken in the preparation of this work, neither the author(s) nor Apress shall have
any liability to any person or entity with respect to any loss or damage caused or alleged to be caused
directly or indirectly by the information contained in this work.
ii
To the Little Flower, St. Thérèse de Lisieux, for sending me this rose.
iii
Contents at a Glance

■Contents ................................................................................................................ v(cid:1)
■About the Author ................................................................................................ xiii(cid:1)
■About the Technical Reviewers .......................................................................... xiv(cid:1)
■Acknowledgments ............................................................................................... xv(cid:1)
■Preface ............................................................................................................... xvi
■Chapter 1: Representing Data with Values ............................................................ 1(cid:1)
■Chapter 2: Type Conversion ................................................................................ 25(cid:1)
■Chapter 3: Operators ........................................................................................... 57(cid:1)
■Chapter 4: Controlling Flow ................................................................................. 97(cid:1)
■Chapter 5: Member Inheritance ........................................................................ 145(cid:1)
■Chapter 6: Functions and Arrays ....................................................................... 181(cid:1)
■Chapter 7: Traversing and Modifying the DOM Tree ......................................... 255(cid:1)
■Chapter 8: Scripting CSS ................................................................................... 307(cid:1)
■Chapter 9: Listening for Events ......................................................................... 347(cid:1)
■Chapter 10: Scripting BOM ................................................................................ 399(cid:1)
■Index ................................................................................................................. 461(cid:1)

iv
Contents

■Contents at a Glance ............................................................................................ iv(cid:1)
■About the Author ................................................................................................ xiii(cid:1)
■About the Technical Reviewers .......................................................................... xiv(cid:1)
■Acknowledgments ............................................................................................... xv(cid:1)
■Preface ............................................................................................................... xvi

■Chapter 1: Representing Data with Values ............................................................ 1(cid:1)
What Are Value Types? ................................................................................................... 1(cid:1)
Creating a String Literal .................................................................................................. 2(cid:1)
Commenting Code .................................................................................................................................. 2(cid:1)
Gluing Strings Together with the + Operator ......................................................................................... 3(cid:1)
Creating a Number Literal ............................................................................................... 4(cid:1)
Creating a Boolean Literal ............................................................................................... 5(cid:1)
Naming a Value with an Identifier ................................................................................... 6(cid:1)
Can I Name a Variable Anything I Want? ................................................................................................ 6(cid:1)
Some Valid Identifiers Are Already Taken .............................................................................................. 7(cid:1)
Creating an Object Literal ............................................................................................... 9(cid:1)
Naming Members with Identifiers ........................................................................................................ 12(cid:1)
Creating an Array Literal ............................................................................................... 14(cid:1)
Creating a Function Literal ............................................................................................ 19(cid:1)
Summary ....................................................................................................................... 23(cid:1)
(cid:1)
v
■ CONTENTS
■Chapter 2: Type Conversion ................................................................................ 25(cid:1)
String Members ............................................................................................................ 25(cid:1)
Determining the Number of Characters ............................................................................................... 30(cid:1)
Decoding or Encoding Characters ........................................................................................................ 31(cid:1)
Converting Case ................................................................................................................................... 33(cid:1)
Locating a Substring ............................................................................................................................ 35(cid:1)
Clipping a Substring ............................................................................................................................. 36(cid:1)
Replacing a Substring .......................................................................................................................... 37(cid:1)
Splitting a String into an Array of Smaller Strings ............................................................................... 39(cid:1)
Searching with Regular Expressions ................................................................................................... 43(cid:1)
Explicitly Creating Wrappers ......................................................................................... 43(cid:1)
Converting a Value to Another Type .............................................................................. 44(cid:1)
Converting a Value to a Number .......................................................................................................... 46(cid:1)
Converting a Value to a String ............................................................................................................. 50(cid:1)
Putting Off Learning RegExp Syntax .................................................................................................... 53(cid:1)
Summary ....................................................................................................................... 56(cid:1)
■Chapter 3: Operators ........................................................................................... 57(cid:1)
Introducing Operator Precedence and Associativity ..................................................... 57(cid:1)
Using JavaScript Operators .......................................................................................... 60(cid:1)
Combining Math and Assignment Operations ...................................................................................... 61(cid:1)
Incrementing or Decrementing Values ................................................................................................. 66(cid:1)
Testing for Equality .............................................................................................................................. 68(cid:1)
Testing for Inequality ........................................................................................................................... 70(cid:1)
Comparing Objects, Arrays, and Functions .......................................................................................... 72(cid:1)
Determining Whether One Number or String Is Greater Than Another ................................................ 74(cid:1)
Determining Whether One Number or String Is Less Than Another ..................................................... 77(cid:1)
Greater Than or Equal to, Less Than or Equal to .................................................................................. 78(cid:1)
Creating More Complex Comparisons .................................................................................................. 81(cid:1)
Saying or With || ................................................................................................................................... 83(cid:1)
Saying “and” with && .......................................................................................................................... 84(cid:1)
vi
■ CONTENTS
Chaining || Expressions ........................................................................................................................ 85(cid:1)
Chaining && Expressions ..................................................................................................................... 87(cid:1)
Chaining || and && Expressions ........................................................................................................... 89(cid:1)
Conditionally Returning One of Two Values ......................................................................................... 90(cid:1)
Making Two Expressions Count as One ............................................................................................... 93(cid:1)
Deleting a Member, Element, or Variable ............................................................................................ 94(cid:1)
Summary ....................................................................................................................... 95(cid:1)
■Chapter 4: Controlling Flow ................................................................................. 97(cid:1)
Writing an if Condition .................................................................................................. 98(cid:1)
Appending an else Clause .................................................................................................................. 100(cid:1)
To Wrap or Not to Wrap ...................................................................................................................... 101(cid:1)
Coding Several Paths with the else if Idiom ....................................................................................... 102(cid:1)
Controlling Flow with Conditional Expressions .................................................................................. 105(cid:1)
Taking One of Several Paths with a Switch ................................................................ 107(cid:1)
Writing a while Loop ................................................................................................... 115(cid:1)
Aborting an Iteration but Not the Loop ............................................................................................... 118(cid:1)
Replacing Break with Return in a Function ........................................................................................ 120(cid:1)
Writing a do while loop ............................................................................................... 122(cid:1)
Writing a for Loop ....................................................................................................... 125(cid:1)
Enumerating Members with a for in Loop ................................................................... 127(cid:1)
Snappier Conditionals ................................................................................................. 129(cid:1)
Snappier Loops ........................................................................................................... 136(cid:1)
Summary ..................................................................................................................... 144(cid:1)
■Chapter 5: Member Inheritance ........................................................................ 145(cid:1)
Creating Objects with a Constructor ........................................................................... 145(cid:1)
Classical Inheritance ................................................................................................... 149(cid:1)
Determining Which Type or Types an Object Is an Instance Of ......................................................... 156(cid:1)
Inherited Members Are Shared Not Copied ........................................................................................ 158(cid:1)
Modifying New and Past Instances of a Type .................................................................................... 160(cid:1)
vii
■ CONTENTS
Sharing a Prototype but Forgoing the Chain ...................................................................................... 163(cid:1)
Adding an Empty Chain Link .............................................................................................................. 166(cid:1)
Stealing a Constructor ....................................................................................................................... 169(cid:1)
Prototypal Inheritance ................................................................................................. 171(cid:1)
Cloning Members ........................................................................................................ 174(cid:1)
Mixins .......................................................................................................................... 176(cid:1)
Summary ..................................................................................................................... 179(cid:1)
■Chapter 6: Functions and Arrays ....................................................................... 181(cid:1)
Why Use Functions? .................................................................................................... 181(cid:1)
Functions Are Values .................................................................................................. 183(cid:1)
Function Members ...................................................................................................... 184(cid:1)
Conditional Advance Loading ...................................................................................... 185(cid:1)
Writing Object.defineProperty() .......................................................................................................... 186(cid:1)
Writing Object.defineProperties() ....................................................................................................... 187(cid:1)
Writing Object.create() ....................................................................................................................... 188(cid:1)
Using the new Functions .................................................................................................................... 189(cid:1)
Lazy Loading ............................................................................................................... 194(cid:1)
Recursion .................................................................................................................... 198(cid:1)
Borrowing Methods with apply() or call() .................................................................... 201(cid:1)
Overriding toString() ........................................................................................................................... 201(cid:1)
Testing for an Array ........................................................................................................................... 204(cid:1)
Rewriting cloneMembers() ................................................................................................................. 206(cid:1)
Currying ...................................................................................................................... 208(cid:1)
Chaining Methods ....................................................................................................... 212(cid:1)
Closure and Returning Functions ................................................................................ 216(cid:1)
Passing a Configuration Object ................................................................................... 222(cid:1)
Callback Functions ...................................................................................................... 223(cid:1)
Memoization ............................................................................................................... 224(cid:1)
viii