[PDF] JavaScript-for-Absolute-Beginners.pdf

View - Download JavaScript-for-Absolute-Beginners.pdf

Previous PDF

Next PDF

JavaScript

for

Absolute Beginners

Companion

eBook Available7.5 x 9.25 spine = 0.9375" 504 page count

THE EXPERT"S VOICE

IN WEB DEVELOPMENT

Terry McNavage

Learn to write effective JavaScript

code from scratch

McNavage

this print for content only—size & color not accurate CYAN

MAGENTA

YELLOW

BLACK

PANTONE 123 C

BOOKS FOR PROFESSIONALS BY PROFESSIONALS

JavaScript for Absolute Beginners

Dear Reader,

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 friendly, conversational style for web designers new to both JavaScript and pro- gramming. I assume a familiarity with HTML and CSS, but nothing more. I"m also aware that just passively staring at code samples in a book is no way to learn how to program. So, as we explore ECMAScript, a standard defining JavaScript"s core syn- 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 techniques you"re learning work in the real world. All this will be done in the safe- ty of the JavaScript console of Firebug, a free add-on to Firefox for PC, Mac, or Linux. Then in the last two chapters of the book, you"ll leave the nest and hand- code a real-world application in your preferred text editor. That application will 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 data encoded JSON, XML, and HTML, or by dynamic script insertion and JSON with Padding (JSON-P). Don"t worry if that sounds a bit bewildering now, it"ll all make sense soon enough! Finally, you"ll make your script snappier, by incorporating leading-edge optimizations, such as advance conditional definition, lazy loaders, reverse loops, closure, minimizing reflows, and thread yielding. And even some new 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 pocket that employers crave.

Terry McNavage

US $29.99

Shelve in

Web Development\JavaScript

User level:

Beginner

SOURCE

CODE

ONLINECompanion eBook

See last page for details

on $10 eBook version

ISBN 978-1-4302-7219-9

978143027219952999

THE APRESS ROADMAP

Beginning

HTML5 and CSS3

Pro

JavaScript

with MootoolsPro

JavaScript RIA

Techniques

JavaScript

for Absolute Beginners for Absolute Beginners

JavaScriptwww.allitebooks.com

www.allitebooks.com i

JavaScript for

Absolute Beginners

Terry McNavage

www.allitebooks.com ii

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 (201) 348-4505, e-mail orders-ny@springer-

sbm.com, or visit www.springeronline.com. For information on translations, please e-mail rights@apress.com, 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. www.allitebooks.com iii To the Little Flower, St. Thérèse de Lisieux, for sending me this rose. www.allitebooks.com iv

Contents at a Glance

Contents ................................................................................................................ v

About the Author ................................................................................................ xiii

About the Technical Reviewers .......................................................................... xiv

Acknowledgments ............................................................................................... xv

Preface ............................................................................................................... xvi

Chapter 1: Representing Data with Values ............................................................ 1

Chapter 2: Type Conversion ................................................................................ 25

Chapter 3: Operators ........................................................................................... 57

Chapter 4: Controlling Flow ................................................................................. 97

Chapter 5: Member Inheritance ........................................................................ 145

Chapter 6: Functions and Arrays ....................................................................... 181

Chapter 7: Traversing and Modifying the DOM Tree ......................................... 255

Chapter 8: Scripting CSS ................................................................................... 307

Chapter 9: Listening for Events ......................................................................... 347

Chapter 10: Scripting BOM ................................................................................ 399

Index ................................................................................................................. 461

www.allitebooks.com v

Contents

Contents at a Glance ............................................................................................ iv

About the Author ................................................................................................ xiii

About the Technical Reviewers .......................................................................... xiv

Acknowledgments ............................................................................................... xv

Preface ............................................................................................................... xvi

Chapter 1: Representing Data with Values ............................................................ 1

What Are Value Types? ................................................................................................... 1

Creating a String Literal .................................................................................................. 2

Commenting Code .................................................................................................................................. 2

Gluing Strings Together with the + Operator ......................................................................................... 3

