JavaScript: The Definitive Guide

Previous Chapter 4
Expressions and Operators

4.2 Operator Overview

If you are a C, C++, or Java programmer, then the JavaScript operators will almost all be already familiar to you. Table 4.1 summarizes the operators, and you can refer to this table for reference. In the table, the column labeled P gives the operator precedence, and the column labeled A gives the operator associativity, which can be L (left-to-right) or R (right-to-left).

If you do not already know C, C++, or Java, the sections that follow the table explain how to interpret the table and explain what each of the operators does.

Table 4.1: JavaScript Operators
P A Operator Operand Type(s) Operation Performed
0 L . object, property property access
  L [] array, integer array index
  L () function, args function call
1 R ++ number

pre-or-post increment (unary)

  R -- number

pre-or-post decrement (unary)

  R - number

unary minus (negation)

  R ~ integer

bitwise complement (unary)

  R ! Boolean

logical complement (unary)

  R typeof any return data type (unary)
  R new constructor call create new object (unary)
  R void any return undefined value (unary)
2 L *, /, % numbers

multiplication, division, remainder

3 L +, - numbers addition, subtraction
  L + strings string concatenation
4 L << integers left shift
  L >> integers

right shift with sign-extension

  L >>> integers

right shift with zero extension

5 L <, <= numbers or strings

less than, less than or equal

  L >, >= numbers or strings

greater than, greater than or equal

6 L == primitive types

equal (have identical values)

  L != primitive types

not equal (have different values)

  L == reference types

equal (refer to same object)

  L != reference types

not equal (refer to different objects)

7 L & integers bitwise AND
8 L ^ integers bitwise XOR
9 L | integers bitwise OR
10 L && Booleans logical AND
11 L || Booleans logical OR
12 R ?: Boolean, any, any

conditional (ternary) operator

13 R = variable, any assignment

*=, /=, %=, +=, -=, <<=, >>=, >>>=, &=, ^=, |=

variable, any assignment with operation
14 L , any multiple evaluation

Number of Operands

In general, there are three types of operators. Most JavaScript operators, like the + operator that we saw in the previous section, are binary operators that combine two expressions into a single, more complex expression. That is, they operate on two operands. JavaScript also supports a number of unary operators, which convert a single expression into a single more complex expression. The - operator in the expression -3 is a unary operator which performs the operation of negation on the operand 3. Finally, JavaScript supports one ternary operator, ?:, which combines the value of three expressions into a single expression.

Type of Operands

When constructing JavaScript expressions, you must pay attention to the data types that are being passed to operators, and to the data types that are returned. Different operators expect their operands' expressions to evaluate to values of a certain data type. For example, it is not possible to multiply strings, so the expression "a" * "b" is not legal in JavaScript. Note, however, that JavaScript tries to convert expressions to the appropriate type whenever possible, so the expression "3" * "5" is legal. Its value is the number 15, not the string "15".

Furthermore, some operators behave differently depending on the type of the operands. Most notably, the + operator adds numeric operands but concatenates string operands. And if passed one string and one number, it converts the number to a string and concatenates the two resulting strings. For example, '1' + 0 yields the string '10'.

Finally, note that operators do not always return the same type as their operands. The comparison operators (less than, equal to, greater than, etc.) take operands of various types, but when comparison expressions are evaluated, they always return a Boolean result that indicates whether the comparison is true or not. For example, the expression a < 3 returns true if the value of variable a is in fact less than 3. As we'll see, the Boolean values returned by comparison operators are used in if statements, while loops, and for loops--JavaScript statements that control the execution of a program based on the results of evaluating expressions that contain comparison operators.

Operator Precedence

In Table 4.1 the column labeled P specifies the precedence of each operator. Operator precedence controls the order in which operations are performed. Operators with a lower number in the P column are performed before those with a higher number. Somewhat confusingly, we say that operators that are performed first (with a lower P number) have higher precedence.

Consider the following expression:

w = x + y*z;
The multiplication operator * has a higher precedence than the addition operator +, so the multiplication is performed before the addition. Furthermore, the assignment operator = has the lowest precedence, and so the the assignment operator = has the lowest assignment is performed after all the operations on the right-hand side are completed. Operator precedence can be overridden with the explicit use of parentheses. To force the addition to be performed first in the above example, we would write:

w = (x + y)*z;
In practice, if you are at all unsure about the precedence of your operators, the simplest thing is to use parentheses to make the evaluation order explicit. The only rules that are important to know are that multiplication and division are performed before addition and subtraction, and that assignment has very low precedence and is always performed last.

Operator Associativity

In Table 4.1 the column labeled A specifies the associativity of the operator. A value of L specifies left-to-right associativity, and a value of R specifies right-to-left associativity. The associativity of an operator specifies the order in which operations of the same precedence are performed. Left-to-right associativity means that operations are performed from left to right. For example:

w = x + y + z;
is the same as:

w = ((x + y) + z);
because the addition operator has left-to-right associativity. On the other hand, the following (almost nonsensical) expressions:

x = ~-~y;
w = x = y = z;
q = a?b:c?d:e?f:g;
are equivalent to:

x = ~(-(~y));
w = (x = (y = z));
q = a?b:(c?d:(e?f:g));
because the unary, assignment, and ternary conditional operators have right-to-left associativity.

Previous Home Next
Expressions Book Index Arithmetic Operators

HTML: The Definitive Guide CGI Programming JavaScript: The Definitive Guide Programming Perl WebMaster in a Nutshell
Hosted by uCoz