JavaScript 中的按位运算符

前言

在 JavaScript 中经常会见到 & | 这两个符号。前者表示并且，取交集。后者表示或者，取并集。但偶尔看别人写 JS 代码或者在一些框架的源码中经常会遇到 ^ ~ << >> 这几种运算符。那么它们分别表示什么意思呢？

既然叫按位运算符。必然离不开 “位” 这个概念。我们都知道不管是字符串还是数值在计算机内部都是以 0 和 1 来表示的。那么这里的 0 或者 1 就是一位。比如我们表示十进制的 3，用二进制表示就是 0000 0011。那么如果说把 3 往前移一位。就是 0000 0110。转成十进制就是 6。

按位运算符一共有以上提到的 6 种。

1. &

含义：表示并且,多个条件同时满足。在二进制中表示为如果对应的位都是 1，则为1。否则（有一个位不为1）为 0。

二进制：
0000 0001 （1）
0000 0011 （3）
——————
0000 0001 （1）

JS 示例：

console.log(1&3)//1
var a = 1,b = undefined;
if(a&b){
   console.log(1)
}else{
   console.log(2)
}//2

2. |

含义：表示或者,多个条件满足一个条件即可。在二进制中表示为对应的任意位为1，则为1。否则（所有位都为0）为 0。

二进制：
0000 0001 （1）
0000 0011 （3）
——————
0000 0011 （3）

JS 示例：

console.log(1|3)//3
var a = 1,b = undefined;
if(a | b){
   console.log(1)
}else{
  console.log(2)
}//1

3. ^

含义：^ 与 | 有些相似，区别是如果两个操作位都为 1 的话，结果为 0。

二进制：
0000 0001 （1）
0000 0011 （3）
——————
0000 0010 （2）

JS 示例：

 console.log(1^3)//2

4. ~

含义：~ 表示对位求反。1 变 0,0 变 1。十进制计算结果是取反减1。

JS 示例：

console.log(~3)//-4,3求反之后为-3-1=-4

5. <<

含义：表示向左移动。

二进制：
0000 0011 （3）
——————
0000 0110 （6）

示例：

console.log(3<<1)//6

十进制的 3 转换 二进制为 0000 0011（12(1)+12(0)=3）。把 3 向左移动。就是 0000 0110（12(2)+12(1)=6）。转成十进制就是 6。

6. >>

含义：表示向右移动。

0000 0011 （3）
——————
0000 0001 （1）

示例：

console.log(3>>1)//1

十进制的 3 转换 二进制为 0000 0011（12(1)+12(0)=3）。把 3 向右移动。就是 000000 01（1*2(0)=1）。转成十进制就是 1。