Creating a Number Literal ............................................................................................... 4

Creating a Boolean Literal ............................................................................................... 5

Naming a Value with an Identifier ................................................................................... 6

Can I Name a Variable Anything I Want? ................................................................................................ 6

Some Valid Identifiers Are Already Taken .............................................................................................. 7

Creating an Object Literal ............................................................................................... 9

Naming Members with Identifiers ........................................................................................................ 12

Creating an Array Literal ............................................................................................... 14

Creating a Function Literal ............................................................................................ 19

Summary ....................................................................................................................... 23

www.allitebooks.com ? CONTENTS vi

?Chapter 2: Type Conversion ................................................................................ 25

String Members ............................................................................................................ 25

Determining the Number of Characters ............................................................................................... 30

Decoding or Encoding Characters ........................................................................................................ 31

Converting Case ................................................................................................................................... 33

Locating a Substring ............................................................................................................................ 35

Clipping a Substring ............................................................................................................................. 36

Replacing a Substring .......................................................................................................................... 37

Splitting a String into an Array of Smaller Strings ............................................................................... 39

Searching with Regular Expressions ................................................................................................... 43

Explicitly Creating Wrappers ......................................................................................... 43

Converting a Value to Another Type .............................................................................. 44

Converting a Value to a Number .......................................................................................................... 46

Converting a Value to a String ............................................................................................................. 50

Putting Off Learning RegExp Syntax .................................................................................................... 53

Summary ....................................................................................................................... 56

?Chapter 3: Operators ........................................................................................... 57

Introducing Operator Precedence and Associativity ..................................................... 57

Using JavaScript Operators .......................................................................................... 60

Combining Math and Assignment Operations ...................................................................................... 61

Incrementing or Decrementing Values ................................................................................................. 66

Testing for Equality .............................................................................................................................. 68

Testing for Inequality ........................................................................................................................... 70

Comparing Objects, Arrays, and Functions .......................................................................................... 72

Determining Whether One Number or String Is Greater Than Another ................................................ 74

Determining Whether One Number or String Is Less Than Another ..................................................... 77

Greater Than or Equal to, Less Than or Equal to .................................................................................. 78

Creating More Complex Comparisons .................................................................................................. 81

Saying or With || ................................................................................................................................... 83

Saying andŽ with && .......................................................................................................................... 84www.allitebooks.com

? CONTENTS

vii Chaining || Expressions ........................................................................................................................ 85

Chaining && Expressions ..................................................................................................................... 87

Chaining || and && Expressions ........................................................................................................... 89

Conditionally Returning One of Two Values ......................................................................................... 90

Making Two Expressions Count as One ............................................................................................... 93

Deleting a Member, Element, or Variable ............................................................................................ 94

Summary ....................................................................................................................... 95

?Chapter 4: Controlling Flow ................................................................................. 97

Writing an if Condition .................................................................................................. 98

Appending an else Clause .................................................................................................................. 100

To Wrap or Not to Wrap ...................................................................................................................... 101

Coding Several Paths with the else if Idiom ....................................................................................... 102

Controlling Flow with Conditional Expressions .................................................................................. 105

Taking One of Several Paths with a Switch ................................................................ 107

Writing a while Loop ................................................................................................... 115

Aborting an Iteration but Not the Loop ............................................................................................... 118

Replacing Break with Return in a Function ........................................................................................ 120

Writing a do while loop ............................................................................................... 122

Writing a for Loop ....................................................................................................... 125

Enumerating Members with a for in Loop ................................................................... 127

Snappier Conditionals ................................................................................................. 129

Snappier Loops ........................................................................................................... 136

Summary ..................................................................................................................... 144

?Chapter 5: Member Inheritance ........................................................................ 145

Creating Objects with a Constructor ........................................................................... 145

Classical Inheritance ................................................................................................... 149

Determining Which Type or Types an Object Is an Instance Of ......................................................... 156

Inherited Members Are Shared Not Copied ........................................................................................ 158

Modifying New and Past Instances of a Type .................................................................................... 160www.allitebooks.com

