JavaScript 运算符


运算符是一个符号,应用在一个或多个运算数上,返回一个结果值。


运算符类型

JavaScript语言有下面几种运算符:

  • 赋值运算符(Assignment Operator),包含=、+=、-=、=、/=、%=、*=、&=、|=、^=、<<=、>>=、>>>=。=,用于给变量赋值。其他+=、-=等都是+、-等运算符和赋值运算符两个运算符一起使用的简写形式。如x += y,等同于x = x + y。
  • 关系运算符(Comparison Operator),包含==、!=、===、!==、>、>=、<、<=。关系运算符用于比较两个运算数的大小是否相等。==运算符会进行自动类型转换,===运算符不进行类型转换。
  • 算术运算符(Arithmetic Operator),包含+、-、、/、%、++、--、*,分别为加、减、乘、除、取余数、自增1、自减1、指数运算符。
  • 位运算符(Bitwise Operator),包含~、&、|、^、<<、>>、>>>。~是二进制取反操作符,对整型的每个bit,将0变成1,1变成0。&是按位与(and)运算符,对两个运算符的每个对应的bit,如果两个bit都为1,结果为1,否则为0。|是按位或(or)运算符,对两个运算符的每个对应的bit,如果两个bit至少有一个为1时,结果为1,否则为0。^是按位异或(xor)运算符,对两个运算符的每个对应的bit,如果两个bit有且只有一个为1,结果为1,否则为0。<<是左移运算符,向左移动指定个数的bit后,右边空出来的bit用0填充。>>右移运算符(算术右移,arithmetic shift),向右移动指定个数的bit后,用符号位填充左边空出来的bit,向右移出的bit被丢弃。>>>右移运算符(逻辑右移,logical shift),向右移动指定个数的bit后,用0填充左边空出来的bit,向右移出的bit被丢弃。
  • 逻辑运算符(Logical Operator),包含&&、||、!。&&是与(and)运算符,如果第一个运算数可以转换成false,则返回第一个运算数,否则返回第二个运算数。||是或(or)运算符,如果第一个运算数可以转换成true,则返回第一个运算数,否则返回第二个运算数。&&和||运算符返回的是运算数,而不是运算数转换成的true或false。!是取反运算符,如果运算数可以转换成true,则返回false,否则返回true。
  • 条件运算符(Conditional Operator),?:运算符是if-else的简化版本,共有3个运算数,格式为result = condition ? value1 : value2; condition是boolean类型的运算数,如果condition为true,result为value1的值,否则result为value2的值。
  • 逗号运算符(Comma Operator),主要用于for循环中同时更改多个循环变量的值。
  • 一元运算符(Unary Operator),包含delete、typeof、void。delete运算符用来删除一个变量或数组中指定元素。typeof返回运算数的类型。void用来指定表达式没有返回值。
  • 关系运算符(Relational Operator),包含in、instanceof。in用来判断属性是否属于一个对象。instanceof用来判断对象是否属于指定数据类型。

&& 和 || 运算符从左向右计算运算数,有两种情况会形成短路运算。如果operator1 && operator2中operator1可以转换成false,那么不会计算operator2的值,直接返回operator1的值。如果operator3 || operator4中operator3可以转换成true,那么不会计算oprator4的值,直接返回operator3的值。

在条件语句中,下面几种值会被计算成false:

  • false
  • 数字0
  • NaN,Not a Number,特殊值,表示不是数字
  • 空字符串("")
  • null,变量值为null
  • undefined,变量没有赋值

所有其它值,包含所有对象,会计算成true。

&& 运算符可以用来在访问对象的属性时检测对象是否为空(即对象可以转换成false)。例如var name = obj && obj.name;

|| 运算符可以用来设置默认值。例如var color = objColor || 'blue';

下面是运算符的例子:

<!DOCTYPE html><html><body><pre>
<script type="text/javascript">
  var pet = {name: "dog", food: "bone"};
  var pet2;
  document.writeln("pet name : " + (pet && pet.name));    // dog
  document.writeln("pet2 name : " + (pet2 && pet2.name)); // undefined

  document.writeln("5 && undefined : " + (5 && undefined)); // undefined
  document.writeln("'' || 5 : " + ('' || 5)); // 5

  document.writeln("'1' == 1 : " + ('1' == 1));   // true
  document.writeln("'1' === 1 : " + ('1' === 1)); // false

  document.writeln("1 + 2 + '3' : " + (1 + 2 + '3')); // 33
  document.writeln("'1' + 2 + 3 : " + ('1' + 2 + 3)); // 123

  var pets = ['dog', 'cat'];
  document.writeln("0 in pets : " + (0 in pets)); // true
  delete pets[0];
  document.writeln("0 in pets : " + (0 in pets)); // false

  document.writeln("typeof parseInt : " + (typeof parseInt)); // function
  document.writeln("typeof [1, 2] : " + (typeof [1, 2]));     // object
  document.writeln("typeof new Date() : " + (typeof new Date())); // object
</script>
<br><a href="javascript:void(0)">点击</a>
</pre></body></html>

运算符优先级和运算符结合性

下面是运算符优先级(Operator Precedence)的列表,同一行的操作符有相同的优先级,从上往下优先级递减。

  1. . []:访问成员
  2. () new:函数调用和创建对象
  3. ! ~ - + ++ -- typeof void delete:一元运算符,从右到左
  4. **从右到左
  5. * / %
  6. + -:加减
  7. << >> >>>
  8. < <= > >= in instanceof
  9. == != === !==
  10. not x
  11. &
  12. ^
  13. |
  14. &&
  15. ||
  16. ?:从右到左
  17. = += -= *= /= %= <<= >>= >>>= &= ^= |=从右到左
  18. ,

运算符结合性(Operator Associativity):一元运算符、**?:、赋值运算符的结合性是从右到左,其它运算符的结合性是从左到右。例如a ** b ** c等同于a ** (b ** c)

下面是运算符优先级的例子:

<!DOCTYPE html><html><body><pre>
<script type="text/javascript">
  document.writeln("1 + 3 << 1 : " + (1 + 3 << 1));     // 8
  document.writeln("1 + (3 << 1) : " + (1 + (3 << 1))); // 7
</script>
</pre></body></html>