2.2 运算符与表达式
运算符用于完成运算，参与运算的数称为操作数。由操作数和运算符组成的式子称为表达式。JavaScript中的运算可分为算术运算、字符串运算、关系运算、逻辑运算、位运算和赋值运算。
运算符
2.2.1 算术运算符
算术运算符用于执行加、减、乘和除等算术运算。表2-2列出了JavaScript中的算术运算符。
表2-2 JavaScript中的算术运算符
只使用算术运算符构成的表达式称为算术表达式。
【例2-5】 使用算数运算符。源文件：02\test2-5.html。
…
<body>
<script>
x = 5
y = ++x //等价于x=x+1;y=x
document.write("执行<br>x = 5<br>y = ++x")
document.write("<br>x = " + x)
document.write("<br>y = " + y)
z = x++ //等价于y=x;x=x+1
document.write("<br>执行<br>z = x++")
document.write("<br>x = " + x)
document.write("<br>z = " + z)
a = --x //等价于x=x-1; a=x
document.write("<br>执行<br>a = --x")
document.write("<br>x = " + x)
document.write("<br>a = " + a)
b = x-- //等价于b=x; x=x-1
document.write("<br>执行<br>b = x--")
document.write("<br>x = " + x)
document.write("<br>b = " + b)
document.write("<br>5 % 2 = " + (5 % 2))
document.write("<br>5 % -2 = " + (5 % -2))
document.write("<br>-5 % 2 = " + (-5 % 2))
document.write("<br>-5 % -2 = " + (-5 % -2))
document.write("<br>5 % 2.4 = " + (5 % 2.4))
</script>
</body>
</html>
浏览器中的输出结果如图2-9所示。
图2-9 使用算术运算符的输出结果
2.2.2 字符串运算符
可使用加号（+）将两个字符串连接成一个字符串。例如：
x="I like " + "JavaScript" //x中的值为"I like JavaScript"
加号既可表示加法，也可表示字符串连接，所以在使用时应注意。例如：
x=2+3+"abc"
在该语句中，按照从左到右的顺序，先计算2+3，再计算5+"abc"，结果为"5abc"。
x="abc"+2+3
在该语句中，按照从左到右的顺序，先计算"abc"+2，再计算"abc2"+3，结果为"abc23"。
所以，当加号两侧都是数值时执行加法运算。如果有一个操作数为字符串，加号执行字符串连接。
【例2-6】 使用字符串运算符。源文件：02\test2-6.html。
…
<body>
<script>
x = "I like " + "JavaScript"
document.write('"I like " + "JavaScript" ')
document.write(" 结果为：" + x)
x = 2 + 3 + "abc"
document.write('<br>2 + 3 + "abc" ')
document.write(" 结果为：" + x)
x = "abc" + 2 + 3
document.write('<br>"abc" + 2 + 3 ')
document.write(" 结果为：" + x)
</script>
</body>
</html>
浏览器中的输出结果如图2-10所示。
图2-10 使用字符串运算符的输出结果
2.2.3 关系运算符
关系运算符用于比较操作数的大小关系，运算结果为布尔值true或false。表2-3列出了JavaScript中的关系运算符。
表2-3 JavaScript中的关系运算符
由算术运算符和关系运算符（至少包含关系运算符）构成的表达式称为关系表达式。
相等运算符用于测试两个表达式的值是否相等。例如，3==5结果为false。一种特殊情况是，字符串和数值会被认为相等。例如，"5"==5结果为true。
如果使用绝对相等运算符，只有在两个数的数据类型和值都相同时结果才为true。例如，"5"===5结果为false。
关系运算符也可用于字符串比较。当两个字符串进行比较时，JavaScript首先比较两个字符串的第1个字符的ASCII码。若ASCII码相同，则继续比较下一个字符，否则根据ASCII码大小给出两个字符串的大小。若两个字符串的字符完全相同，则两个字符串相等。若一个字符串中的字符已经比较完，则另一个还有未比较字符的字符串更大。
【例2-7】 使用关系运算符。源文件：02\test2-7.html。
…
<body>
<script>
var x = 5, y = 3
document.write('x = 5 , y = 3')
document.write("<br>x < y 结果为：" + (x < y))
document.write("<br>x > y 结果为：" + (x > y))
document.write("<br>x <= y 结果为：" + (x <= y))
document.write("<br>x >= y 结果为：" + (x >= y))
document.write("<br>x == 5 结果为：" + (x == 5)
document.write('<br>x == "5" 结果为：' + (x == "5"))
document.write("<br>x === 5 结果为：" + (x === 5))
document.write('<br>x === "5" 结果为：' + (x === "5"))
document.write('<br>x != "5" 结果为：' + (x != "5")
document.write('<br>x !== "5" 结果为：' + (x !== "5"))
var x = "abc", y = "cba"
document.write('<br>x = "abc" , y = "cba"')
document.write("<br>x < y 结果为：" + (x < y))
document.write("<br>x > y 结果为：" + (x > y))
document.write("<br>x <= y 结果为：" + (x <= y))
document.write("<br>x >= y 结果为：" + (x >= y))
document.write("<br>x == y 结果为：" + (x == y))
document.write("<br>x > 'ab' 结果为：" + (x > 'ab'))
</script>
</body>
</html>
浏览器中的输出结果如图2-11所示。
图2-11 使用关系运算符的输出结果
2.2.4 逻辑运算符
逻辑运算符用于对布尔型值执行运算。表2-4列出了JavaScript中的逻辑运算符。
表2-4 JavaScript中的逻辑运算符
【例2-8】 使用逻辑运算符。源文件：02\test2-8.html。
…
<body>
<script>
/ **
* 闰年的判断条件为能被400整除，或者能被4整除但不能被100整除
* 判断闰年的逻辑表达式为( x % 4 == 0 && x % 100 != 0)|| x % 400 == 0
* /
var x=1900
document.write('1900年是闰年？')
document.write((x % 4 == 0 && x % 100 != 0)|| x % 400 == 0 )
x = 2000
document.write('<br>2000年是闰年？')
document.write((x % 4 == 0 && x % 100 != 0)|| x % 400 == 0 )
x = 2002
document.write('<br>2002年是闰年？')
document.write((x % 4 == 0 && x % 100 != 0) || x % 400 == 0)
x = 2004
document.write('<br>2004年是闰年？')
document.write((x % 4 == 0 && x % 100 != 0) || x % 400 == 0)
</script>
</body>
</html>
浏览器中的输出结果如图2-12所示。
图2-12 使用逻辑运算符的输出结果
2.2.5 位运算符
位运算符用于对操作数按二进制位执行运算。表2-5列出了JavaScript中的位运算符。
表2-5 JavaScript位运算符
【例2-9】 使用位运算符。源文件：02\test2-9.html。
…
<body>
<script>
document.write('<br>～5 结果为：' + (～5))
document.write('<br>5 & -6 结果为：' + (5 & -6))
document.write('<br>5 | -6 结果为：' + (5 | -6))
document.write('<br>5 << 2 结果为：' + (5 << 2))
document.write('<br>-5 >> 2 结果为：' + (-5 >> 2))
document.write('<br>-5 >>> 2 结果为：' + (-5 >>> 2))
</script>
</body>
</html>
浏览器中的输出结果如图2-13所示。
图2-13 使用位运算符的输出结果
2.2.6 赋值运算符
“=”是JavaScript中的赋值运算符号，用于将其右侧表达式的值赋给左边的变量。例如：
x=5; y=x*x+2;
赋值运算符可以和算术运算符以及位运算符组成复合赋值运算符，包括*=、/=、%=、+=、-=、<<=、>>=、>>>=、&=、|=和^=。复合赋值运算符首先计算变量和右侧表达式，然后将结果赋给变量。例如：
x+=5; //等价于x=x+5
赋值运算表达式可出现在任何表达式出现的位置。例如：
x=(y=5)+3; //等价于y=5;x=y+3;
【例2-10】 使用赋值运算符。源文件：02\test2-10.html。
…
<body>
<script>
var x = 5
document.write('<br>x = 5')
x += 10
document.write('<br>执行 x += 10 后 x = '+ x)
x -= 10
document.write('<br>执行 x -= 10 后 x = '+ x)
x *= 10
document.write('<br>执行 x *= 10 后 x = '+ x)
x /= 10
document.write('<br>执行 x /= 10 后 x = '+ x)
x %= 2
document.write('<br>执行 x %= 2 后 x = '+ x)
</script>
</body>
</html>
浏览器中的输出结果如图2-14所示。
图2-14 使用赋值运算符的输出结果
2.2.7 特殊运算符
JavaScript还提供了一些特殊的运算符，包括条件运算符、逗号运算符、数据类型运算符及new运算符等。
1. 条件运算符
条件运算符基本格式如下。
表达式1 ? 表达式2 : 表达式3
若表达式1的值为true，则条件运算结果为表达式2的值，否则为表达式3的值。例如，下面的代码输出两个数中的较大的值。
var a =2, b = 3, c c = a > b ? a : b document.write(c) //输出3
2. 逗号运算符
逗号可以将多个表达式放到一起，整个表达式的值为其中最后一个表达式的值。例如：
c = (a = 5, b = 6, a + b) document.write(c) //输出11
3. 数据类型运算符
typeof运算符可返回操作数的数据类型，其基本格式如下。
typeof 操作数
例如：
a = 100 document.write(typeof a) //输出number
表2-6列出了各种数据的typeof数据类型名称。
表2-6 各种数据的typeof数据类型名称
4. new运算符
new用于创建对象实例。例如：
a = new Array() //创建一个数组对象
【例2-11】 使用特殊运算符。源文件：02\test2-11.html。
…
<body>
<script>
var a =2, b = 3, c
c = a > b ? a : b
document.write("a =2, b = 3 较大值为" + c)
c = (a = 5, b = 6, a + b)
document.write("<br>表达式：(a = 5, b = 6, a + b) 的值为" + c)
document.write("<br>100 的数据类型为：" + typeof 100)
document.write("<br>1.5 的数据类型为：" + typeof 1.5)
document.write("<br>'abc' 的数据类型为：" + typeof 'abc')
document.write("<br>true 的数据类型为：" + typeof true)
var x
document.write("<br>"+ x + " 的数据类型为：" + typeof x)
document.write("<br>nul 的数据类型为：" + typeof nul)
a = new Array() //创建一个数组对象
document.write("<br>数组的数据类型为：" + typeof a)
function test() { } //定义一个函数
document.write("<br>函数的数据类型为：" + typeof test)
</script>
</body>
</html>
浏览器中的输出结果如图2-15所示。
图2-15 使用特殊运算符
2.2.8 运算符的优先级
JavaScript的运算符具有明确的优先级，优先级高的运算符将优先计算，同级的运算符按照从左到右的顺序依次计算。
表2-7按照从高低的顺序列出了JavaScript运算符的优先级。
表2-7 JavaScript运算符的优先级
例如，表达式x % 4 == 0 && x % 100 != 0 || x % 400 == 0按从左到右的顺序进行计算，过程如下。
（1）%优先级高于==，所以先计算x % 4，结果为0。表达式变为0 == 0 && x % 100 != 0 || x % 400 == 0。
（2）==优先级高于&&，所以先计算0==0，结果为true。表达式变为true && x % 100 != 0 || x % 400 == 0。
（3）&&、%和!=中，%优先级最高，所以先计算x % 100，结果为0。表达式变为true && 0 != 0 || x % 400 == 0。
（4）&&、!=和||中，!=优先级最高，所以先计算0 != 0，结果为false。表达式变为true && false || x % 400 == 0。
（5）&&比||优先级高，所以先计算true && false，结果为false。表达式变为false || x % 400 == 0。
（6）||、%和==中，%优先级最高，所以先计算x % 400，结果为300。表达式变为false || 300 == 0。
（7）||比==优先级低，所以先计算300 == 0，结果为false。表达式变为false || false。
（8）计算false || false，结果为false。
2.2.9 表达式中的数据类型转换
运算符要求操作数具有相应的数据类型。算术运算符要求操作数都是数值类型，字符串运算符要求操作数都是字符串，逻辑运算符要求操作数都是逻辑值。JavaScript在计算表达式时，会根据运算符自动转换不匹配的数据类型。
1. 其他类型转换为数值类型
其他类型转换为数值类型时，遵循下面的规则。
• 字符串：若内容为数字，则转换为对应数值，否则转换为NaN。
• 逻辑值：true转换为1，false转换为0。
• undefined：转换为NaN。
• null：转换为0。
• 其他对象：转换为NaN。
2. 其他类型转换为字符串类型
其他类型转换为字符串类型，遵循下面的规则。
• 数值：转换为对应数字的字符串。
• 逻辑值：true转换为"true"，false转换为"false"。
• undefined：转换为"undefined"。
• null：转换为"null"。
• 其他对象：若对象存在tostring()方法，则转换为该方法返回值，否则转换为"undefined"。
3. 其他类型转换为逻辑值
其他类型转换为逻辑值，遵循下面的规则。
• 字符串：长度为0的字符串转换为false，否则转换为true。
• 数值：值为0和NaN时，转换为false，否则转换为true。
• undefined：转换为false。
• null：转换为false。
• 其他对象：转换为true。
【例2-12】 测试数据类型转换。源文件：02\test2-12.html。
…
<body>
<script>
document.write("其他类型转换为数值：")
x=1 *"abc"
document.write('<br>"abc" 转换为：' + x)
x = 1 * "125"
document.write('<br>"125" 转换为：' + x)
x = 1 * true
document.write('<br>true 转换为：' + x)
x =1 * false
document.write('<br>false 转换为：' + x)
x = 1 * nul
document.write('<br>nul 转换为：' + x)
a = new Date()
x = 1 * a
document.write('<br>Date对象 转换为：' + x)
document.write("<p>其他类型转换为字符串：")
document.write('<br>123.45 转换为："' + 123.45 + '"')
document.write('<br>true 转换为："' + true + '"')
document.write('<br>false 转换为："' + false + '"')
document.write('<br>nul 转换为："' + nul + '"')
var a1
document.write('<br>' + a1 + '转换为："' + a1 + '"')
a = new Date()
document.write('<br>Date对象 转换为："' + a + '"')
document.write("<p>其他类型转换为逻辑值：")
x = "abc" ? true : false
document.write('<br>"abc" 转换为：' + x)
x = "" ? true : false
document.write('<br>空字符串"" 转换为：' + x)
x = 0 ? true : false
document.write('<br>0 转换为：' + x)
x = (1 * "abc") ? true : false
document.write('<br>NaN 转换为：' + x)
x = 123 ? true : false
document.write('<br>123 转换为：' + x)
var abc
x = abc ? true : false
document.write('<br>' + abc + '转换为：' + x)
x = nul ? true : false
document.write('<br>nul 转换为：' + x)
a = new Date()
x = a ? true : false
document.write('<br>Date对象 转换为：' + x)
</script>
</body>
</html>
浏览器中的输出结果如图2-16所示。
图2-16 测试数据类型转换