Tokens, Operators, Expressions, and Statements
4.5.1Tokens
As noted previously, tokens are the smallest lexical units of a language. One way to think about tokens is to consider how a script might be stored in compressed form. Each unique piece of information will be represented by a token. For example, variable name identifiers will be stored as tokens. The concept of tokens explains why myname or my_name are allowed variable names, but my name is not—my name will be interpreted as two separate names (two tokens).
4.5.2
Arithmetic Operators
Operators are also tokens. JavaScript operators, shown in Table 4.3, include arithmetic operators for addition, subtraction, multiplication, division, and the modulus operator for returning the remainder from division. These are all binary operators, which means that they require two operands, one to the left of the operator and one to the right. The addition and subtraction operators can also function as unary operators, with a single operand to the right of the operator; for example, -x.
With the exception of the modulus, or remainder, operator, these should all be familiar.
The modulus operator works with either integer or real number operands. (Remember that JavaScript does not support a separate integer data type.) The result of dividing 17 by 3 is 5 with a remainder of 2. The result of dividing 16.6 by 2.7 is 6 (6 times 2.7 = 16.2) with a remainder of 16.6 − 16.2 = 0.4.
The addition operator also works as a concatenation operator for strings. The expression var author = "David" + " " + "Brooks"; makes perfect sense to JavaScript and will give variable author the expected value of "David Brooks". Note that the expression "David" + "Brooks" will produce the result "DavidBrooks."
When JavaScript interprets an expression, it scans the expression from left to right one or more times. Operations implied by the presence of operators are evaluated according to precedence rules. Fortunately, these rules are the same ones that apply in algebraic expres-sions. Suppose a = 3, b = 4, and c = 5. What is the value of x in the algebraic expression
x a bc= + ? Based on precedence rules, multiplication and division operations are carried out before addition and subtraction. So, x= +3 4·5 3 20 23= + = . That is, a multiplication operation has precedence over an addition operation, so the addition operation is delayed until after the multiplication is performed, even though the addition operator is to the left of the multiplication operator. Parentheses are required to alter the precedence rules:
(
3 4 ·5 35)
x= + = .
86 4 Fundamentals of the JavaScript Language
4
The same rules apply in JavaScript. As indicated in Table 4.3, multiplication and division (including the modulus operation) take precedence over addition and subtraction.
So, in this code:
var a=3,b=4,c=5;
var x,y;
x=a+b*c;
y=(a+b)*c;
the variable x has a value of 23. In the fourth statement, parentheses are used to override the natural order in which operations are evaluated, so y has a value of 35. The expression is evaluated from the innermost set of parentheses outward, so the a+b operation is performed before the multiplication by c.
4.5.3
The Assignment Operator
The JavaScript assignment operator is the symbol =. Thus, the JavaScript statement x=a+b; looks very much like the algebraic equation x a b= + . However, they are not at all the same thing! In programming, the assignment operator has a completely different meaning from the symbolic equality implied by the algebraic use of the = sign. In algebra, the equation x a b= + defines a symbolic relationship among a, b, and x; whatever the values of x, a, and b, x must be equal to the sum of a and b. Given values for a and b, you can determine the value of x. Given the values of x and a, you can solve for the value of b:
b x a= − . Note also that a b x+ = is algebraically equivalent to x a b= + . But, in programming,
The meaning of the assignment operator is: “Evaluate the expression on the right side of the assignment operator and assign the result to the identifier on the left side of the assignment operator.”
For the statement x=a+b;, the specific meaning is “If a and b have been given numerical values, calculate their sum and assign the result to the identifier x. If a and/or b are strings, concatenate b to a.”
Table 4.3 JavaScript’s arithmetic operators
Operator Symbol Examples Precedence
Addition + 3 + 4 2
Subtraction − Z − 10 2
Multiplication * A*b 1
Division / z/3.333 1
Modulus (remainder) % 17%3 (= 2),
16.6%2.7 (= 0.4) 1
87 4.5 Tokens, Operators, Expressions, and Statements
With this definition of the assignment operator, it is clear that the JavaScript statement a+b=x; makes no sense, and will generate a syntax error. Why? Because:
Only an identifier can appear on the left side of the assignment operator.
Finally, note that the algebraic expression x= +x 1 makes no sense at all because it is not possible for x to be equal itself plus 1. However, the JavaScript statement x=x+1;
makes perfect sense. It means “Add 1 to the current value of x and then replace the value of x with this new value.” So, as a result of executing these statements:
var x=5.5;
x=x+1;
x will have a value of 6.5.
It is sometimes difficult for beginning programmers to remember that an assignment statement is not the same thing as an algebraic equation. Although JavaScript (and other programming languages) allow you to perform mathematical operations with variable identifiers, these languages do not understand the concepts of algebra. When it sees an assignment operator, all it knows how to do is evaluate the expression on the right side of the operator and assign that result to the identifier on the left side of the expression. In doing the expression evaluation, it assumes that every identifier has already been assigned an actual, and not just a symbolic, value.
As a result of how the assignment operator works, a general rule about assignment statements is:
An identifier should never appear on the right side of an assignment operator unless it has previously been assigned an appropriate value.
Identifiers that do not follow this rule are called uninitialized variables. They are often assigned a value of 0 by default, but you should never violate the rule based on this assumption.
4.5.4
Shorthand Arithmetic/Assignment Operators
Table 4.4 shows some shorthand operators for combining arithmetic operations and assignments. They are popular among programmers because they are easy to write quickly, but their use is never actually required.
The increment operator (++) adds 1 to the value of the variable to which it is applied, and the decrement operator (--) subtracts 1. These operators are commonly used in looping structures, as discussed later in this chapter.
As shown in Table 4.4, you can apply the increment or decrement operators either before the variable name (pre-increment or pre-decrement) or after (post-increment or post-decrement). This choice can lead to some unexpected results. Consider Document 4.2.
88 4 Fundamentals of the JavaScript Language
4
Document 4.2 (incrementDecrement.htm)
<html>
<head>
<title>Increment/decrement operators</title>
<script>
var x=3,y;
y=(x++)+3;
document.write("post-increment: y="+y+"<br />");
document.write("x="+x+"<br />");
x=3;y=(++x)+3;
document.write("pre-increment: y="+y+"<br />");
document.write("x="+x+"<br />");
</script>
</head>
<body>
</body>
</html>
In the post-increment case, the value of x is incremented
after the expression is evaluated to pro-vide a value for y. In the pre-increment case, the value of x is incremented before the value of y is calculated. A similar result would occur for the decrement operator. For the most part, you should avoid combining the increment/decrement operators with other opera-tions in a single expression. Also, do not apply both pre- and post-operators at the same time (that is, do not write ++x++; or --x--;) and do not apply these operators to the same variable more than once in an expression.
Table 4.4 Shorthand arithmetic/assignment operators Operator Implementation Interpretation
+= x+=y; x=x+y;
-= x-=y; x=x-y;
*= x*=y; x=x*y;
/= x/=y; x=x/y;
%= x%=y; x=x%y;
++ x++; or ++x; x=x+1;
-- y--; or --y; x=x-1;
89 4.6 The JavaScript Math Object