《JavaScript高级程序设计》读书笔记 ---操作符一

时间:2022-05-14 10:41:56

一元操作符
只能操作一个值的操作符叫做一元操作符。一元操作符是ECMAScript 中最简单的操作符。

1. 递增和递减操作符
递增和递减操作符直接借鉴自C,而且各有两个版本:前置型和后置型。顾名思义,前置型应该位于要操作的变量之前,而后置型则应该位于要操作的变量之后。因此,在使用前置递增操作符给一个数值加1 时,要把两个加号(++)放在这个数值变量前面,如下所示:

var age = 29;
++age;

在这个例子中,前置递增操作符把age 的值变成了30(为29 加上了1)。实际上,执行这个前置递增操作与执行以下操作的效果相同:
var age = 29;
age = age + 1;

执行前置递减操作的方法也类似,结果会从一个数值中减去1。使用前置递减操作符时,要把两个减号(--)放在相应变量的前面,如下所示:
var age = 29;
--age;
这样,age 变量的值就减少为28(从29 中减去了1)。
执行前置递增和递减操作时,变量的值都是在语句被求值以前改变的。(在计算机科学领域,这种情况通常被称作副效应。)请看下面这个例子。

var age = 29;
var anotherAge = --age + 2;
alert(age); // 输出28
alert(anotherAge); // 输出30

这个例子中变量anotherAge 的初始值等于变量age 的值前置递减之后加2。由于先执行了减法操作,age 的值变成了28,所以再加上2 的结果就是30。
由于前置递增和递减操作与执行语句的优先级相等,因此整个语句会从左至右被求值。再看一个例子:
var num1 = 2;
var num2 = 20;
var num3 = --num1 + num2; // 等于21
var num4 = num1 + num2; // 等于21

在这里,num3 之所以等于21 是因为num1 先减去了1 才与num2 相加。而变量num4 也等于21 是因为相应的加法操作使用了num1 减去1 之后的值。
后置型递增和递减操作符的语法不变(仍然分别是++和--),只不过要放在变量的后面而不是前面。
后置递增和递减与前置递增和递减有一个非常重要的区别,即递增和递减操作是在包含它们的语句被求值之后才执行的。这个区别在某些情况下不是什么问题,例如:
var age = 29;
age++;
把递增操作符放在变量后面并不会改变语句的结果,因为递增是这条语句的唯一操作。但是,当语句中还包含其他操作时,上述区别就会非常明显了。请看下面的例子:
var num1 = 2;
var num2 = 20;
var num3 = num1-- + num2; // 等于22
var num4 = num1 + num2; // 等于21

这里仅仅将前置递减改成了后置递减,就立即可以看到差别。在前面使用前置递减的例子中,num3和num4 最后都等于21。而在这个例子中,num3 等于22,num4 等于21。差别的根源在于,这里在计算num3 时使用了num1 的原始值(2)完成了加法计算,而num4 则使用了递减后的值(1)。
所有这4 个操作符对任何值都适用,也就是它们不仅适用于整数,还可以用于字符串、布尔值、浮点数值和对象。在应用于不同的值时,递增和递减操作符遵循下列规则。
 在应用于一个包含有效数字字符的字符串时,先将其转换为数字值,再执行加减1 的操作。字符串变量变成数值变量。
 在应用于一个不包含有效数字字符的字符串时,将变量的值设置为NaN(第4 章将详细讨论)。字符串变量变成数值变量。
 在应用于布尔值false 时,先将其转换为0 再执行加减1 的操作。布尔值变量变成数值变量。
 在应用于布尔值true 时,先将其转换为1 再执行加减1 的操作。布尔值变量变成数值变量。
 在应用于浮点数值时,执行加减1 的操作。
 在应用于对象时,先调用对象的valueOf()方法(第5 章将详细讨论)以取得一个可供操作的值。然后对该值应用前述规则。如果结果是NaN,则在调用toString()方法后再应用前述规则。对象变量变成数值变量。
以下示例展示了上面的一些规则:

