js基础-运算符

1 运算符

ECMA-262描述了一组用于操作数据值的运算符，包括算术运算符、位运算符、关系运算符和相等运算符。

1.1 一元运算符

只能操作一个值的运算符叫做一元运算符。

1.递增和递减

递增（++）和递减（–）都有两种使用方式： 前置型 和 后置型 。
前置型 指的是运算符放在要操作的变量之前，而 后置型 则是运算符放在要操作的变量之后。

var age = 10; 

var age2 = 10; 

++age; 

--age; 

console.log(age);  // 11 

console.log(age2); //9 

执行前置递增和递减操作时，变量的值都是在语句被求值以前改变的（也就是先自增或自减，再和其他值进行操作）：

var num = 2; 

var age = ++num + 2; 

console.log(age); // 5 

在上面的例子中，在与2相加之前，num已经加1变成了2。

后置型递增和递减运算符不变（依然是++和–），不过除了要放到变量之后外，包含它们的语句是被求值之后才执行（先和其他值进行操作后，再自增或自减）：

var num = 2; 

var age = (num++) + 2; 

console.log(age); // 4 

console.log(num);  // 3 

注意：由于JavaScript会自动进行分号补全，因此不能在后增量运算符和操作数之间插入换行符

num 

++; 

这会报错

这4个操作符对任何值都适用，不过，当应用于不同的值时，递减和递增操作符会遵循下列规则：

• 当操作数是一个包含有效数字字符的字符串，系统会将其转换为数字值，再执行递减或递增。
• 当操作数是一个不包含有效数字字符的字符串，系统将变量的值设置为NaN
• 当操作数是布尔值，会将其转为数值（true转为1，false转为0）再操作。
• 当操作数是浮点数值，直接执行递减或递增
• 当操作数是对象，先调用对象的valueOf()方法取得一个可供操作的值，然后再遵循上面的三条规则。如果结果是NaN，则在调用toString()方法后再遵循上面的规则转换。

var a = '2'; 

var b = 'a'; 

var c = false; 

var d = 1.1; 

var o = { 

  valueOf: function() { 

    return -1; 

  } 

}; 

a++;  // 3 

b++;  // NaN 

c--;  // -1 

d--;  // 0.10000000000000009 （浮点数操作结果，类似0.1+0.2 != 0.3） 

o--;  -2 

2.一元加和减运算符

一元加（+）和减（-）运算符和数学上的含义一样，表示负正。

不过，对非数值应用一元加运算符时，该运算符就像Number()转型函数一样对这个值执行转换。（转换规则参考数据类型那一节中的Number()的转换规则）

一元减运算符对数值是表示负数，而对于非数值，转换规则和一元加（也就是和Number()）一样，然后将转换后的数值转为负数。

1.2 位运算符

位运算符是按内存中表示数值的位来操作数值。

ECMAScript中的数值都以IEEE-75464位格式存储，但位运算符并不直接操作64位的值，而是先将64位的值转换为32位，然后执行操作，最后将结果转换回64位。

对于有符号的整数，32位（从右往左，最右边为第一位）中的前31位用于表示整数的值，第32位用于表示数值的符号：0表示正数，1表示负数。这个表示符号的位叫做符号位。符号位的值决定了其他位数值的格式。

正数以纯二进制格式存储，31位中的每一位（从右往左）都表示2的幂。第一位（叫做位0）表示2^0，第二位表示2^1，以此类推。没有用到的位以0填充，可以忽略。

18 

二进制表示法：10010

2^4 × 1 + 2^3 × 0 + 2^2 × 0 + 2^1 × 1 + 2^0 × 0 = 18 

负数同样以二进制码存储，但使用的格式是二进制补码。

如何计算一个数值的二进制补码？需要3个步骤：

• 求这个数值绝对值的二进制码
• 求二进制反码，即0替换1，将1替换0
• 得到二进制反码加1

-18 

//第一步，求18的二进制码 

