You are previewing JavaScript for Absolute Beginners.
O'Reilly logo
JavaScript for Absolute Beginners

Book Description

Innovative JavaScript behaviors are the hallmark of Web 2.0 interface designs. Visit Apple, Facebook, Microsoft, or any other web titan, and you will find JavaScript implementations providing a smooth, tactile, engaging web experience. Knowledge of JavaScript is essential for developing modern, interactive, sticky web sites, but many beginners are put off by the daunting need to learn a programming language before they can achieve anything.

This book takes a practical approach by showing you how to use JavaScript in simple stages, starting with the basics of storing and manipulating data and moving on to reacting to events and using JavaScript to alter CSS and HTML on the fly. It assumes no prior knowledge of JavaScript, and avoids bombarding you with unnecessary technical details.

At the same time, it explains the main points and acts as a reference that you can come back to when you need to refresh your memory. More advanced concepts are introduced gradually, so that by the end of the book you'll have a solid understanding of all the main aspects of JavaScript. Particular attention is paid to debugging and avoiding common beginners' pitfalls, enabling you to create web sites that not only look good, but are dynamic and exciting for visitors.

  • Requires no previous knowledge of JavaScript

  • Gives you instant results—starts showing how to change values and react to events stage by stage

  • Doesn't bombard you with endless rules and jargon

