JavaScript快速入门（五）——表达式运算

赋值运算

赋值运算的形式为左值 = 右值。如果同个表达式中有多个赋值运算，则从右到左运算。例如：

a = b = c; // 和下面两行等价

b = c;
a = b;

另外一种赋值运算的形式叫做复合赋值运算符，形式为左值 op= 右值，其中op=表示部分运算符和=的结合，a op= b和 a = a op b等价。例如下面两句是等价的：

a += b;
a = a + b;

其中op可以是下列运算符之一： +,-,*,/,%,<<,>>,>>>,&,|,^

 

数值运算

数值运算的运算元都是数值类型，运算符是+,-,*,/,%中的一个，形式为a op b，目标类型也是数值类型。例如：

var a = 3 + 5; // a == 8

特别的，++,--分别表示递增和递减，形式为a op或者op a，a++效果等同与a = a + 1。例如：

var a = 0;
a++; // a = 1

要特别注意的是，++a跟a++是不一样的，在复杂运算里面。++a表示先将a递增再将更新过的a值参与运算，而a++表示先将原来的a值参与运算再递增。例如：

var a = 1;
var b = 1 + (a++); // b == 2
console.log(a); // 2
b = 1 + (++a);  // b == 4
console.log(a); // 3

当然，如果一条语句里只有递增语句，则不需要区分。

var a = 1;
a++; // a == 2
++a; // a == 3

位运算

位运算的运算元和目标类型都是数值类型，运算符为~,&,|,^,<<,>>等中的一个。特别注意的是，位运算是针对二进制数进行运算，即会先将数值转化为二进制，运算结果也是二进制数，当然，我们看到的时候已经被转化为十进制数了，如果没有特别指定的话。

从ECMAScript的整数说起

ECMAScript 整数有两种类型，即有符号整数（允许用正数和负数）和无符号整数（只允许用正数）。在 ECMAScript 中，所有整数字面量默认都是有符号整数，这意味着什么呢？

有符号整数使用 31 位表示整数的数值，用第 32 位表示整数的符号，0 表示正数，1 表示负数。数值范围从 -2147483648 到 2147483647。

可以以两种不同的方式存储二进制形式的有符号整数，一种用于存储正数，一种用于存储负数。正数是以真二进制形式存储的，前 31 位中的每一位都表示 2 的幂，从第 1 位（位 0）开始，表示 2⁰，第 2 位（位 1）表示 2¹。没用到的位用 0 填充，即忽略不计。例如，下图展示的是数 18 的表示法。

18 的二进制版本只用了前 5 位，它们是这个数字的有效位。把数字转换成二进制字符串，就能看到有效位：

var iNum = 18;
alert(iNum.toString(2));	//输出 "10010"

这段代码只输出 "10010"，而不是 18 的 32 位表示。其他的数位并不重要，因为仅使用前 5 位即可确定这个十进制数值。如下图所示：

负数也存储为二进制代码，不过采用的形式是二进制补码。计算数字二进制补码的步骤有三步：

1. 确定该数字的非负版本的二进制表示（例如，要计算 -18的二进制补码，首先要确定 18 的二进制表示）
2. 求得二进制反码，即要把 0 替换为 1，把 1 替换为 0
3. 在二进制反码上加 1

要确定 -18 的二进制表示，首先必须得到 18 的二进制表示，如下所示：

0000 0000 0000 0000 0000 0000 0001 0010

接下来，计算二进制反码，如下所示：

1111 1111 1111 1111 1111 1111 1110 1101

最后，在二进制反码上加 1，如下所示：

1111 1111 1111 1111 1111 1111 1110 1101
                                      1
---------------------------------------
1111 1111 1111 1111 1111 1111 1110 1110

因此，-18 的二进制表示即 1111 1111 1111 1111 1111 1111 1110 1110。记住，在处理有符号整数时，开发者不能访问 31 位。

有趣的是，把负整数转换成二进制字符串后，ECMAScript 并不以二进制补码的形式显示，而是用数字绝对值的标准二进制代码前面加负号的形式输出。例如：

var iNum = -18;
alert(iNum.toString(2));	//输出 "-10010"

这段代码输出的是 "-10010"，而非二进制补码，这是为避免访问位 31。为了简便，ECMAScript 用一种简单的方式处理整数，使得开发者不必关心它们的用法。

另一方面，无符号整数把最后一位作为另一个数位处理。在这种模式中，第 32 位不表示数字的符号，而是值 2³¹。由于这个额外的位，无符号整数的数值范围为 0 到 4294967295。对于小于 2147483647 的整数来说，无符号整数看来与有符号整数一样，而大于 2147483647 的整数则要使用位 31（在有符号整数中，这一位总是 0）。

把无符号整数转换成字符串后，只返回它们的有效位。