0000 0000 0000 0000 0000 0000 0001 0010 

 // 求反码，后加1 

1111 1111 1111 1111 1111 1111 1110 1101  

                                                                     1 

 1111 1111 1111 1111 1111 1111 1110 1110  // -18的二进制表示 

如果对非数值应用位运算符，会先使用Number()函数将该值转换为一个数值（自动转换），再进行位运算符操作，最后得到一个数值

当你去求负数的二进制时，ECMAScript会尽力向我们隐藏所有这些信息。比如：

var num = -18; 

console.log(num.toString(2));  //  "-10010" 

上面的代码对负数求二进制码，得到的结果只是这个负数绝对值的二进制码前面加上一个负号。

（1）按位非（NOT）

按位非运算符(~)进行 否运算 ，执行按位非的结果就是返回数值的反码。

~ 3  // -4 

上面的表达式对3进行否运算，得到-4。

//3的二进制码 

00000000000000000000000000000011

// 取反码 

11111111111111111111111111111100

//补码转为十进制的规则，在下面可以看到 

11111111111111111111111111111011  //减1

00000000000000000000000000000100 //再次取反得到~3的十进制，也就是4，加上负号，就是-4 

负数二进制码（补码）转换为十进制的规则：需要将这个数减去1，再取一次反，然后加上负号，才能得到这个负数对应的10进制值。

看起来是不是眼花缭乱，其实我们可以不用管里面的转换逻辑，只需记得按位非（否运算）就是 一个数与自身的取反值相加，等于-1 。

~3  + 3 = -1  => -1 - 3 = -4 == ~3 

2.按位与(AND)

使用按位与（&）运算符来进行 与运算 ，它有两个运算符数。

0 & 3  //0

0和1的二进制是00和11 

00 

11 

00 

运算规则是只有两个数值的对应位都是1时才返回1，其他情况返回0。

按位或（OR）

使用按位或（|）运算符进行 或运算 .

0 | 3  // 3

00 

11 

11 

或运算的规则是只要有一个位是1就返回1，只有两个位都是0时才返回0

位运算只对整数有效，遇到小数时，会将小数部分舍去，只保留整数部分。所以，将一个小数与0进行或运算，等同于对该数去除小数部分，即取整数位。

4.按位异或（XOR）

使用按位异或（^）来进行 异或运算 。

0 ^ 3  //  3 

00 

11 

11 

异或运算的规则是两个数值的对应位上只有一个1时才返回1，其他情况返回0.

5.左移

左移运算符（<<），这个运算符会将所有位向左移动指定的位数，尾部补0。

2 << 5  // 64 

2的二进制码 

10 

1000000 

左移可看做是数值乘以2的指定次方

注意：左移不会影响操作数的符号位，也就是说，-2向左移动5位后，是-64

6.右移

（1）有符号的右移

有符号的右移（>>）将数值向右移动，但保留符号位（即正负号标记，也就是第32位）

64 >> 5  // 2 

1000000 

10

-64 >> 5  //-2 

有符号的右移可看做是数值除以2的指定次方

（2）无符号的右移

无符号的右移（>>>），这个运算符会将数值的所有32位向右移动。对正数来说，无符号右移的结果与有符号右移相同：

64 >>> 5  //2 

但负数就不一样了，无符号右移是以0来填充空位的，所以无符号右移得到的结果都是正数。

-64 >>> 5  // 134217726 

有一点需要特别注意，位运算符只对整数起作用，如果一个运算子不是整数，会自动转为整数后再执行。

1.3 布尔运算符

布尔运算符是用来比较两个值的关系的。

1. 逻辑非（or）

逻辑非（!）可以应用于JavaScript中的任何值，最终都会返回一个布尔值。

逻辑非运算符首先会将它的操作数转换为一个布尔值，然后再取反。

逻辑非规则 ：

• 如果操作数是一个对象、非空字符串、任意非0数值（包括Infinity），则返回false
• 如果操作数是空字符串、数值0、null、undefined、NaN，则返回true

