Syntax (Webmaster in a Nutshell, 3rd Edition)

11.2. Syntax

JavaScript syntax is modeled on Java syntax; Java syntax, in turn, is modeled on C and C++ syntax. Therefore, C, C++, and Java programmers should find that JavaScript syntax is comfortably familiar.

// This is a single-line, C++-style comment.
/*
 * This is a multi-line, C-style comment.
 * Here is the second line.
 */
/* Another comment. */ // This too.

11.2.5. Identifiers

Variable, function, and label names are JavaScript identifiers. Identifiers are composed of any number of letters and digits, and _ and $ characters. The first character of an identifier must not be a digit, however. The following are legal identifiers:

i
my_variable_name
v13
$str

11.2.6. Keywords

The following keywords are part of the JavaScript language, and have special meaning to the JavaScript interpreter. Therefore, they may not be used as identifiers.

`break`	`do`	`if`	`switch`	`typeof`
`case`	`else`	`in`	`this`	`var`
`catch`	`false`	`instanceof`	`throw`	`void`
`continue`	`finally`	`new`	`true`	`while`
`default`	`for`	`null`	`try`	`with`
`delete`	`function`	`return`

JavaScript also reserves the following words for possible future extensions. You may not use any of these words as identifiers either.

`abstract`	`enum`	`int`	`short`
`boolean`	`export`	`interface`	`static`
`byte`	`extends`	`long`	`super`
`char`	`final`	`native`	`synchronized`
`class`	`float`	`package`	`throws`
`const`	`goto`	`private`	`transient`
`debugger`	`implements`	`protected`	`volatile`
`double`	`import`	`public`

In addition, you should avoid creating variables that have the same name as global properties and methods: see the Global, Object, and Window reference pages. Within functions, do not use the identifier arguments as an argument name or local variable name.

11.2.7. Variables

Variables are declared and initialized with the var statement:

var i = 1+2+3;
var x = 3, message = 'hello world';

Variable declarations in top-level JavaScript code may be omitted, but they are required to declare local variables within the body of a function.

JavaScript variables are untyped: they can contain values of any data type.

Global variables in JavaScript are implemented as properties of a special Global object. Local variables within functions are implemented as properties of the Argument object for that function. Global variables are visible throughout a JavaScript program. Variables declared within a function are only visible within that function. Unlike C, C++, and Java, JavaScript does not have block-level scope: variables declared within the curly braces of a compound statement are not restricted to that block and are visible outside of it.

11.2.8. Data Types

JavaScript supports three primitive data types: numbers, booleans, and strings; and two compound data types: object and arrays. In addition, it defines specialized types of objects that represent functions, regular expressions, and dates.

11.2.8.1. Numbers

Numbers in JavaScript are represented in 64-bit floating-point format. JavaScript makes no distinction between integers and floating-point numbers. Numeric literals appear in JavaScript programs using the usual syntax: a sequence of digits, with an optional decimal point and an optional exponent. For example:

Integers may also appear in hexadecimal notation. A hexadecimal literal begins with 0x:

0xFF // The number 255 in hexadecimal

When a numeric operation overflows, it returns a special value that represents positive or negative infinity. When an operation underflows, it returns zero. When an operation such as taking the square root of a negative number yields an error or meaningless result, it returns the special value NaN, which represents a value that is not-a-number. Use the global function isNaN( ) to test for this value.

The Number object defines useful numeric constants. The Math object defines various mathematical functions such as Math.sin( ), Math.pow( ), and Math.random( ).

11.2.8.2. Booleans

The boolean type has two possible values, represented by the JavaScript keywords true and false. These values represent truth or falsehood, on or off, yes or no, or anything else that can be represented with one bit of information.

11.2.8.3. Strings

A JavaScript string is a sequence of arbitrary letters, digits, and other characters from the 16-bit Unicode character set.

String literals appear in JavaScript programs between single or double quotes. One style of quotes may be nested within the other:

'testing'
"3.14"
'name="myform"'
"Wouldn't you prefer O'Reilly's book?"

When the backslash character (\) appears within a string literal, it changes, or escapes, the meaning of the character that follows it. The following table lists these special escape sequences:

Escape	Represents
`\b`	Backspace
`\f`	Form feed
`\n`	Newline
`\r`	Carriage return
`\t`	Tab
`\`'	Apostrophe or single quote that does not terminate the string
`\`"	Double-quote that does not terminate the string
`\`	Single backslash character
`\x``dd`	Character with Latin-1 encoding specified by two hexadecimal digits `dd`
`\u``dddd`	Character with Unicode encoding specified by four hexadecimal digits `dddd`

The String class defines many methods that you can use to operate on strings. It also defines the length property, which specifies the number of characters in a string.

The addition (+) operator concatenates strings. The equality (==) operator compares two strings to see if they contain exactly the same sequences of characters. (This is compare-by-value, not compare-by-reference, as C, C++, or Java programmers might expect.) The inequality operator (!=) does the reverse. The relational operators(<, <=, >, and >=) compare strings using alphabetical order.

JavaScript strings are immutable, which means that there is no way to change the contents of a string. Methods that operate on strings typically return a modified copy of the string.

11.2.8.4. Objects

An object is a compound data type that contains any number of properties. Each property has a name and a value. The . operator is used to access a named property of an object. For example, you can read and write property values of an object o as follows:

o.x = 1;
o.y = 2;
o.total = o.x + o.y;

Object properties are not defined in advance as they are in C, C++, or Java; any object can be assigned any property. JavaScript objects are associative arrays: they associate arbitrary data values with arbitrary names. Because of this fact, object properties can also be accessed using array notation:

o["x"] = 1;
o["y"] = 2;

Objects are created with the new operator. You can create a new object with no properties as follows:

var o = new Object( );

Typically, however, you use predefined constructors to create objects that are members of a class of objects and have suitable properties and methods automatically defined. For example, you can create a Date object that represents the current time with:

var now = new Date( );

You can also define your own object classes and corresponding constructors; doing this is documented later in this section.

In JavaScript 1.2 and later, you can use object literal syntax to include objects literally in a program. An object literal is a comma-separated list of name/value pairs, contained within curly braces. For example:

var o = {x:1, y:2, total:3};

See Object (and Date) in the reference section.

11.2.8.5. Arrays

An array is a type of object that contains numbered values rather than named values. The [ ] operator is used to access the numbered values of an array:

a[0] = 1;
a[1] = a[0] + a[0];

The first element of a JavaScript array is element 0. Every array has a length property that specifies the number of elements in the array. The last element of an array is element length-1. Array elements can hold any type of value, including objects and other arrays, and the elements of an array need not all contain values of the same type.

You create an array with the Array( ) constructor:

var a = new Array( );      // Empty array
var b = new Array(10);    // 10 elements
var c = new Array(1,2,3); // Elements 1,2,3

As of JavaScript 1.2, you can use array literal syntax to include arrays directly in a program. An array literal is a comma-separated list of values enclosed within square brackets. For example:

var a = [1,2,3];
var b = [1, true, [1,2], {x:1, y:2}, "Hello"];

See Array in the reference section for a number of useful array manipulation methods.

11.2.8.6. Functions and methods

A function is a piece of JavaScript code that is defined once and can be executed multiple times by a program. A function definition looks like this:

function sum(x, y) {
  return x + y;
}

Functions are invoked using the ( ) operator and passing a list of argument values:

var total = sum(1,2);  // Total is now 3

In JavaScript 1.1, you can create functions using the Function( ) constructor:

var sum = new Function("x", "y", "return x+y;");

In JavaScript 1.2 and later, you can define functions using function literal syntax, which makes the Function( ) constructor obsolete:

var sum = function(x,y) { return x+y; }

When a function is assigned to a property of an object, it is called a method of that object. Within the body of a method, the keyword this refers to the object for which the function is a property.

Within the body of a function, the arguments[ ] array contains the complete set of arguments passed to the function. See Function and Arguments in the reference section.

11.2.8.7. null and undefined

There are two JavaScript values that are not of any of the types described above. The JavaScript keyword null is a special value that indicates "no value". If a variable contains null, you know that it does not contain a valid value of any other type. The other special value in JavaScript is the undefined value. This is the value of uninitialized variables and the value returned when you query object properties that do not exist. In JavaScript 1.5, there is a pre-defined global variable named undefined that holds this special undefined value. null and undefined serve similar purposes and the == operator considers them equal; if you need to distinguish between them, use the === operator.

11.2.9. Expressions and Operators

JavaScript expressions are formed by combining values (which may be literals, variables, object properties, array elements, or function invocations) using JavaScript operators. Parentheses can be used in an expression to group subexpressions and alter the default order of evaluation of the expression. Some examples:

1+2
total/n
sum(o.x, a[3])++

JavaScript defines a complete set of operators, most of which should be familiar to C, C++, and Java programmers. They are listed in the table below, and a brief explanation of the nonstandard operators follows. The P column specifies operator precedence and the A column specifies operator associativity: L means left-to-right associativity, and R means right-to-left associativity.

P	A	Operator	Operation performed
15	L	.	Access an object property
	L	`[ ]`	Access an array element
	L	`( )`	Invoke a function
	R	`new`	Create new object
14	R	`++`	Pre-or-post increment (unary)
	R	`--`	Pre-or-post decrement (unary)
	R	`-`	Unary minus (negation)
	R	`+`	Unary plus (no-op)
	R	`~`	Bitwise complement (unary)
	R	`!`	Logical complement (unary)
	R	`delete`	Undefine a property (unary) (JS 1.2)
	R	`typeof`	Return data type (unary) (JS 1.1)
	R	`void`	Return undefined value (unary) (JS 1.1)
13	L	`*`, `/`, `%`	Multiplication, division, remainder
12	L	`+`, `-`	Add, subtract
	L	`+`	Concatenate strings
11	L	`<<`	Integer shift left
	L	`>>`	Shift right, sign-extension
	L	`>>>`	Shift right, zero extension
10	L	`<`, `<=`	Less than, less than or equal
	L	`>`, `>=`	Greater than, greater than or equal
	L	`instanceof`	Check object type (JS 1.5)
	L	`in`	Check whether property exists (JS 1.5)
9	L	`==`	Test for equality
	L	`!=`	Test for inequality
	L	`===`	Test for identity (JS 1.3)
	L	`!==`	Test for non-identity (JS 1.3)
8	L	`&`	Integer bitwise AND
7	L	`^`	Integer bitwise XOR
6	L	`\|`	Integer bitwise OR
5	L	`&&`	Logical AND
4	L	`\|\|`	Logical OR
3	R	`?`:	Conditional operator (3 operands)
2	R	`=`	Assignment
	R	`*=`, `+=`, `-=`, etc.	Assignment with operation
1	L	,	Multiple evaluation

JavaScript operators that are not familiar from C, C++, and Java are the following:

=== and !==: The JavaScript equality operator, ==, defines equality loosely and allows type conversions. For example, it considers the number 3 and the string "3" to be equal, it considers false to be equal to 0, and it considers null and undefined to be equal. The identity operator, ===, written with three equals signs, is stricter: it only evaluates to true if its operands are identical: i.e., if they have the same type and are equal. Similarly, the JavaScript non-identity operator !== is stricter than the non-equality != operator.
String operators: In JavaScript, the + operator concatenates string arguments in addition to adding numeric arguments. The == and === operators compare strings by value by testing to see whether they contain exactly the same characters. The relational operators <, <=, >, and >= compare strings based on alphabetical order.
typeof: Return the type of the operand as a string. Evaluates to "number", "string", "boolean", "object", "function", or "undefined". Evaluates to "object" if the operand is null.
instanceof: Evaluates to true if the object on the left was created with the constructor function (such as Date or RegExp) on the right.
in: Evaluates to true if the object on the right has (or inherits) a property with the name on the left.
delete: Deletes an object property. Note that this is not the same as simply setting the property to null. Evaluates to false if the property could not be deleted, or true otherwise.
void: Ignores the operand and evaluates to undefined.

11.2.10. Statements

A JavaScript program is a sequence of JavaScript statements. Most JavaScript statements have the same syntax as the corresponding C, C++, and Java statements.

11.2.10.1. Expression statements

Every JavaScript expression can stand alone as a statement. Assignments, method calls, increments, and decrements are expression statements. For example:

s = "hello world";
x = Math.sqrt(4);
x++;

11.2.10.2. Compound statements

When a sequence of JavaScript statements is enclosed within curly braces, it counts as a single compound statement. For example, the body of a while loop consists of a single statement. If you want the loop to execute more than one statement, use a compound statement. This is a common technique with if, for, and other statements described later.

11.2.10.3. Empty statements

The empty statement is simply a semicolon by itself. It does nothing, and is occasionally useful for coding empty loop bodies.

11.2.10.4. Labeled statements

As of JavaScript 1.2, any statement can be labeled with a name. Labeled loops can then be used with the labeled versions of the break and continue statements:

label : statement

11.2.10.5. Alphabetical statement reference

The following paragraphs document all JavaScript statements, in alphabetical order.

break: The break statement terminates execution of the innermost enclosing loop, or, in JavaScript 1.2 and later, the named loop:

break ; break label ;
case: case is not a true statement. Instead it is a keyword used to label statements within a JavaScript 1.2 or later switch statement:

case constant-expression : statements [ break ; ]

Because of the nature of the switch statement, a group of statements labeled by case should usually end with a break statement.

continue: The continue statement restarts the innermost enclosing loop, or, in JavaScript 1.2 and later, restarts the named loop:

continue ; continue label ;

default: Like case, default is not a true statement, but instead a label that may appear within a JavaScript 1.2 or later switch statement:

default: statements [ break ; ]

do/while: The do/while loop repeatedly executes a statement while an expression is true. It is like the while loop, except that the loop condition appears (and is tested) at the bottom of the loop. This means that the body of the loop is executed at least once:

do statement while ( expression ) ;

This statement was introduced in JavaScript 1.2. In Netscape 4, the continue statement does not work correctly within do/while loops.

for: The for statement is an easy-to-use loop that combines the initialization and increment expressions with the loop condition expression:

for (initialize ; test ; update ) statement

The for loop repeatedly executes statement as long as the test expression is true. It evaluates the initialize expression once before starting the loop and evaluates the update expression at the end of each iteration.

for/in: The for/in statement loops through the properties of a specified object:

for (variable in object) statement

The for/in loop executes a statement once for each property of an object. Each time through the loop, it assigns the name of the current property to the specified variable. Some properties of pre-defined JavaScript objects are not enumerated by the for/in loop. User-defined properties are always enumerated.

function: The function statement defines a function in a JavaScript program:

function funcname ( args ) { statements }

This statement defines a function named funcname, with a body that consists of the specified statement, and arguments as specified by args. args is a comma-separated list of zero or more argument names. These arguments can be used in the body of the function to refer to the parameter values passed to the function.

if/else: The if statement executes a statement if an expression is true:

if ( expression ) statement

When an else clause is added, the statement executes a different statement if the expression is false:

if ( expression ) statement else statement2

Any else clause may be combined with a nested if/else statement to produce an else if statement:

if ( expression ) statement else if ( expression2 ) statement2 else statement3

return: The return statement causes the currently executing function to stop executing and return to its caller. If followed by an expression, the value of that expression is used as the function return value:

return ; return expression ;

switch: The switch statement is a multi-way branch. It evaluates an expression and then jumps to a statement that is labeled with a case clause that matches the value of the expression. If no matching case label is found, the switch statement jumps to the statement, if any, labeled with default:

switch ( expression ) { case constant-expression: statements [ case constant-expression: statements ] [ . . . ] default: statements }

Each set of statements within a switch statement is usually terminated with a break or return so that execution does not fall through from one case to the next one.

throw

The throw statement signals an error, or throws an exception. It causes program control to jump immediately to the nearest enclosing exception handler (see the try/catch/finally statement). The throw statement is defined by ECMAv3 and implemented in JavaScript 1.5. Its syntax is:

throw expression ;

The expression may evaluate to any type. (See Error in the reference section.)

try/catch/finally: The try/catch/finally statement is JavaScript's exception handling mechanism. It is defined by ECMAv3 and implemented in JavaScript 1.5. Its syntax is:

try { statements } catch ( argument ) { statements } finally { statements }

The try clause of this statement defines a block of code for which exceptions and errors are to be handled. If a program error occurs, or an exception is thrown within the try block, control jumps to the exception-handling statements in the catch clause. This clause includes a single argument or local variable; the value that was thrown by the exception is assigned to this local variable so that it can be referred to by the statements of the catch clause. The finally clause contains statements that are executed after the try or catch clauses, whether or not an exception is thrown. The catch and finally clauses are optional, but you cannot omit both of them.

var: The var statement declares and optionally initializes one or more variables. Variable declaration is optional in top-level code, but is required to declare local variables within function bodies:

var name [ = value ] [ , name2 [ = value2 ] . . . ] ;

while: The while statement is a basic loop. It repeatedly executes a statement while an expression is true:

while ( expression ) statement ;

with

The with statement adds an object to the scope chain, so that a statement is interpreted in the context of the object:

with ( object )
    statement ;

The with statement has some complex and nonintuitive side effects; its use is strongly discouraged.

11.2.11. Object-Oriented JavaScript

JavaScript objects are associative arrays that associate values with named properties. JavaScript provides a simple inheritance mechanism, and it is possible to define new classes of objects for use in your own programs. To define a new class, start by writing a constructor function. A constructor is like any other function, except it is invoked with the new operator and it uses the this keyword to refer to and initialize the newly created object. For example, here is a constructor to create objects of a new class named Point.

function Point(x,y) { // Constructor for Point
  this.x = x;  // Initialize X coordinate
  this.y = y;  // Initialize Y coordinate
}

Every JavaScript function used as a constructor has a property named prototype. This property refers to a special prototype object for the class of objects created by the constructor. Any properties you define on this prototype object are inherited by all objects created with the constructor function. The prototype object is commonly used to make methods available to all instances of a class. Defining a method named toString allows instances of your class to be converted to strings. For example:

// Define function literals and assign them 
// to properties of the prototype object.
Point.prototype.distanceTo = function(that) {
  var dx = this.x - that.x;
  var dy = this.y - that.y;
  return Math.sqrt(dx*dx + dy*dy);
}
Point.prototype.toString = function () {
  return '(' + this.x + ',' + this.y + ')';
}

If you want to define static (or class) methods or properties, you can assign them directly to the constructor function, rather than to the prototype object. For example:

// Define a commonly used Point constant
Point.ORIGIN = new Point(0,0);

The preceding code fragments define a simple Point class that we can use with code like this:

// Call constructor to create a new Point object
var p = new Point(3,4);
// Invoke a method of the object, using a static
// property as the argument.  
var d = p.distanceTo(Point.ORIGIN);
// Adding the object to a string implicitly
// invokes toString().
var msg = "Distance to " + p + " is " + d;

11.2.12. Regular Expressions

JavaScript supports regular expressions for pattern matching with the same syntax as the Perl programming language. JavaScript 1.2 supports Perl 4 regular expressions, and JavaScript 1.5 adds supports for some of the additional features of Perl 5 regular expressions. A regular expression is specified literally in a JavaScript program as a sequence of characters within slash (/) characters, optionally followed by one or more of the modifier characters g (global search), i (case-insensitive search), and m (multi-line mode; a JavaScript 1.5 feature). In addition to this literal syntax, RegExp objects can be created with the RegExp( ) constructor, which accepts the pattern and modifier characters as string arguments, without the slash characters.

A full explanation of regular expression syntax is beyond the scope of this chapter, but the tables in the following subsections offer brief syntax summaries.

11.2.12.1. Literal characters

Letters, numbers, and most other characters are literals in a regular expression: they simply match themselves. As we'll see in the sections that follow, however, there are a number of punctuation characters and escape sequences (beginning with \) that have special meanings. The simplest of these escape sequences provide alternative ways of representing literal characters.

Character	Meaning
`\n`, `\r`, `\t`	Match literal newline, carriage return, tab
`\`, `\/`, `\*`, `\+`, `\?`, etc.	Match a punctuation character literally, ignoring or escaping its special meaning
`\xnn`	The character with hexadecimal encoding `nn`
`\uxxxx`	The Unicode character with hexadecimal encoding `xxxx`

11.2.12.2. Character classes

Regular expression syntax uses square brackets to represent character sets or classes in a pattern. In addition, escape sequences define certain commonly-used character classes, as shown in the following table.

Character	Meaning
`[...]`	Match any one character between brackets
`[^...]`	Match any one character not between brackets
.	Match any character other than newline
`\w`, `\W`	Match any word/non-word character
`\s`, `\S`	Match any whitespace/non-whitespace
`\d`, `\D`	Match any digit/non-digit

11.2.12.3. Repetition

The following table shows regular expression syntax that controls the number of times that a match may be repeated.

Character	Meaning
`?`	Optional term; match zero or one time
`+`	Match previous term one or more times
`*`	Match previous term zero or more times
`{n}`	Match previous term exactly `n` times
`{n,}`	Match previous term `n` or more times
`{n,m}`	Match at least `n` but no more than `m` times

In JavaScript 1.5, any of the repetition characters may be followed by a question mark to make them non-greedy, which means they match as few repetitions as possible while still allowing the complete pattern to match.

11.2.12.4. Grouping and alternation

Regular expressions use parentheses to group subexpressions, just as mathematical expressions do. Parentheses are useful, for example, to allow a repetition character to be applied to an entire subexpression. They are also useful with the | character, which is used to separate alternatives. Parenthesized groups have a special behavior: when a pattern match is found, the text that matches each group is saved and can be referred to by group number. The following table summarizes this syntax.

Character	Meaning
`a` `\|` `b`	Match either `a` or `b`
`(sub)`	Group subexpression `sub` into a single term, and remember the text that it matched
`(?`:`sub)`	Group subexpression `sub` but do not number the group or remember the text it matches (JS 1.5)
`\n`	Match exactly the same characters that were matched by group number `n`
`$n`	In replacement strings, substitute the text that matched the `n`th subexpression

11.2.12.5. Anchoring match position

An anchor in a regular expression matches a position in a string (such as the beginning or the end of the string) without matching any of the characters of a string. It can be used to anchor a match to a position.

Character	Meaning
`^`, `$`	Require match at beginning/end of a string, or in multiline mode, beginning/end of a line
`\b`, `\B`	Require match at a word boundary/non-boundary
`(?=p)`	Look-ahead assertion: require that the following characters match the pattern `p`, but do not include them in the match (JS 1.5)
`(?!p)`	Negative look-ahead assertion: require that the following characters do not match the pattern `p` (JS 1.5)

11.2.13. Versions of JavaScript

Netscape has defined numerous versions of JavaScript. Microsoft has released more-or-less compatible versions under the name "JScript," and the ECMA standards body has released three versions of a JavaScript standard named "ECMAScript". The following paragraphs describe these various versions, and explain how they relate to each other. Each entry in the reference section contains availability information that documents the version of JavaScript in which a feature was introduced.

JavaScript 1.0: The original version of the language. It was buggy and is now essentially obsolete. Implemented by Netscape 2.
JavaScript 1.1: Introduced a true Array object; most serious bugs resolved. Implemented by Netscape 3.
JavaScript 1.2: Introduced the switch statement, regular expressions, and a number of other features. Almost compliant with ECMA v1, but has some incompatibilities. Implemented by Netscape 4.
JavaScript 1.3: Fixed incompatibilities of JavaScript 1.2. Compliant with ECMA v1. Implemented by Netscape 4.5.
JavaScript 1.4: Only implemented in Netscape server products.
JavaScript 1.5: Introduced exception handling. Compliant with ECMA v3. Implemented by Mozilla and Netscape 6.
JScript 1.0: Roughly equivalent to JavaScript 1.0. Implemented by early releases of IE 3.
JScript 2.0: Roughly equivalent to JavaScript 1.1. Implemented by later releases of IE 3.
JScript 3.0: Roughly equivalent to JavaScript 1.3. Compliant with ECMA v1. Implemented by IE 4.
JScript 4.0: Not implemented by any web browser.
JScript 5.0: Supported exception handling; partial ECMA v3 compliance. Implemented by IE 5.
JScript 5.5: Roughly equivalent to JavaScript 1.5. Fully compliant with ECMA v3. Implemented by IE 5.5 and IE 6.
ECMA v1: The first standard version of the language. Standardized the basic features of JavaScript 1.1 and added a few new features. Did not standardize the switch statement or regular expression support. Conformant implementations are JavaScript 1.3 and JScript 3.0.
ECMA v2: A maintenance release of the standard that included clarifications but defined no new features.
ECMA v3: Standardized the switch statement, regular expressions, and exception handling. Conformant implementations are JavaScript 1.5 and JScript 5.5.