var s1 = "2";
var s2 = "z";
var b = false;
var f = 1.1;
var o = {
  valueOf: function() {
    return -1;
    }
  };
s1++; // 值变成数值3
s2++; // 值变成NaN
b++; // 值变成数值1
f--; // 值变成0.10000000000000009(由于浮点舍入错误所致)
o--; // 值变成数值-2

2. 一元加和减操作符

绝大多数开发人员对一元加和减操作符都不会陌生,而且这两个ECMAScript 操作符的作用与数学书上讲的完全一样。一元加操作符以一个加号(+)表示,放在数值前面,对数值不会产生任何影响,如下面的例子所示:
var num = 25;
num = +num; // 仍然是25
不过,在对非数值应用一元加操作符时,该操作符会像Number()转型函数一样对这个值执行转换。
换句话说,布尔值false 和true 将被转换为0 和1,字符串值会被按照一组特殊的规则进行解析,而对象是先调用它们的valueOf()和(或)toString()方法,再转换得到的值。
下面的例子展示了对不同数据类型应用一元加操作符的结果:
var s1 = "01";
var s2 = "1.1";
var s3 = "z";
var b = false;
var f = 1.1;
var o = {
  valueOf: function() {
    return -1;
  }
};
s1 = +s1; // 值变成数值1
s2 = +s2; // 值变成数值1.1
s3 = +s3; // 值变成NaN
b = +b; // 值变成数值0
f = +f; // 值未变,仍然是1.1
o = +o; // 值变成数值-1

一元减操作符主要用于表示负数,例如将1 转换成1。下面的例子演示了这个简单的转换过程:
var num = 25;
num = -num; // 变成了-25

在将一元减操作符应用于数值时,该值会变成负数(如上面的例子所示)。而当应用于非数值时,一元减操作符遵循与一元加操作符相同的规则,最后再将得到的数值转换为负数,如下面的例子所示:
var s1 = "01";
var s2 = "1.1";
var s3 = "z";
var b = false;
var f = 1.1;
var o = {
  valueOf: function() {
    return -1;
  }
};
s1 = -s1; // 值变成了数值-1
s2 = -s2; // 值变成了数值-1.1
s3 = -s3; // 值变成了NaN
b = -b; // 值变成了数值0
f = -f; // 变成了-1.1
o = -o; // 值变成了数值1

一元加和减操作符主要用于基本的算术运算,也可以像前面示例所展示的一样用于转换数据类型。

位操作符

位操作符用于在最基本的层次上,即按内存中表示数值的位来操作数值。

1. 按位非(NOT)
按位非操作符由一个波浪线(~)表示,执行按位非的结果就是返回数值的反码。按位非是ECMAScript 操作符中少数几个与二进制计算有关的操作符之一。下面看一个例子:
var num1 = 25; // 二进制00000000000000000000000000011001
var num2 = ~num1; // 二进制11111111111111111111111111100110
alert(num2); // -26

这里,对25 执行按位非操作,结果得到了-26。这也验证了按位非操作的本质:操作数的负值减1。
因此,下面的代码也能得到相同的结果:
var num1 = 25;
var num2 = -num1 - 1;
alert(num2); // "-26"

虽然以上代码也能返回同样的结果,但由于按位非是在数值表示的最底层执行操作,因此速度更快。

2. 按位与(AND)

按位与操作符由一个和号字符(&)表示,它有两个操作符数。从本质上讲,按位与操作就是将两个数值的每一位对齐,然后根据下表中的规则,对相同位置上的两个数执行AND 操作:

《JavaScript高级程序设计》读书笔记 ---操作符一

简而言之,按位与操作只在两个数值的对应位都是1 时才返回1,任何一位是0,结果都是0。

下面看一个对25 和3 执行按位与操作的例子:
var result = 25 & 3;
alert(result); //1

3. 按位或(OR)
按位或操作符由一个竖线符号(|)表示,同样也有两个操作数。按位或操作遵循下面这个真值表。