? CONTENTS

viii Sharing a Prototype but Forgoing the Chain ...................................................................................... 163

Adding an Empty Chain Link .............................................................................................................. 166

Stealing a Constructor ....................................................................................................................... 169

Prototypal Inheritance ................................................................................................. 171

Cloning Members ........................................................................................................ 174

Mixins .......................................................................................................................... 176

Summary ..................................................................................................................... 179

?Chapter 6: Functions and Arrays ....................................................................... 181

Why Use Functions? .................................................................................................... 181

Functions Are Values .................................................................................................. 183

Function Members ...................................................................................................... 184

Conditional Advance Loading ...................................................................................... 185

Writing Object.defineProperty() .......................................................................................................... 186

Writing Object.defineProperties() ....................................................................................................... 187

Writing Object.create() ....................................................................................................................... 188

Using the new Functions .................................................................................................................... 189

Lazy Loading ............................................................................................................... 194

Recursion .................................................................................................................... 198

Borrowing Methods with apply() or call() .................................................................... 201

Overriding toString() ........................................................................................................................... 201

Testing for an Array ........................................................................................................................... 204

Rewriting cloneMembers() ................................................................................................................. 206

Currying ...................................................................................................................... 208

Chaining Methods ....................................................................................................... 212

Closure and Returning Functions ................................................................................ 216

Passing a Configuration Object ................................................................................... 222

Callback Functions ...................................................................................................... 223

Memoization ............................................................................................................... 224www.allitebooks.com

? CONTENTS ix

Global Abatement with Modules ................................................................................. 226

Arrays .......................................................................................................................... 228

Plucking Elements from an Array ....................................................................................................... 229

Adding Elements to an Array .............................................................................................................. 233

Gluing Two Arrays Together ............................................................................................................... 235

Reversing the Elements in an Array ................................................................................................... 237

Sorting the Elements in an Array ....................................................................................................... 238

Creating a String from an Array ......................................................................................................... 243

Taking a Slice of an Array .................................................................................................................. 244

Converting a Read-only Array-like Object to an Array ....................................................................... 245

Inserting or Deleting Elements from an Array .................................................................................... 249

Summary ..................................................................................................................... 253

?Chapter 7: Traversing and Modifying the DOM Tree ......................................... 255

DOM Tree .................................................................................................................... 255

Is Every Node the Same? ................................................................................................................... 256

Interfaces Are Sensibly Named .......................................................................................................... 257

Querying the DOM Tree ...................................................................................................................... 257

Same Jargon as for a Family Tree ..................................................................................................... 260

Traversing the DOM Tree ................................................................................................................... 260

Descending with childNodes .............................................................................................................. 260

Ascending with parentNode ............................................................................................................... 262

Muddying the Waters with Whitespace ............................................................................................. 263

Coding Cascade Style ........................................................................................................................ 264

Moving Laterally ................................................................................................................................. 268

Converting a NodeList to an Array ..................................................................................................... 271

Converting a NodeList to an Array for Internet Explorer .................................................................... 273

Traversing the DOM without childNodes ............................................................................................ 275

Finding an Element by ID ................................................................................................................... 277

Finding Elements by Their Tag Names ............................................................................................... 278

Finding Elements by Class ................................................................................................................. 279

? CONTENTS x

Querying Attributes Like a Member .111111111111111111111111111111111111111111111111111111111111111111111111

111111111111111111111111111 281

Querying Attributes with Methods .111111111111111111111111111111111111111111111111111111111111111111111111

11111111111111111111111111111 282

Querying Attr Nodes .111111111111111111111111111111111111111111111111111111111111111111111111

1111111111111111111111111111111111111111111111111111 285

Enumerating Attributes for an Element .111111111111111111111111111111111111111111111111111111111111111111111111

1111111111111111111111 286

Creating Ele

m ent or Text Nodes .111111111111111111111111111111111111111111111111111111111111111111111111

11111111111111111111111111111111 288

Deleting Content .111111111111111111111111111111111111111111111111111111111111111111111111