注意：所有整数字面量都默认存储为有符号整数。只有 ECMAScript 的位运算符才能创建无符号整数。

NOT运算(~)

非运算 NOT 由否定号（~）表示，它是一元运算符（运算元只有一个），形式为~a。

位运算 NOT 是三步的处理过程：

1. 把运算数转换成 32 位数字
2. 把二进制数转换成它的二进制反码
3. 把二进制数转换成浮点数

例如：

var iNum1 = 25;		//25 等于 00000000000000000000000000011001
var iNum2 = ~iNum1;	//转换为 11111111111111111111111111100110
alert(iNum2);		//输出 "-26"

位运算 NOT 实质上是对数字求负，然后减 1，因此 25 变 -26。用下面的方法也可以得到同样的方法：

var iNum1 = 25;
var iNum2 = -iNum1 -1;
alert(iNum2);	//输出 -26

AND运算(&)

与运算 AND 由和号（&）表示。它把每个数字中的数位对齐，然后用下面的规则对同一位置上的两个数位进行 AND 运算（当且仅当两个数位都是1时才返回1）：

第一个数字中的数位	第二个数字中的数位	结果
1	1	1
1	0	0
0	1	0
0	0	0

例如，要对数字 25 和 3 进行 AND 运算，代码如下所示：

var iResult = 25 & 3;
alert(iResult);	//输出 "1"

25 和 3 进行 AND 运算的结果是 1。为什么？分析如下：

 25 = 0000 0000 0000 0000 0000 0000 0001 1001
  3 = 0000 0000 0000 0000 0000 0000 0000 0011
---------------------------------------------
AND = 0000 0000 0000 0000 0000 0000 0000 0001

可以看出，在 25 和 3 中，只有一个数位（位 0）存放的都是 1，因此，其他数位生成的都是 0，所以结果为 1。

OR运算（|）

或运算 OR 由符号（|）表示。在计算每位时，OR 运算符采用下列规则（当且仅当两个数位都是0时才返回0）：

第一个数字中的数位	第二个数字中的数位	结果
1	1	1
1	0	1
0	1	1
0	0	0

仍然使用 AND 运算符所用的例子，对 25 和 3 进行 OR 运算，代码如下：

var iResult = 25 | 3;
alert(iResult);	//输出 "27"

25 和 3 进行 OR 运算的结果是 27：

25 = 0000 0000 0000 0000 0000 0000 0001 1001
 3 = 0000 0000 0000 0000 0000 0000 0000 0011
--------------------------------------------
OR = 0000 0000 0000 0000 0000 0000 0001 1011

可以看出，在两个数字中，共有 4 个数位存放的是 1，这些数位被传递给结果。二进制代码 11011 等于 27。

XOR运算（^）

异或运算 XOR 由符号（^）表示。XOR 不同于 OR，当有且只有一个数位存放的是 1 时，它才返回 1。真值表如下：

第一个数字中的数位	第二个数字中的数位	结果
1	1	0
1	0	1
0	1	1
0	0	0

对 25 和 3 进行 XOR 运算，代码如下：

var iResult = 25 ^ 3;
alert(iResult);	//输出 "26"

25 和 3 进行 XOR 运算的结果是 26：

 25 = 0000 0000 0000 0000 0000 0000 0001 1001
  3 = 0000 0000 0000 0000 0000 0000 0000 0011
---------------------------------------------
XOR = 0000 0000 0000 0000 0000 0000 0001 1010

可以看出，在两个数字中，共有 4 个数位存放的是 1，这些数位被传递给结果。二进制代码 11010 等于 26。

左移运算（<<）

左移运算由两个小于号表示（<<）。它把数字中的所有数位向左移动指定的数量。例如，把数字 2（等于二进制中的 10）左移 5 位，结果为 64（等于二进制中的 1000000）：

var iOld = 2;		//等于二进制 10
var iNew = iOld << 5;	//等于二进制 1000000 十进制 64

注意：在左移数位时，数字右边多出 5 个空位。左移运算用 0 填充这些空位，使结果成为完整的 32 位数字。

注意：左移运算保留数字的符号位。例如，如果把 -2 左移 5 位，得到的是 -64，而不是 64。“符号仍然存储在第 32 位中吗？”是的，不过这在 ECMAScript 后台进行，开发者不能直接访问第 32 个数位。即使输出二进制字符串形式的负数，显示的也是负号形式（例如，-2 将显示 -10。）

右移运算（>>）

有符号右移运算

有符号右移运算符由两个大于号表示（>>）。它把 32 位数字中的所有数位整体右移，同时保留该数的符号（正号或负号）。有符号右移运算符恰好与左移运算相反。例如，把 64 右移 5 位，将变为 2：

var iOld = 64;		//等于二进制 1000000
var iNew = iOld >> 5;	//等于二进制 10 十进制 2