《JavaScript高级程序设计》读书笔记 ---操作符一

由此可见,按位或操作在有一个位是1 的情况下就返回1,而只有在两个位都是0 的情况下才返回0。
如果在前面按位与的例子中对25 和3 执行按位或操作,则代码如下所示:
var result = 25 | 3;
alert(result); //27

25 与3 按位或的结果是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,因此可以把每个1 直接放到结果中。二进制码11011 等于十进制值27。

4. 按位异或(XOR)
按位异或操作符由一个插入符号(^)表示,也有两个操作数。以下是按位异或的真值表。

《JavaScript高级程序设计》读书笔记 ---操作符一

按位异或与按位或的不同之处在于,这个操作在两个数值对应位上只有一个1 时才返回1,如果对应的两位都是1 或都是0,则返回0。
对25 和3 执行按位异或操作的代码如下所示:
var result = 25 ^ 3;
alert(result); //26

25 与3 按位异或的结果是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,但第一位上则都是1,因此结果的第一位变成了0。而其他位上的1 在另一个数值中都没有对应的1,可以直接放到结果中。二进制码11010 等于十进制值26(注意这个结果比执行按位或时小1)。

5. 左移
左移操作符由两个小于号(<<)表示,这个操作符会将数值的所有位向左移动指定的位数。例如,如果将数值2(二进制码为10)向左移动5 位,结果就是64(二进制码为1000000),代码如下所示:
var oldValue = 2; // 等于二进制的10
var newValue = oldValue << 5; // 等于二进制的1000000,十进制的64

注意,在向左移位后,原数值的右侧多出了5 个空位。左移操作会以0 来填充这些空位,以便得到的结果是一个完整的32 位二进制数(见图3-2)。

6. 有符号的右移
有符号的右移操作符由两个大于号(>>)表示,这个操作符会将数值向右移动,但保留符号位(即正负号标记)。有符号的右移操作与左移操作恰好相反,即如果将64 向右移动5 位,结果将变回2:
var oldValue = 64; // 等于二进制的1000000
var newValue = oldValue >> 5; // 等于二进制的10 ,即十进制的2

7. 无符号右移
无符号右移操作符由3 个大于号(>>>)表示,这个操作符会将数值的所有32 位都向右移动。对正数来说,无符号右移的结果与有符号右移相同。仍以前面有符号右移的代码为例,如果将64 无符号右移5 位,结果仍然还是2:
var oldValue = 64; // 等于二进制的1000000
var newValue = oldValue >>> 5; // 等于二进制的10 ,即十进制的2

 布尔操作符

在一门编程语言中,布尔操作符的重要性堪比相等操作符。如果没有测试两个值关系的能力,那么诸如if...else 和循环之类的语句就不会有用武之地了。布尔操作符一共有3 个:非(NOT)、与(AND)和或(OR)。

1. 逻辑非

逻辑非操作符由一个叹号(!)表示,可以应用于ECMAScript 中的任何值。无论这个值是什么数据类型,这个操作符都会返回一个布尔值。逻辑非操作符首先会将它的操作数转换为一个布尔值,然后再对其求反。也就是说,逻辑非操作符遵循下列规则:
 如果操作数是一个对象,返回false;
 如果操作数是一个空字符串,返回true;
 如果操作数是一个非空字符串,返回false;
 如果操作数是数值0,返回true;
 如果操作数是任意非0 数值(包括Infinity),返回false;
 如果操作数是null,返回true;
 如果操作数是NaN,返回true;
 如果操作数是undefined,返回true。
下面几个例子展示了应用上述规则的结果:
alert(!false); // true
alert(!"blue"); // false
alert(!0); // true
alert(!NaN); // true
alert(!""); // true
aler t(!12345); // false

逻辑非操作符也可以用于将一个值转换为与其对应的布尔值。而同时使用两个逻辑非操作符,实际上就会模拟Boolean()转型函数的行为。其中,第一个逻辑非操作会基于无论什么操作数返回一个布尔值,而第二个逻辑非操作则对该布尔值求反,于是就得到了这个值真正对应的布尔值。当然,最终结果与对这个值使用Boolean()函数相同,如下面的例子所示:

alert(!!"blue"); //true
alert(!!0); //false
alert(!!NaN); //false
alert(!!""); //false
alert(!!12345); //true

2. 逻辑与

逻辑与操作符由两个和号(&&)表示,有两个操作数,如下面的例子所示:
var result = true && false;
逻辑与的真值表如下:

《JavaScript高级程序设计》读书笔记 ---操作符一

逻辑与操作可以应用于任何类型的操作数,而不仅仅是布尔值。在有一个操作数不是布尔值的情况下,逻辑与操作就不一定返回布尔值;此时,它遵循下列规则:
 如果第一个操作数是对象,则返回第二个操作数;
 如果第二个操作数是对象,则只有在第一个操作数的求值结果为true 的情况下才会返回该对象;
 如果两个操作数都是对象,则返回第二个操作数;
 如果有一个操作数是null,则返回null;
 如果有一个操作数是NaN,则返回NaN;
 如果有一个操作数是undefined,则返回undefined。
逻辑与操作属于短路操作,即如果第一个操作数能够决定结果,那么就不会再对第二个操作数求值。
对于逻辑与操作而言,如果第一个操作数是false,则无论第二个操作数是什么值,结果都不再可能是true 了。来看下面的例子:
var found = true;
var result = (found && someUndefinedVariable); // 这里会发生错误
alert(result); // 这一行不会执行

在上面的代码中,当执行逻辑与操作时会发生错误,因为变量someUndefinedVariable 没有声明。由于变量found 的值是true,所以逻辑与操作符会继续对变量someUndefinedVariable 求值。
但someUndefinedVariable 尚未定义,因此就会导致错误。这说明不能在逻辑与操作中使用未定义的值。如果像下面这个例中一样,将found 的值设置为false,就不会发生错误了:
var found = false;
var result = (found && someUndefinedVariable); // 不会发生错误
alert(result); // 会执行("false")

在这个例子中,警告框会显示出来。无论变量someUndefinedVariable 有没有定义,也永远不会对它求值,因为第一个操作数的值是false。而这也就意味着逻辑与操作的结果必定是false,根本用不着再对&&右侧的操作数求值了。在使用逻辑与操作符时要始终铭记它是一个短路操作符。

 3. 逻辑或

逻辑或操作符由两个竖线符号(||)表示,有两个操作数,如下面的例子所示:
var result = true || false;
逻辑或的真值表如下:

《JavaScript高级程序设计》读书笔记 ---操作符一

与逻辑与操作相似,如果有一个操作数不是布尔值,逻辑或也不一定返回布尔值;此时,它遵循下列规则:
 如果第一个操作数是对象,则返回第一个操作数;
 如果第一个操作数的求值结果为false,则返回第二个操作数;
 如果两个操作数都是对象,则返回第一个操作数;
 如果两个操作数都是null,则返回null;
 如果两个操作数都是NaN,则返回NaN;
 如果两个操作数都是undefined,则返回undefined。
与逻辑与操作符相似,逻辑或操作符也是短路操作符。也就是说,如果第一个操作数的求值结果为true,就不会对第二个操作数求值了。下面看一个例子:
var found = true;
var result = (found || someUndefinedVariable); // 不会发生错误
alert(result); // 会执行("true")

这个例子跟前面的例子一样,变量someUndefinedVariable 也没有定义。但是,由于变量found的值是true,而变量someUndefinedVariable 永远不会被求值,因此结果就会输出"true"。如果像下面这个例子一样,把found 的值改为false,就会导致错误:
var found = false;
var result = (found || someUndefinedVariable); // 这里会发生错误
alert(result); // 这一行不会执行

