JS学习系列4-布尔、二进制位、其他运算符

939 阅读6分钟

前言

本系列是之前的学习积累,主要针对JS教程入门时进行学习的记录整理。使用到的参考资料有菜鸟教程、阮一峰JS入门教程系列、网道等多个网站。内容主要基于 ECMAScript 5.1 版本,这是学习 JavaScript 语法的基础。

布尔运算符

取反运算符:!
且运算符:&&
或运算符:||
三元运算符:?:

1. 取反运算符

以下六个值取反后为true,其他值都为false。

undefined
null
false
0
NaN
空字符串('')
----------------------
!undefined // true
!null // true
!0 // true
!NaN // true
!"" // true

!54 // false
!'hello' // false
![] // false
!{} // false

如果对一个值连续做两次取反运算,等于将其转为对应的布尔值,与Boolean函数的作用相同。这是一种常用的类型转换的写法。

!!x
// 等同于
Boolean(x)

2. 且运算符

遵循短路规则。

if (i) {
  doSomething();
}

// 等价于

i && doSomething();

3. 或运算符

短路规则对这个运算符也适用。

或运算符常用于为一个变量设置默认值。

function saveText(text) {
  text = text || '';
  // ...
}

// 或者写成
saveText(this.text || '')

4. 三元条件运算符

如果第一个表达式的布尔值为true,则返回第二个表达式的值,否则返回第三个表达式的值。

if...else是语句,没有返回值;三元条件表达式是表达式,具有返回值。

二进制位运算符

二进制或运算符(or):符号为|,表示若两个二进制位都为0,则结果为0,否则为1。
二进制与运算符(and):符号为&,表示若两个二进制位都为1,则结果为1,否则为0。
二进制否运算符(not):符号为~,表示对一个二进制位取反。
异或运算符(xor):符号为^,表示若两个二进制位不相同,则结果为1,否则为0。
左移运算符(left shift):符号为<<,详见下文解释。
右移运算符(right shift):符号为>>,详见下文解释。
头部补零的右移运算符(zero filled right shift):符号为>>>,详见下文解释。

这些位运算符直接处理每一个比特位(bit),所以是非常底层的运算,好处是速度极快,缺点是很不直观,许多场合不能使用它们,否则会使代码难以理解和查错。

虽然在 JavaScript 内部,数值都是以64位浮点数的形式储存,但是做位运算的时候,是以32位带符号的整数进行运算的,并且返回值也是一个32位带符号的整数。

利用这个特性,可以写出一个函数,将任意数值转为32位整数。

function toInt32(x) {
  return x | 0;
}
toInt32(1.001) // 1
toInt32(1.999) // 1
toInt32(1) // 1
toInt32(-1) // -1
toInt32(Math.pow(2, 32) + 1) // 1
toInt32(Math.pow(2, 32) - 1) // -1

1. 二进制或运算符

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

2.9 | 0 // 2
-2.9 | 0 // -2

2147483649.4 | 0;
// -2147483647  不适用

2. 二进制与运算符

0 & 3 // 0

3. 二进制否运算符

~ 3 // -4

可以简单记忆成,一个数与自身的取反值相加,等于-1。

对一个小数连续进行两次二进制否运算,能达到取整效果。

~~2.9 // 2
~~47.11 // 47
~~1.9999 // 1
~~3 // 3

使用二进制否运算取整,是所有取整方法中最快的一种

对于其他类型的值,二进制否运算先用Number转为数值,再进行处理。

4. 异或运算符

“异或运算”有一个特殊运用,连续对两个数a和b进行三次异或运算,a^=b; b^=a; a^=b;,可以互换它们的值。这意味着,使用“异或运算”可以在不引入临时变量的前提下,互换两个变量的值

var a = 10;
var b = 99;

a ^= b, b ^= a, a ^= b;

a // 99
b // 10

异或运算也可以用来取整。

12.9 ^ 0 // 12

5. 左移运算符

表示将一个数的二进制值向左移动指定的位数,尾部补0,即乘以2的指定次方

4 << 1
// 8

-4 << 1
// -8

如果左移0位,就相当于将该数值转为32位整数,等同于取整,对于正数和负数都有效。

13.5 << 0
// 13

-13.5 << 0
// -13

6. 右移运算符

右移运算符基本上相当于除以2的指定次方(最高位即符号位参与移动) 右移运算可以模拟 2 的整除运算。

5 >> 1
// 2
// 相当于 5 / 2 = 2

21 >> 2
// 5
// 相当于 21 / 4 = 5

21 >> 3
// 2
// 相当于 21 / 8 = 2

21 >> 4
// 1
// 相当于 21 / 16 = 1

7. 头部补零的右移运算符

头部补零的右移运算符(>>>)与右移运算符(>>)只有一个差别,就是一个数的二进制形式向右移动时,头部一律补零,而不考虑符号位。

4 >>> 1
// 2

-4 >>> 1
// 2147483646
/*
// 因为-4的二进制形式为11111111111111111111111111111100,
// 带符号位的右移一位,得到01111111111111111111111111111110,
// 即为十进制的2147483646。
*/

这个运算实际上将一个值转为32位无符号整数。查看一个负整数在计算机内部的储存形式,最快的方法就是使用这个运算符。

-1 >>> 0 // 4294967295

其他运算符

1. void运算符

void运算符的作用是执行一个表达式,返回undefined。

void 0 // undefined
void(0) // undefined

这个运算符的主要用途是浏览器的书签工具(Bookmarklet),以及在超级链接中插入代码防止网页跳转。

下面是一个实际的例子,用户点击链接提交表单,但是不产生页面跳转。

<a href="javascript: void(document.form.submit())">
  提交
</a>

2. 逗号运算符

逗号运算符用于对两个表达式求值,并返回后一个表达式的值。逗号运算符的一个用途是,在返回一个值之前,进行一些辅助操作。

var value = (console.log('Hi!'), true);
// Hi!

value // true

3. 结合顺序

JavaScript 语言的大多数运算符是“左结合”,少数运算符是“右结合”,其中最主要的是赋值运算符(=)和三元条件运算符(?:),指数运算符(**)。