111111111111111111111111111111111111111111111111111111111 292

Copying Content .111111111111111111111111111111111111111111111111111111111111111111111111

1111111111111111111111111111111111111111111111111111111111 293

Creating Ele

m

ents with a Helper Function .111111111111111111111111111111111111111111111111111111111111111111111111

11111111111111111 294

Reordering Nested Lists . 296

W here Did the For m a tting Text Nodes Go? .111111111111111111111111111111111111111111111111111111111111111111111111

1111111111111111 302

Summary .111111111111111111111111111111111111111111111111111111111111111111111111

1111111111111111111111111111111111111111111 304

?Chapter 8: Scripting CSS ......................................................................... ......... 307

DOM Interfaces for Working with CSS .11111111111111111111111111111111111111111111111111111111111111111111111 307

Clarifying Some CSS Jargon .111111111111111111111111111111111111111111111111111111111111111111111111

11111111111111 308

Ho

w Does JavaScript Represent a Rule? .111111111111111111111111111111111111111111111111111111111111111111111111

1111111111111111111 308

Two Other Declaration Blobs .111111111111111111111111111111111111111111111111111111111111111111111111

1111111111111111111111111111111111111 310

Downloading the Sample Files .111111111111111111111111111111111111111111111111111111111111111111111111

111111111 310

Querying a Style Attribute .111111111111111111111111111111111111111111111111111111111111111111111111

11111111111111111 313

Scripting Classes .111111111111111111111111111111111111111111111111111111111111111111111111

111111111111111111111111111111 318

Scripting Rules .111111111111111111111111111111111111111111111111111111111111111111111111

1111111111111111111111111111111111 320

Scripting Imported Style Sheets .111111111111111111111111111111111111111111111111111111111111111111111111

1111111 326

Adding or Deleting a Rule .111111111111111111111111111111111111111111111111111111111111111111111111

11111111111111111 327

Adding a Rule to a

Style Shee

t .111111111111111111111111111111111111111111111111111111111111111111111111

11111111111111111111111111111111111 328

Deleting a Rule fro

m a Style Sheet .111111111111111111111111111111111111111111111111111111111111111111111111

1111111111111111111111111111 332

Querying Overall Styles from the Cascade .1111111111111111111111111111111111111111111111111111111111111111 334

Enabling and Disabling Style Sheets .111111111111111111111111111111111111111111111111111111111111111111111111

338

Including or Importing Style Sheets .111111111111111111111111111111111111111111111111111111111111111111111111

11 339

Embedding a Style Sheet .111111111111111111111111111111111111111111111111111111111111111111111111

111111111111111111 344

Summary .111111111111111111111111111111111111111111111111111111111111111111111111

1111111111111111111111111111111111111111111 345

? CONTENTS xi

?Chapter 9: Listening for Events ......................................................................... 347

Working with the Event Object .................................................................................... 347

Downloading Project Files .......................................................................................... 348

Advance Conditional Loading ...................................................................................... 351

Telling JavaScript to Stop Listening for an Event ....................................................... 353

Preventing Default Actions from Taking Place ............................................................ 353

Preventing an Event from Traversing the DOM Tree ................................................... 355

Writing Helper Functions ............................................................................................. 356

Crawling the DOM Tree ...................................................................................................................... 356

Finding an Element by Class .............................................................................................................. 358

Testing for getElementsByClassName() ............................................................................................. 360

Querying the Cascade ........................................................................................................................ 362

Sliding Sprites ............................................................................................................. 364

Preparing the Ground ......................................................................................................................... 365

Moving the Sprites ............................................................................................................................. 368

Snappier Sprites ................................................................................................................................ 370

Drag-and-Drop Behavior ............................................................................................. 375

Writing the Mousedown Event Listener ............................................................................................. 375

Writing the Mousemove Event Listener ............................................................................................. 378

Writing the Mouseup Event Listener .................................................................................................. 380

The doZ() Helper Function .................................................................................................................. 382

Prepping the Drag .............................................................................................................................. 383

Swapping Skins by Key ............................................................................................... 390