如果同时使用两个（!!），就会像使用Boolean()转型函数一样的转换逻辑。

!false  // true 

!'tg'  // false 

!''   // true

!!0  //false 

2.逻辑与

逻辑与（&&）有两个操作数，如果是布尔值，只有两个都是true时，才会返回true，否则返回false

 var isTrue = true && false;  //false 

如果不是布尔值，它遵循下面的规则：

• 如果第一个操作数是对象，则返回第二个操作数
• 如果第二个操作数是对象，则只有在第一个操作数的求值为true时才会返回第二个操作数
• 如果有一个操作数是null，则返回null
• 如果有一个操作数是NaN，则返回NaN
• 如果有一个操作数是undefined，则返回undefined

逻辑与操作符也就是先将第一个操作数转换为Boolean类型判断是true或false，再根据结果决定是否执行第二个操作数

0 && 'tg' ;  //  0 

{} && 'tg';  // "tg" 

逻辑与操作属于短路操作，也就是说如果第一个操作数能够决定结果（等于false时），就不会再对第二个操作数求值。

3.逻辑或

逻辑或（||）也有两个操作数。

如果两个操作数都是布尔值，则有一个为true时，就返回true，否则返回false。

如果有一个操作数不是布尔值，则遵循下列规则：

• 如果第一个操作数是对象，则返回第一个操作数
• 如果第一个操作数的求值结果是false，则返回第二个操作数
• 如果两个操作数都是对象，则返回第一个操作数
• 如果两个操作数都是null，则返回null
• 如果两个操作数都是NaN，则返回NaN
• 如果两个操作数都是undefined，则返回undefined

逻辑或也是短路运算符，也就是说，如果第一个操作数的求值结果为true，就不会对第二个操作数求值了。

true || 'tg';  // true 

0  || 'tg';   // "tg" 

一般情况下，我们可以使用逻辑或来避免变量赋null或undefined值：

function test(name){ 

name = name || 'tg'; 

console.log(name); 

} 

test();  // "tg" 

test('tg2');  // "tg2" 

上面的例子，表示当调用test()方法不传参时，name赋予一个默认值”tg”；如果带有参数，则使用参数值。

注意：逻辑与（&&）和逻辑或（||）返回的都是运算值。

1.4 乘性运算符

ECMAScript定义了3个乘性运算符：乘法、除法和求模。

当操作数是非数值时，会执行自动的类型转换。如果操作数不是数值，会先使用Number()转型函数将其转换为数值（后台自动），再进行运算。

1.乘法

乘法运算符( )，用于计算两个数值的乘积。

处理特殊值时，乘法运算符会遵循下列规则：

• 如果操作数都是数值，但乘积超过了ECMAScript数值范围，则返回Infinity或-Infinity
• 如果有一个操作数是NaN，结果是NaN
• 如果是Infinity乘以0，结果是NaN
• 如果是Infinity与非0数值相乘，结果是Infinity或-Infinity，取决于非0数值的符号
• 如果是Infinity与Infinity相乘，结果是Infinity
• 如果有一个操作数不是数值，则在后台调用Number()将其转换为数值，然后遵循上面的规则

console.log(1  NaN);  // NaN 

console.log( Infinity * 2);  // Infinity 

console.log(Infinity * 0);  // NaN 

console.log(Infinity * Infinity);  // Infinity 

2.除法

除法运算符（/），执行第二个操作数除第一个操作数计算。

处理特殊值，规则如下：

• 如果操作数都是数值，但商超过了ECMAScript的表示范围，则返回Infinity或-Infinity
• 如果有一个操作数是NaN，结果是NaN
• 如果是Infinity被Infinity除，结果是NaN
• 如果是零被零除，结果是NaN
• 如果是非零的有限数被零除，结果是Infinity或-Infinity，取决于有符号的操作数
• 如果是Infinity被任何非零数值除，结果是Infinity或-Infinity
• 如果有一个操作数不是数值，则在后台调用Number()将其转换为数值，然后遵循上面的规则。

