LEARNING JAVASCRIPT - Lexical Structure (JAVASCRIPT TUTORIAL)

1. WELCOME
1. INTRODUCTION  1 - 2 - 3
2. FIRST PROGRAM
2. BASICS
1. PLACING THE CODE  1 2
2. Lexical Structure
1. RESERVED WORDS
3. VARIABLES AND TYPES

NUMBERS ● STRINGS ● DATES ● ARRAYS

4. OPERATORS
5. CONTROL STRUCTURES
6. FUNCTIONS AND OBJECTS
7. EVENT HANDLING
8. REGULAR EXPRESSIONS
2. ADVANCED TOPICS
1. OBJECT ORIENTED PROGRAMMING
1. CONSTRUCTORS AND PROTOTYPES
2. INHERITANCE
3. ACCESS CONTROL
2. FUNCTIONAL PROGRAMMING IN JAVASCRIPT
1. FUNCTION OBJECTS
2. ANONYMOUS FUNCTIONS
3. CLOSURES
4. HIGHER ORDER FUNCTIONS
3. MODULAR JAVASCRIPT
1. MODULES
2. NAMESPACES
4. OPTIMIZATION
5. METAPROGRAMMING
6. BOOKMARKLETS
3. DEBUGGING
1. JAVASCRIPT DEBUGGERS
2. COMMON MISTAKES
3. DEBUGGING METHODS
4. BROWSER BUGS
4. DYNAMIC WEB CLIENT PROGRAMMING (DHTML)
1. RUNTIME DOCUMENT MANIPULATION
1. INTRODUCTION TO THE DOCUMENT OBJECT MODEL (DOM)
2. FINDING ELEMENTS
3. ADDING ELEMENTS
4. CHANGING ELEMENTS
5. CHANGING ELEMENT STYLES
6. REMOVING ELEMENTS
2. EVENT HANDLERS
1. SIMPLE EVENT HANDLERS
2. W3C EVENT HANDLERS
3. EXTENDED EVENT HANDLERS
3. RUNNING SCRIPTS AT PAGE LOAD
4. SOUL BUILDING JAVASCRIPT
5. XML AND JAVASCRIPT
1. DOM MANIPULATION
2. XSL SPRINKLES
6. DHTML EXAMPLES
5. ADVANCED WEB CLIENT PROGRAMMING
1. WORKING WITH IMAGES
2. WORKING WITH FORMS
3. WORKING WITH COOKIES
4. CLIENT-SERVER PROGRAMMING (AJAX)
1. XMLHTTPREQUEST
2. HANDLING HTML
3. HANDLING JSON
4. HANDLING XML
5. DESIGN MODE
6. JAVASCRIPT OUTSIDE HTML
1. ACTIONSCRIPT IN FLASH
2. ADOBE PDF FORMS
3. JSOSA FOR THE MACINTOSH
4. JSCRIPT IN MICROSOFT WSH
7. STANDARDS AND BEST PRACTICES
1. NAMING CONVENTIONS
2. CODE STRUCTURING
3. ACCESSIBILITY
8. APPENDICES
1. INDEX
2. LINKS
3. USEFUL SOFTWARE TOOLS
4. HISTORY OF JAVASCRIPT
5. CONTRIBUTORS

JavaScript/Lexical Structure

1 Case Sensitivity 2 Whitespace 3 Comments 4 Semicolons 5 Literals 6 Identifiers 6.1 Identifier Rules 7 References

[edit] Case Sensitivity

JavaScript is case sensitive. This means that Hello() is not the same as HELLO() or hello()

[edit] Whitespace

Whitespace is extra indents, line breaks, and spaces. Javascript ignores it, but it makes the code easier for people to read.

The following is JavaScript with very little whitespace.

function filterEmailKeys(evt){

evt=evt||window.event;

var charCode=evt.charCode||evt.keyCode;

var char=String.fromCharCode(charCode);

if(/[a-zA-Z0-9_\-\.@]/.exec(char))

return true;

return false;

}

The following is the same JavaScript with a typical amount of whitespace.

function filterEmailKeys(evt) {

    evt = evt || window.event;

    var charCode = evt.charCode || evt.keyCode;

    var char = String.fromCharCode(charCode);

    if (/[a-zA-Z0-9_\-\.@]/.exec(char)) {

        return true;

    }

    return false;

}

The following is the same JavaScript with a lot of whitespace.

function filterEmailKeys( evt )

  {

    evt = evt || window.event;

    var charCode = evt.charCode || evt.keyCode;

    var char = String.fromCharCode ( charCode );

    if ( /[a-zA-Z0-9_\-\.@]/.exec ( char ) )

      {

        return true;

      }

    return false;

  }

[edit] Comments

Comments allow you to leave notes in your code to help other people understand it. They also allow you to comment out code that you want to hide from the parser, but you don't want to delete.

Single-line comments

A double slash, //, turns all of the following text on the same line into a comment that will not be processed by the JavaScript interpreter.

// Shows a welcome message

alert("Hello, World!")

Multi-line comments

Multi-line comments are begun with slash asterisk, /*, and end with the reverse asterisk slash, */.

Here is an example of how to use the different types of commenting techniques.

/* This is a multi-line comment

that contains multiple lines

of commented text. */

var a = 1;

/* commented out to perform further testing

a = a + 2;

a = a / (a - 3); // is something wrong here?

*/

alert('a: ' + a);

Semicolons

In many computer languages semicolons are required at the end of each code statement. In JavaScript the use of semicolons is optional, as a new line indicates the end of the statement. This is automatic semicolon insertion and the rules for it are quite complex ^[1]. Leaving out semicolons and allowing the parser to automatically insert them can create complex problems.

a = b + c

(d + e).print()

The above code is not interpreted as two statements. Because of the parentheses on the second line, JavaScript interprets the above as if it were

a = b + c(d + e).print();

when instead you may have meant it to be interpreted as

a = b + c;

(d + e).print();

Even though semicolons are optional, it's preferable to end statements with a semicolon to prevent any misunderstandings from taking place.

Literals

A literal represents a fixed value, as opposed to being a variable.

There are several types of literals available. The most common are the string literals, but there are also integer and floating-point literals, array and boolean literals, and object literals.

Details of these different types are covered in Variables and Types

Identifiers

An identifier is a name for a piece of data such as a variable, array, or function.

Identifier Rules

• Letters, dollar signs, underscores, and numbers are allowed in identifiers.
• The first character cannot be a number.

Examples of valid identifiers:

• u
• $hello
• _Hello
• hello90