Table of Contents

  1. Copyright
  2. About the Author
  3. About the Technical Reviewers
  4. Acknowledgments
  5. Preface
    1. Opening Firebug
    2. Enabling Firebug
    3. Command Line
    4. Command Editor
  6. 1. Representing Data with Values
    1. 1.1. What Are Value Types?
    2. 1.2. Creating a String Literal
      1. 1.2.1. Commenting Code
      2. 1.2.2. Gluing Strings Together with the + Operator
    3. 1.3. Creating a Number Literal
    4. 1.4. Creating a Boolean Literal
    5. 1.5. Naming a Value with an Identifier
      1. 1.5.1. Can I Name a Variable Anything I Want?
      2. 1.5.2. Some Valid Identifiers Are Already Taken
    6. 1.6. Creating an Object Literal
      1. 1.6.1. Naming Members with Identifiers
    7. 1.7. Creating an Array Literal
    8. 1.8. Creating a Function Literal
    9. 1.9. Summary
  7. 2. Type Conversion
    1. 2.1. String Members
      1. 2.1.1. Determining the Number of Characters
      2. 2.1.2. Decoding or Encoding Characters
      3. 2.1.3. Converting Case
      4. 2.1.4. Locating a Substring
      5. 2.1.5. Clipping a Substring
      6. 2.1.6. Replacing a Substring
      7. 2.1.7. Splitting a String into an Array of Smaller Strings
      8. 2.1.8. Searching with Regular Expressions
    2. 2.2. Explicitly Creating Wrappers
    3. 2.3. Converting a Value to Another Type
      1. 2.3.1. Converting a Value to a Number
      2. 2.3.2. Converting a Value to a String
        1. 2.3.2.1. Methods for Converting a Number to a String
      3. 2.3.3. Putting Off Learning RegExp Syntax
    4. 2.4. Summary
  8. 3. Operators
    1. 3.1. Introducing Operator Precedence and Associativity
    2. 3.2. Using JavaScript Operators
      1. 3.2.1. Combining Math and Assignment Operations
      2. 3.2.2. Incrementing or Decrementing Values
      3. 3.2.3. Testing for Equality
      4. 3.2.4. Testing for Inequality
      5. 3.2.5. Comparing Objects, Arrays, and Functions
      6. 3.2.6. Determining Whether One Number or String Is Greater Than Another
      7. 3.2.7. Determining Whether One Number or String Is Less Than Another
      8. 3.2.8. Greater Than or Equal to, Less Than or Equal to
      9. 3.2.9. Creating More Complex Comparisons
      10. 3.2.10. Saying or With ||
      11. 3.2.11. Saying "and" with &&
      12. 3.2.12. Chaining || Expressions
      13. 3.2.13. Chaining && Expressions
      14. 3.2.14. Chaining || and && Expressions
      15. 3.2.15. Conditionally Returning One of Two Values
      16. 3.2.16. Making Two Expressions Count as One
      17. 3.2.17. Deleting a Member, Element, or Variable
    3. 3.3. Summary
  9. 4. Controlling Flow
    1. 4.1. Writing an if Condition
      1. 4.1.1. Appending an else Clause
      2. 4.1.2. To Wrap or Not to Wrap
      3. 4.1.3. Coding Several Paths with the else if Idiom
      4. 4.1.4. Controlling Flow with Conditional Expressions
    2. 4.2. Taking One of Several Paths with a Switch
    3. 4.3. Writing a while Loop
      1. 4.3.1. Aborting an Iteration but Not the Loop
      2. 4.3.2. Replacing Break with Return in a Function
    4. 4.4. Writing a do while loop
    5. 4.5. Writing a for Loop
    6. 4.6. Enumerating Members with a for in Loop
    7. 4.7. Snappier Conditionals
    8. 4.8. Snappier Loops
    9. 4.9. Summary
  10. 5. Member Inheritance
    1. 5.1. Creating Objects with a Constructor
    2. 5.2. Classical Inheritance
      1. 5.2.1. Determining Which Type or Types an Object Is an Instance Of
      2. 5.2.2. Inherited Members Are Shared Not Copied
      3. 5.2.3. Modifying New and Past Instances of a Type
      4. 5.2.4. Sharing a Prototype but Forgoing the Chain
      5. 5.2.5. Adding an Empty Chain Link
      6. 5.2.6. Stealing a Constructor
    3. 5.3. Prototypal Inheritance
    4. 5.4. Cloning Members
    5. 5.5. Mixins
    6. 5.6. Summary
  11. 6. Functions and Arrays
    1. 6.1. Why Use Functions?
    2. 6.2. Functions Are Values
    3. 6.3. Function Members
    4. 6.4. Conditional Advance Loading
      1. 6.4.1. Writing Object.defineProperty()
      2. 6.4.2. Writing Object.defineProperties()
      3. 6.4.3. Writing Object.create()
      4. 6.4.4. Using the new Functions
    5. 6.5. Lazy Loading
    6. 6.6. Recursion
    7. 6.7. Borrowing Methods with apply() or call()
      1. 6.7.1. Overriding toString()
      2. 6.7.2. Testing for an Array
      3. 6.7.3. Rewriting cloneMembers()
    8. 6.8. Currying
    9. 6.9. Chaining Methods
    10. 6.10. Closure and Returning Functions
    11. 6.11. Passing a Configuration Object
    12. 6.12. Callback Functions
    13. 6.13. Memoization
    14. 6.14. Global Abatement with Modules
    15. 6.15. Arrays
      1. 6.15.1. Plucking Elements from an Array
      2. 6.15.2. Adding Elements to an Array
      3. 6.15.3. Gluing Two Arrays Together
      4. 6.15.4. Reversing the Elements in an Array
      5. 6.15.5. Sorting the Elements in an Array
      6. 6.15.6. Creating a String from an Array
      7. 6.15.7. Taking a Slice of an Array
      8. 6.15.8. Converting a Read-only Array-like Object to an Array
      9. 6.15.9. Inserting or Deleting Elements from an Array
    16. 6.16. Summary
  12. 7. Traversing and Modifying the DOM Tree
    1. 7.1. DOM Tree
      1. 7.1.1. Is Every Node the Same?
      2. 7.1.2. Interfaces Are Sensibly Named
      3. 7.1.3. Querying the DOM Tree
      4. 7.1.4. Same Jargon as for a Family Tree
      5. 7.1.5. Traversing the DOM Tree
      6. 7.1.6. Descending with childNodes
      7. 7.1.7. Ascending with parentNode
      8. 7.1.8. Muddying the Waters with Whitespace
      9. 7.1.9. Coding Cascade Style
      10. 7.1.10. Moving Laterally
      11. 7.1.11. Converting a NodeList to an Array
      12. 7.1.12. Converting a NodeList to an Array for Internet Explorer
      13. 7.1.13. Traversing the DOM without childNodes
      14. 7.1.14. Finding an Element by ID
      15. 7.1.15. Finding Elements by Their Tag Names
      16. 7.1.16. Finding Elements by Class
      17. 7.1.17. Querying Attributes Like a Member
      18. 7.1.18. Querying Attributes with Methods
      19. 7.1.19. Querying Attr Nodes
      20. 7.1.20. Enumerating Attributes for an Element
      21. 7.1.21. Creating Element or Text Nodes
      22. 7.1.22. Deleting Content
      23. 7.1.23. Copying Content
      24. 7.1.24. Creating Elements with a Helper Function
      25. 7.1.25. Reordering Nested Lists
      26. 7.1.26. Where Did the Formatting Text Nodes Go?
    2. 7.2. Summary
  13. 8. Scripting CSS
    1. 8.1. DOM Interfaces for Working with CSS
    2. 8.2. Clarifying Some CSS Jargon
      1. 8.2.1. How Does JavaScript Represent a Rule?
      2. 8.2.2. Two Other Declaration Blobs
    3. 8.3. Downloading the Sample Files
    4. 8.4. Querying a Style Attribute
    5. 8.5. Scripting Classes
    6. 8.6. Scripting Rules
    7. 8.7. Scripting Imported Style Sheets
    8. 8.8. Adding or Deleting a Rule
      1. 8.8.1. Adding a Rule to a Style Sheet
      2. 8.8.2. Deleting a Rule from a Style Sheet
    9. 8.9. Querying Overall Styles from the Cascade
    10. 8.10. Enabling and Disabling Style Sheets
    11. 8.11. Including or Importing Style Sheets
    12. 8.12. Embedding a Style Sheet
    13. 8.13. Summary
  14. 9. Listening for Events
    1. 9.1. Working with the Event Object
    2. 9.2. Downloading Project Files
    3. 9.3. Advance Conditional Loading
    4. 9.4. Telling JavaScript to Stop Listening for an Event
    5. 9.5. Preventing Default Actions from Taking Place
    6. 9.6. Preventing an Event from Traversing the DOM Tree
    7. 9.7. Writing Helper Functions
      1. 9.7.1. Crawling the DOM Tree
      2. 9.7.2. Finding an Element by Class
      3. 9.7.3. Testing for getElementsByClassName()
      4. 9.7.4. Querying the Cascade
    8. 9.8. Sliding Sprites
      1. 9.8.1. Preparing the Ground
      2. 9.8.2. Moving the Sprites
      3. 9.8.3. Snappier Sprites
    9. 9.9. Drag-and-Drop Behavior
      1. 9.9.1. Writing the Mousedown Event Listener
      2. 9.9.2. Writing the Mousemove Event Listener
      3. 9.9.3. Writing the Mouseup Event Listener
      4. 9.9.4. The doZ() Helper Function
      5. 9.9.5. Prepping the Drag
    10. 9.10. Swapping Skins by Key
    11. 9.11. Initiating Behaviors When the DOM Tree Is Available
    12. 9.12. Fighting Global Evil
    13. 9.13. Summary
  15. 10. Scripting BOM
    1. 10.1. Downloading the Project Files
    2. 10.2. Remembering Visitor Data with Cookies
      1. 10.2.1. Getting the User's Preference
      2. 10.2.2. Setting the User's Skin Preference
      3. 10.2.3. Setting the User's Preference
    3. 10.3. Animating with Timers
      1. 10.3.1. Preparing the Scrollers
      2. 10.3.2. Adding the Press Event Listener
      3. 10.3.3. Writing the Animation Function
      4. 10.3.4. Using the Gallery
        1. 10.3.4.1. Animating the Gallery
        2. 10.3.4.2. Swapping Sprites by ID or Class
    4. 10.4. Writing Dynamic Pages Using Ajax
      1. 10.4.1. Testing XMLHttpRequest from Your Local File System
      2. 10.4.2. Creating Tree Branches with createElem()
      3. 10.4.3. Asynchronously Requesting Data
      4. 10.4.4. Parsing an HTML Response
      5. 10.4.5. Parsing an XML Response
      6. 10.4.6. Parsing Simple XML
      7. 10.4.7. Parsing JSON
        1. 10.4.7.1. JSON in a Nutshell
        2. 10.4.7.2. Padding JSON
    5. 10.5. Yielding with Timers
    6. 10.6. Converting function declarations to expressions
    7. 10.7. Summary