console.log(NaN / 1); // NaN 

console.log(0 / 0);  // NaN 

console.log(1 / 0);  //  Infinity 

console.log(2 / Infinity);  // 0 

console.log(Infinity / Infinity);  // NaN 

console.log(Infinity / 2);   // Infinity 

3.求模

求模（余数）运算符（%）

处理特殊值，规则如下：

• 如果被除数是无穷大值而除数是有限大的数值，结果是NaN
• 如果被除数是有限大的数值而除数是零，结果是NaN
• 如果是Infinity被Infinity除，结果是NaN
• 如果被除数是有限大的数值而除数是无穷大的数值，结果是被除数
• 如果被除数是零，结果是零
• 如果有一个操作数不是数值，则在后台调用Number()将其转换为数值，然后遵循上面的规则。

console.log(5 % 3);  // 2 

1.5加性运算符

加性运算符也会在后台转换不同的数据类型。

1.加法

如果两个操作数都是数值，执行常规的加法计算，然后根据下面的规则返回结果：

• 如果有一个操作数是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”。

5 + 5   //10 

5 + '5"  // "55" 

如果你要在有字符串操作数的加法中执行常规的加法操作，应该使用圆括号将要相加的数值括起来：

'tg' + 5 + 5  //  "tg55" 

'tg" + (5 + 5)  //  "tg10" 

2.减法

减法运算符（-）

对于特殊值，减法操作会遵循下列规则：

• 如果有一个操作数是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()将其转换为数值，然后遵循上面的规则进行计算。
• 如果有一个操作数是对象，则调用对象的valueOf()方法以取得表示该对象的数值；如果该对象没有valueOf()方法，则调用其toString()方法将得到的字符串转换为数值，然后遵循上面的规则进行计算。

5 - true;  // 4 （true转换成1） 

5 - '2'    // 3 

5 - null;  // 5（null转换成0） 

1.6 关系运算符

小于（<）、大于（>）、小于等于（<=）和大于等于（>=）四个关系运算符用来对两个值进行比较，最后返回一个布尔值。

当使用了非数值时，则会遵循下列规则：

• 如果两个操作数是字符串，则比较两个字符串对应的字符编码值
• 如果一个操作数是数值，则将另一个操作数转换为一个数值，然后进行比较
• 如果一个操作数是对象，则调用这个对象的valueOf()方法，用得到的结果按照前面的规则比较。如果对象没有valueOf()方法，则调用toString()方法，并用得到的结果按照上面的规则进行比较。
• 如果一个操作数是布尔值，则先将其转换为数值，然后进行比较。

注意 ：在使用关系运算符比较两个字符串时，比较的是两个字符串中对应位置的每个字符的字符编码值（从左往右），经过逐个比较后，直到有胜负（也就是不相等时），再返还布尔值。

'abc' > 'abd'  //false 

'A' < 'a'   // true 

'23' < '3'  // true 

在上面的例子中，第一行代码会先比较”a”和”a”，然后是”b”和”b”，最后是”c”和”d”，由于c的字符编码值是63，d的字符编码值是64，所以返还false。

由于小写字母的字符编码值总是大于大写字母的字符编码值，所以第二行代码返还true。

第三行代码也是字符串比较，所以比较的是字符编码值（2是50,3是51），所以返回true

注意：任何操作数与NaN比较，都会返回false。

1.7 相等运算符

相等运算符有两组：相等和不相等（先转换再比较）、全等和不全等（只比较不转换）

1.相等和不相等

相等（==），不相等（!=）

这两个运算符都会先转换操作数（强制转换），然后比较。

对于不同的数据类型，转换规则如下：

• 如果有一个操作数是布尔值，则在比较前先将其转换为数值（false转为0，true转为1）
• 如果一个操作数是字符串，另一个操作数是数值，先将字符串转为数值
• 如果一个操作数是对象，另一个不是，先调用对象的valueOf()方法，用得到的基本类型值按照前面的规则进行比较
• null和undefined是相等的
  
  要比较之前，不能将null和undefined转换成其他任何值