我们可以利用逻辑或的这一行为来避免为变量赋null 或undefined 值。例如:
var myObject = preferredObject || backupObject;
在这个例子中,变量myObject 将被赋予等号后面两个值中的一个。变量preferredObject 中包含优先赋给变量myObject 的值,变量backupObject 负责在preferredObject 中不包含有效值的情况下提供后备值。如果preferredObject 的值不是null,那么它的值将被赋给myObject;如果是null,则将backupObject 的值赋给myObject。ECMAScript 程序的赋值语句经常会使用这种模式,本书也将采用这种模式。

乘性操作符

ECMAScript 定义了3 个乘性操作符:乘法、除法和求模。这些操作符与Java、C 或者Perl 中的相应操作符用途类似,只不过在操作数为非数值的情况下会执行自动的类型转换。如果参与乘性计算的某个操作数不是数值,后台会先使用Number()转型函数将其转换为数值。也就是说,空字符串将被当作0,布尔值true 将被当作1。

1. 乘法
乘法操作符由一个星号(*)表示,用于计算两个数值的乘积。其语法类似于C,如下面的例子所示:
var result = 34 * 56;
在处理特殊值的情况下,乘法操作符遵循下列特殊的规则:
 如果操作数都是数值,执行常规的乘法计算,即两个正数或两个负数相乘的结果还是正数,而如果只有一个操作数有符号,那么结果就是负数。如果乘积超过了ECMAScript 数值的表示范围,则返回Infinity 或-Infinity;
 如果有一个操作数是NaN,则结果是NaN;
 如果是Infinity 与0 相乘,则结果是NaN;
 如果是Infinity 与非0 数值相乘,则结果是Infinity 或-Infinity,取决于有符号操作数的符号;
 如果是Infinity 与Infinity 相乘,则结果是Infinity;
 如果有一个操作数不是数值,则在后台调用Number()将其转换为数值,然后再应用上面的规则。

2. 除法
除法操作符由一个斜线符号(/)表示,执行第二个操作数除第一个操作数的计算,如下面的例子所示:
var result = 66 / 11;
与乘法操作符类似,除法操作符对特殊的值也有特殊的处理规则。这些规则如下:
 如果操作数都是数值,执行常规的除法计算,即两个正数或两个负数相除的结果还是正数,而如果只有一个操作数有符号,那么结果就是负数。如果商超过了ECMAScript 数值的表示范围,则返回Infinity 或-Infinity;
 如果有一个操作数是NaN,则结果是NaN;
 如果是Infinity 被Infinity 除,则结果是NaN;
 如果是零被零除,则结果是NaN;
 如果是非零的有限数被零除,则结果是Infinity 或-Infinity,取决于有符号操作数的符号;
 如果是Infinity 被任何非零数值除,则结果是Infinity 或-Infinity,取决于有符号操作数的符号;

 如果有一个操作数不是数值,则在后台调用Number()将其转换为数值,然后再应用上面的规则。

3. 求模
求模(余数)操作符由一个百分号(%)表示,用法如下:
var result = 26 % 5; // 等于1
与另外两个乘性操作符类似,求模操作符会遵循下列特殊规则来处理特殊的值:
 如果操作数都是数值,执行常规的除法计算,返回除得的余数;
 如果被除数是无穷大值而除数是有限大的数值,则结果是NaN;
 如果被除数是有限大的数值而除数是零,则结果是NaN;
 如果是Infinity 被Infinity 除,则结果是NaN;
 如果被除数是有限大的数值而除数是无穷大的数值,则结果是被除数;
 如果被除数是零,则结果是零;
 如果有一个操作数不是数值,则在后台调用Number()将其转换为数值,然后再应用上面的规则。

加性操作符

1. 加法
加法操作符(+)的用法如下所示:
var result = 1 + 2;
如果两个操作符都是数值,执行常规的加法计算,然后根据下列规则返回结果:
 如果有一个操作数是NaN,则结果是NaN;
 如果是Infinity 加Infinity,则结果是Infinity;
 如果是-Infinity 加-Infinity,则结果是-Infinity;
 如果是Infinity 加-Infinity,则结果是NaN;
 如果是+0 加+0,则结果是+0;
 如果是0 加0,则结果是0;
 如果是+0 加0,则结果是+0。