同样，移动数位后会造成空位。这次，空位位于数字的左侧，但位于符号位之后。ECMAScript 用符号位的值填充这些空位，创建完整的数字，如下图所示：

无符号右移运算

无符号右移运算符由三个大于号（>>>）表示，它将无符号 32 位数的所有数位整体右移。对于正数，无符号右移运算的结果与有符号右移运算一样。

用有符号右移运算中的例子，把 64 右移 5 位，将变为 2：

var iOld = 64;		//等于二进制 1000000
var iNew = iOld >>> 5;	//等于二进制 10 十进制 2

对于负数，情况就不同了。

无符号右移运算用 0 填充所有空位。对于正数，这与有符号右移运算的操作一样，而负数则被作为正数来处理。

由于无符号右移运算的结果是一个 32 位的正数，所以负数的无符号右移运算得到的总是一个非常大的数字。例如，如果把 -64 右移 5 位，将得到 134217726。如何得到这种结果的呢？

要实现这一点，需要把这个数字转换成无符号的等价形式（尽管该数字本身还是有符号的），可以通过以下代码获得这种形式：

var iUnsigned64 = -64 >>> 0;

然后，用 Number 类型的 toString() 获取它的真正的位表示，采用的基为 2：

alert(iUnsigned64.toString(2));

这将生成 11111111111111111111111111000000，即有符号整数 -64 的二进制补码表示，不过它等于无符号整数 4294967232。

出于这种原因，使用无符号右移运算符要小心。

逻辑运算

逻辑运算分为两种，一种会改变目标数据类型，另一种则不会。前者的典型代表是逻辑非运算，无论运算元是什么类型，执行逻辑非运算后，都会被转化为bool值。例如：

var a = "123";
var b = !a; // false

而另一种形式则不改变目标类型，且支持布尔短路，包括“逻辑与”（&&）和“逻辑或”（||）运算。所谓布尔短路，指的是指判断第一个运算元就决定运算结果，而不需要处理第二个运算元。具体运算规则如下：

• 第一个运算元为真时，逻辑或运算返回第一个运算元（注意，没有改变类型），逻辑与运算返回第二个运算元
• 第一个运算元为假时，逻辑或运算返回第二个运算元，逻辑与运算返回第一个运算元

我们来举几个特殊点的例子：

function and(a, b) {
    return a && b;
}
function or(a, b) {
    return a || b;
}
var a = and("str", false); // a === false
var b = or("str", false);  // b === "str"
var c = and(0, "str2");    // c === 0
var d = or(0, "str2");     // d === "str2"

这种运算最常见的用法是处理实参。我们知道，JavaScript中的实参列表和形参列表可以长度不等，那么，如何处理不等的部分呢？我们举个例子：

function add(a, b) {
    return a + b;
}
var a = add(5); // NaN

结果是NaN，这明显不是我们想要的结果，我们更愿意它返回5。我们可以利用逻辑运算：

function add(a, b) {
    b = b || 0;
    return a + b;
}
var a = add(5);     // 5
var b = add(5, 2); // 7

如果形参长度大于实参长度，超过的部分将是undefined。而b = b || 0这句能在b为undefined（布尔值为false）的时候，把0赋给b，使得b仍然为数值类型，并参与运算。当然，这样处理还是很简陋的，比如当传入的b为非空字符串的时候，这个函数还是会出错，所以正确的做法应该是判断是不是数值类型，但在排除API使用者乱来的情况下，逻辑运算不失为一种好办法。

 

字符串运算

JavaScript中，有且只有一种字符串运算，那就是字符串连接。当然，字符串也可以参与其他运算，比如比较、等值、赋值等运算，但我们把它们放到其他分类去讲。string类型里自带的方法，例如切割字符串等等，也不属于我们这里讲的表达式运算。

字符串连接运算对应的运算符号是“+”。请注意，“+”是一个多义性符号，它既可以用于数值加法运算，也可以用于一元运算符，还能用于字符串连接。具体用于那种运算，由运算元的数量和类型决定。

当存在两个或以上的运算元，且开头两个运算元其中一个是字符串类型时，会将其他非字符串的转化为字符串，目标类型为字符串。例如：

var a = "str" + "ing"; // a === "string"
var b = "str" + 0;       // b === "str0"
var c = 0 + "str";        // c === "0str"
var d = "str" + undefined; // d === "strundefined"
var e = null + "str" + undefined; // e === "nullstrundefined"
var f = null + undefined + "str"; // f == NaN

比较运算

等值检测

等值检测的目的在于判断两个变量是否相同或相等。我们说相同与不相同，是指运算符“===”和“!==”的运算效果；说相等与不相等，是指运算符“==”和“!=”的运算效果。

我们可以用个表格来表示：

比较运算中的等值检测