• 如果有一个操作数是NaN，则相等运算符返回false，不相等运算符返回true。（要记住NaN不等于本身原则）
• 如果两个操作数都是对象，则比较它们是不是同一个对象。如果两个操作数都指向同一个对象，则相等运算符返回true，否则返回false。

NaN == NaN  // false 

true == 1  // true 

null == undefined  // true 

2.全等和不全等

除了在比较之前不转换操作数类型之外，全等和不全等与相等和不相等没什么区别。

'55' == 55  // true 

'55' === 55 // false 

1.8 条件运算符

条件运算符是ECMAScript中唯一的三元运算符。

variable = boolean_expression ? true_value : false_value; 

如果boolean_expression返回true，则执行true_value，否则，执行false_value

var name = (1 > 2) ? 'tg' : 'tg2';   // "tg2" 

上面的代码中1小于2，所以是false，则将”tg2”赋值给name。

1.9 赋值运算符

（=）是最简单的赋值操作，其作用是把右侧的值赋给左侧变量。

var name = 'tg'; 

复合赋值运算符

乘赋值（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 <<= y）  等同于  x = x << y 

有符号右移赋值（x >>= y）  等同于  x = x >> y 

无符号右移赋值（x >>>= y）  等同于  x = x >>> y 

例子：

var a = 1; 

a += 1; 

console.log(a);  // 2 

1.10 逗号运算符

使用逗号运算符可以在一条语句中执行多个操作：

var  name = 'tg', age = 1; 

逗号运算符多用于声明多个变量。

逗号运算符还可以用于赋值。在用于赋值时，逗号运算符总会返回表达式中的最后一项：

var num = (1,5,3);  // num的值为3 

3是表达式中的最后一项，因此num的值就是3.

1.11 in运算符

in运算符希望它的左操作数是一个字符串或可以转换成为字符串，希望它的右操作数是一个对象。如果右侧的对象拥有一个名为左操作数值的属性名，则返回true。

var o = {x:1}; 

"x" in o //true 

1.12 instanceof运算符

instanceof运算符希望左操作数是一个对象，右操作数标识对象的类。如果左侧的对象是右侧类的实例，则表达式返回true。

var a = new Array(); 

a instanceof Object; //true 

注意：所有对象都是Object的实例

1.13 typeof运算符

typeof是一元运算符，用来判断数据类型：

typeof 1  // "number" 

1.14 delete运算符

delete是一元运算符，它用来删除对象的属性或数组元素。

var o={x:1} 

delete o.x; 

"x" in o //false 

1.15 void运算符

void 是一元运算符，它出现在操作数之前，操作数可以是任意类型。操作数会照常计算，但忽略计算结果并返回undefined。

void 0  //undefined 

void(0)  //undefined

var a = 1; 

void (a=2); 

a  //2 

这个运算符主要是用于书签工具（bookmarklet），以及用于在超级链接中插入代码，目的是返回undefined可以防止网页跳转。

<a href="javascript:void(0)">a> 

2. 运算顺序

2.1 优先级

JavaScript各种运算符的优先级别（Operator Precedence）是不一样的。优先级高的运算符先执行，优先级低的运算符后执行。

2.2 圆括号

圆括号（()）可以用来提高运算的优先级，因为它的优先级是最高的，即圆括号中的表达式会第一个运算。

注意：因为圆括号不是运算符，所以不具有求值作用，只改变运算的优先级。

对于优先级别相同的运算符，大多数情况，计算顺序总是从左到右，这叫做运算符的“左结合”（left-to-right associativity），即从左边开始计算。

但是少数运算符的计算顺序是从右到左，即从右边开始计算，这叫做运算符的“右结合”（right-to-left associativity）。其中，最主要的是赋值运算符（=）和三元条件运算符（?:）。