不过,如果有一个操作数是字符串,那么就要应用如下规则:
 如果两个操作数都是字符串,则将第二个操作数与第一个操作数拼接起来;
 如果只有一个操作数是字符串,则将另一个操作数转换为字符串,然后再将两个字符串拼接起来。
如果有一个操作数是对象、数值或布尔值,则调用它们的toString()方法取得相应的字符串值,然后再应用前面关于字符串的规则。对于undefined 和null,则分别调用String()函数并取得字符串"undefined"和"null"。
下面来举几个例子:
var result1 = 5 + 5; // 两个数值相加
alert(result1); // 10

var result2 = 5 + "5"; // 一个数值和一个字符串相加
aler t(result2); // "55"

以上代码演示了加法操作符在两种模式下的差别。第一行代码演示了正常的情况,即5+5 等于10(数值)。但是,如果将一个操作数改为字符串"5",结果就变成了"55"(字符串值),因为第一个操作数也被转换成了"5"。
忽视加法操作中的数据类型是ECMAScript 编程中最常见的一个错误。再来看一个例子:
var num1 = 5;
var num2 = 10;
var message = "The sum of 5 and 10 is " + num1 + num2;
alert(message); // "The sum of 5 and 10 is 510"

在这个例子中,变量message 的值是执行两个加法操作之后的结果。有人可能以为最后得到的字符串是"The sum of 5 and 10 is 15",但实际的结果却是"The sum of 5 and 10 is 510"。
之所以会这样,是因为每个加法操作是独立执行的。第一个加法操作将一个字符串和一个数值(5)拼接了起来,结果是一个字符串。而第二个加法操作又用这个字符串去加另一个数值(10),当然也会得到一个字符串。如果想先对数值执行算术计算,然后再将结果与字符串拼接起来,应该像下面这样使用圆括号:
var num1 = 5;
var num2 = 10;
var message = "The sum of 5 and 10 is " + (num1 + num2);
alert(message); //"The sum of 5 and 10 is 15"

在这个例子中,一对圆括号把两个数值变量括在了一起,这样就会告诉解析器先计算其结果,然后再将结果与字符串拼接起来。因此,就得到了结果"The sum of 5 and 10 is 15"。

2. 减法
减法操作符(-)是另一个极为常用的操作符,其用法如下所示:
var result = 2 - 1;
与加法操作符类似,ECMAScript 中的减法操作符在处理各种数据类型转换时,同样需要遵循一些特殊规则,如下所示:
 如果两个操作符都是数值,则执行常规的算术减法操作并返回结果;
 如果有一个操作数是NaN,则结果是NaN;
 如果是Infinity 减Infinity,则结果是NaN;
 如果是-Infinity 减-Infinity,则结果是NaN;
 如果是Infinity 减-Infinity,则结果是Infinity;
 如果是-Infinity 减Infinity,则结果是-Infinity;
 如果是+0 减+0,则结果是+0;
 如果是+0 减-0,则结果是-0;

 如果是-0 减-0,则结果是+0;
 如果有一个操作数是字符串、布尔值、null 或undefined,则先在后台调用Number()函数将其转换为数值,然后再根据前面的规则执行减法计算。如果转换的结果是NaN,则减法的结果就是NaN;
 如果有一个操作数是对象,则调用对象的valueOf()方法以取得表示该对象的数值。如果得到的值是NaN,则减法的结果就是NaN。如果对象没有valueOf()方法,则调用其toString()方法并将得到的字符串转换为数值。
下面几个例子展示了上面的规则:
var result1 = 5 - true; // 4,因为true 被转换成了1
var result2 = NaN - 1; // NaN
var result3 = 5 - 3; // 2
var result4 = 5 - ""; // 5,因为"" 被转换成了0
var result5 = 5 - "2"; // 3,因为"2"被转换成了2
var result6 = 5 - null; // 5,因为null 被转换成了0