名称	运算符	说明
相等	==	比较两个表达式，看是否相等
不等	!=	比较两个表达式，看是否不相等
严格相等	===	比较两个表达式，看值是否相等并具有相同的数据类型
不严格相等	!==	比较两个表达式，看是否具有不相等的值或数据类型不同

等值检测中相等运算规则

等值检测中的相等运算规则

类型	运算规则
两个值类型进行比较	转换成相同数据类型的值进行数据等值比较
值类型与引用类型比较	将引用类型的数据转换为值类型，再进行数据等值比较
两个引用类型比较	比较引用的地址

对值类型和引用类型概念模糊的可以去看之前的JavaScript变量一文。

等值检测中相同运算规则

等值检测中相同运算规则

类型	运算规则
两个值类型进行比较	数据类型不同，则必然不相同 数据类型相同时，进行数值等值比较
值类型与引用类型比较	必然不相同
两个引用类型比较	比较引用的地址

我们可以看到，两个引用类型比较，相同和相等并没有什么区别。我们看个例子：

var str1 = new String("str");
var str2 = new String("str");

console.log(str1 == str2); // false
console.log(str1 === str2); // false

序列检测

序列检测这个概念咋一听很拗口，换个说法其实就是比较大小。比较的运算符有四个：>、>=、<、<=，意义不用说大家都明白。

可以进行序列检测的数据类型有三种，boolean、string和number。它们的序列值如下表所示：

可比较序列的类型	序列值
boolean	0~1
string	0~255（*注1）
number	NEGATIVE_INFINITY~POSITIVE_INFINITY（*注2）

*注1：在一般语言中，字符（char）这种数据类型是按ASCII码排序的。JavaScript中不存在字符类型，但字符串中的每一个字符，都将作为单一字符参与序列检测。

*注2：表示负无穷到正无穷，实际上是有界限的，只不过这个界限达到了10^308级别（可以通过Number.MAX_VALUE查看），我们一般认为达不到。值NaN没有序列值，任何值（包括NaN本身）与NaN进行序列检测都将得到false

序列检测的运算规则如下表：

序列检测的运算规则

类型	运算规则
两个值类型进行比较	直接比较数据在序列中的大小
值类型与引用类型比较	将引用类型的数据转换为值类型数据，再比较数据在序列中的大小
两个引用类型比较	无意义，总是返回false

函数调用

这部分内容在上一节的JavaScript函数中有详细解说，就不细表了。有一点要说的是，运算符“( )”，只能在函数或指向某函数的变量后，否则，将会触发异常。

 

特殊作用的运算符

在JavaScript中有一些运算符，不直接产生运算效果，而是用于影响运算效果，这一类运算符的操作对象通常是“表达式”，而非“表达式的值”。另外的一些运算符不直接针对变量的值运算，而是针对变量运算。详细的运算符和它们的作用如下表：

目标	运算符	作用	备注
运算元	typeof	返回表示数据类型的字符串
运算元	instanceof	返回继承关系
运算元	in	返回成员关系
运算元	delete	删除成员
表达式	void	避免表达式返回值	使表达式总是返回值undefined
表达式	?:	按条件执行两个表达式之一	也称三目条件运算符
表达式	()	表达式分组和调整运算次序	也称优先级运算符
表达式	,	表达式顺序地连续执行	也称多重求值或逗号运算符

运算优先级

运算优先级在复杂运算中有着举足轻重的作用，例如我们看个表达式：

void 1+2

我们知道void的作用是让表达式总是返回undefined，那么，void操作的对象究竟是1还是1+2呢？换句话说，void和+哪个的优先级更高？

我们不妨假设，如果void的优先级更高，那么，void操作的数将是1，操作结果变成( void 1 ) + 2，也就是undefined+2，结果将是NaN。

而如果相反，+的优先级更高，那么，结果将是void (1 + 2)，也就是void 3也就是undefined。

那么，究竟是哪种呢？事实是NaN，也就是说，void的优先级更高。

我们将详细列出JavaScript中常见的运算符及它们的优先关系。注意，表格从上到下，优先级越来越低。

JavaScript中运算符的优先级

优先级	运算符	描述
最高	. [ ] ( )	对象成员存取  数组下标  函数调用
从	++ - ~ ~ delete new typeof void	一元运算符
上	* / %	乘法  除法  取模
到	+  -  +	加法  减法  字符串连接
下	<<  >>  >>>	移位
的	<  <= > >= instanceof	序列检测  继承关系
优	== != === !==	等值检测
先	&	按位与
级	^	按位异或
会	|	按位或
越	&&	逻辑与
来	||	逻辑或
越	?:	三元条件
低	= op=	赋值 运算赋值
最低	,	多重求值

同一优先级的不同或相同运算符同时出现在一个语句中时，按从左到右执行。

当然，类似CSS中的!important，JavaScript中也有一个强制改变优先级的符号，就是( )，括号内的运算会优先于括号外的运算。