Initiating Behaviors When the DOM Tree Is Available ................................................. 395

Fighting Global Evil ..................................................................................................... 395

Summary ..................................................................................................................... 396

?Chapter 10: Scripting BOM ................................................................................ 399

Downloading the Project Files .................................................................................... 399

Remembering Visitor Data with Cookies ..................................................................... 401

? CONTENTS

xii Getting the Users Preference ............................................................................................................ 401

Setting the Users Skin Preference .................................................................................................... 403

Setting the Users Preference ............................................................................................................ 404

Animating with Timers ................................................................................................ 407

Preparing the Scrollers ...................................................................................................................... 407

Adding the Press Event Listener ........................................................................................................ 410

Writing the Animation Function .......................................................................................................... 411

Using the Gallery ................................................................................................................................ 413

Writing Dynamic Pages Using Ajax ............................................................................. 421

Testing XMLHttpRequest from Your Local File System ...................................................................... 422

Creating Tree Branches with createElem() ........................................................................................ 422

Asynchronously Requesting Data ...................................................................................................... 425

Parsing an HTML Response ............................................................................................................... 427

Parsing an XML Response .................................................................................................................. 431

Parsing Simple XML ........................................................................................................................... 435

Parsing JSON ..................................................................................................................................... 439

Yielding with Timers ................................................................................................... 449

Converting function declarations to expressions ........................................................ 450

Summary ..................................................................................................................... 458

?Index ................................................................................................................. 461

xiii

About the Author

? Terry McNavage, www.popwebdesign.com, has been hand-coding JavaScript for 12 years. In addition to

being a JavaScript wizard, he has expertise in creative design, XHTML, CSS, PHP, Perl, and MySQL. Terry

is an elite runner, too. For the past 14 years he has run 100 or more miles per week over the hilly terrain

of Pittsburgh. He is also a bit of a foodie. Though his Pirates have had 18 losing seasons in a row, Terry

remains hopeful they'll raise the Jolly Roger more often than the white flag in 2011. ? CONTENTS xiv

About the Technical Reviewers

? Kristian Besley (pictured center) is a lead developer at Beetroot Design (www.beetrootdesign.co.uk) where he develops web applications, web sites, educational interactions, and games written mainly in various combinations of PHP, Flash, and JavaScript. He has been working with computers and the Web for far too long. He also spends far too much time hacking and developing for open source applications"including Moodle"so that they work just so. Health warning: he has an unhealthy obsession with making his applications super-RSS compatible and overly configurable. His past and current clients include the BBC, Pearson Education, Welsh Assembly Government, and

loads of clients with acronyms such as JISC, BECTA, MAWWFIRE, and"possibly his favorite of all (well,

just try saying it out loud)"SWWETN.

When he isnt working, hes working elsewhere lecturing in interactive media (at Gower College...

Swansea) or providing geeky technical assistance to a whole gamut of institutions or individuals in an

effort to save them time and money (at his own expense!). He has authored and coauthored a large number of books for friends of ED and Apress including the

Foundation Flash series, Flash MX Video, Flash ActionScript for Flash (with the wonderful David Powers),

and Flash MX Creativity. His words have also graced the pages of Computer Arts a few times too.

Kristian currently resides with his family in Swansea, Wales, and is a proud fluent Welsh speaker with a

passion for pushing the language on the Web and in bilingual web applications where humanly possible.

? Rob Drimmie is lucky. He has an amazing wife, two awesome kids, and a newquotesdbs_dbs12.pdfusesText_18

[PDF] javascript for beginners pdf

[PDF] javascript for dummies 2019

[PDF] javascript for dummies book

[PDF] javascript for dummies pdf 2018

[PDF] javascript for dummies review

[PDF] javascript for illustrator cs6

[PDF] javascript formulas pdf forms

[PDF] javascript graphical user interface

[PDF] javascript gui example

[PDF] javascript gui framework

[PDF] javascript html

[PDF] javascript image animation

[PDF] javascript implements class

[PDF] javascript implements clause

[PDF] javascript implements extends