javascript运算符——位运算符

时间 2019-11-18

标签 javascript 运算符栏目 JavaScript 繁體版

原文原文链接

前面的话

　　位运算符是很是底层的运算，因为其很不直观，因此并不经常使用。可是，其速度极快，且合理使用能达到很好的效果。本文将介绍javascript中经常被忽视的运算符——位运算符javascript

二进制表示

　　ECMAScript中的全部数值都以IEEE-754 64位格式存储，但位操做符并不直接操做64位的值，而是以32位带符号的整数进行运算的，而且返回值也是一个32位带符号的整数html

　　这种位数转换使得在对特殊的NaN和Infinity值应用位操做时，这两个值都会被当成0来处理java

　　若是对非数值应用位操做符，会先使用Number()将该值转换成数值再应用位操做，获得的结果是一个数值express

//'|'表示按位或，一个整数与0按位或运算能够获得它自己，一个小数与0按位或运算能够获得取整效果
console.log( 1.3 | 0);//1
console.log( 1.8 | 0);//1
console.log( Infinity | 0);//0
console.log( -Infinity | 0);//0
console.log( NaN | 0);//0
console.log('12px' | 0);//0
console.log('12' | 0);//12

　　有符号整数使用32位中的前31位表示整数数值，用第32位表示整数符号，0表示正数，1表示负数。表示符号的位叫作符号位，符号位的值决定了其余位数值的格式。其中，正数以纯二进制格式存储，31位中的每一位都表示2的幂。第一位(叫作位0)表示2的0次，第二位表示2的1次，以此类推。没有用到的位以0填充，即忽略不计spa

　　例如，数值18的二进制表示是00000000000000000000000000010010，或者更简洁的10010。这是5个有效位，这5位自己就决定了实际的值设计

console.log((18).toString(2));//"10010"
console.log(0b00000000000000000000000000010010);//18

　　负数一样以二进制存储，但使用的格式是二进制补码。计算一个数值的二进制补码，须要通过下列3个步骤：code

　　【1】求这个数值绝对值的二进制码htm

　　【2】求二进制反码，即将0替换成1，将1替换成0对象

　　【3】获得的二进制反码加1blog

　　例如，要肯定-18的二进制表示，首先必须获得18的二进制表示，以下所示：

0000 0000 0000 0000 0000 0000 0001 0010

　　接下来，计算二进制反码，以下所示：

1111 1111 1111 1111 1111 1111 1110 1101

　　最后，在二进制反码上加 1，以下所示：

1111 1111 1111 1111 1111 1111 1110 1101
                                      1
---------------------------------------
1111 1111 1111 1111 1111 1111 1110 1110

　　所以，-18 的二进制表示即 1111 1111 1111 1111 1111 1111 1110 1110

　　ECMAScript会尽力向咱们隐藏全部这些信息，在以二进制字符串形式输出一个负数时，咱们看到的只是这个负数绝对值的二进制码前面加上了一个负号

var num = -18;
console.log(num.toString(2));//'-10010'

　　位运算符能够进行7种运算，包括按位非(NOT)、按位与(AND)、按位或(OR)、按位异或(XOR)、左移、有符号右移和无符号右移

按位非(NOT)

　　按位非操做符由一个波浪线(~)表示，执行按位非的结果就是返回数值的反码。其本质是操做数的负值减1

var num1 = 25;
var num2 = ~num1;
console.log(num2);//-26

　　对一个整数两次按位非，能够获得它自己；对一个小数两次按位非，能够获得取整效果

console.log(~~3);//3
console.log(~~3.1);//3
console.log(~~3.9);//3

按位与(AND)

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

第一个数值的位        第二个数值的位         结果
1                        1                1
1                        0                0
0                        1                0
0                        0                0

　　按位与操做只有在两个数值的对应位都是1时才返回1，任何一位是0，结果都是0

var iResult = 25 & 3;
console.log(iResult);//"1"

//分析以下
 25 = 0000 0000 0000 0000 0000 0000 0001 1001
  3 = 0000 0000 0000 0000 0000 0000 0000 0011
---------------------------------------------
AND = 0000 0000 0000 0000 0000 0000 0000 0001

按位或(OR)

　　按位或操做符由一个竖线符号(|)表示，一样也有两个操做数，按位或操做遵循下面这个真值表

第一个数值的位        第二个数值的位         结果
1                        1                1
1                        0                1
0                        1                1
0                        0                0

　　按位或操做在有一个位是1的状况下就返回1，而只有在两个位都是0的状况下才返回0

var iResult = 25 | 3;
console.log(iResult);//"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

　　一个整数与0按位或运算能够获得它自己，一个小数与0按位或运算能够获得取整效果

console.log(3.1 | 0);//3
console.log(3.9 | 0);//3

按位异或(XOR)

　　按位异或操做符由一个插入符号(^)表示，也有两个操做数。如下是按位异或的真值表

第一个数值的位        第二个数值的位         结果
1                        1                0
1                        0                1
0                        1                1
0                        0                0

　　按位异或的两个数值相同时返回0，不一样时返回1

var iResult = 25 ^ 3;
console.log(iResult);//"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

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

var a=10,b=9;
a ^= b, b ^= a, a ^= b;
console.log(a,b);//9,10

//分析以下
  a = 0000 0000 0000 0000 0000 0000 0000 1010
  b = 0000 0000 0000 0000 0000 0000 0000 1001
---------------------------------------------
 a1 = 0000 0000 0000 0000 0000 0000 0000 0011

 a1 = 0000 0000 0000 0000 0000 0000 0000 0011 
  b = 0000 0000 0000 0000 0000 0000 0000 1001
---------------------------------------------
 b1 = 0000 0000 0000 0000 0000 0000 0000 1010
 
 b1 = 0000 0000 0000 0000 0000 0000 0000 1010 
 a1 = 0000 0000 0000 0000 0000 0000 0000 0011 
---------------------------------------------
 a2 = 0000 0000 0000 0000 0000 0000 0000 1001
//a=a2=10;b=b1=9

　　一个整数与0按位异或能够保持其自身，一个小数与0按位异或能够取整

console.log(3.1 ^ 0);//3
console.log(3.9 ^ 0);//3

左移

　　左移操做符由两个小于号(<<)表示，这个操做符会将数值的全部位向左移动指定的位数

　　例如，若是将数值2(二进制码为10)向左移动5位，结果就是64(1000000)

var oldValue = 2;
var newValue = oldValue<<5;
console.log(newValue);//64

　　左移不会影响操做数的符号位。换句话说，若是将-2向左移动5位，结果将是-64

var oldValue = -2;
var newValue = oldValue<<5;
console.log(newValue);//-64

　　左移0位能够实现取整效果

console.log(3.1 << 0);//3
console.log(3.9 << 0);//3

有符号右移

　　有符号的右移操做符由两个大于号(>>)表示，这个操做符会将数值向右移动，但保留符号位(即正负号标记)。有符号的右移操做与左移操做正好相反，即若是将64向右移动5位，结果将变回2

var oldValue = 64;
var newValue = oldValue>>5;
console.log(newValue);//2

　　一样，在移位过程当中，原数值中也会出现空位。只不过此次的空位出如今原数值的左侧、符号位的右侧。而此时ECMAScript会用符号位的值来填充全部空位，以便获得一个完整的值

　　右移能够模拟2的整除运算

console.log(5>>1);//2
console.log(15>>1);//7

无符号右移

　　无符号右移操做符由3个大于号(>>>)表示，这个操做符会将数值的全部32位都向右移动。对正数来讲，无符号右移的结果与有符号右移相同。仍之前面有符号右移为便，若是将64无符号右移5位，结果仍然是2

var oldValue = 64;
var newValue = oldValue>>>5;
console.log(newValue);//2

　　可是，对负数就不同了。首先，无符号右移是以0来填充空位，而不是像有符号右移那样以符号位的值来填充空位。因此，对正数的无符号右移与有称号右移结果相同，但对负数的结果就不一样了。其次，无符号右移操做符会把负数的二进制码当成正数的二进制码。并且，因为负数以其绝对值的二进制补码形式表示，所以就会致使无符号右移后的结果很是之大

var oldValue = -64;
var newValue = oldValue>>>5;
console.log(newValue)//134217726

　　要肯定-64的二进制表示，首先必须获得64的二进制表示，以下所示：

0000 0000 0000 0000 0000 0000 0100 0000

　　接下来，计算二进制反码，以下所示：

1111 1111 1111 1111 1111 1111 1011 1111

　　最后，在二进制反码上加 1，以下所示

1111 1111 1111 1111 1111 1111 1011 1111
                                      1
---------------------------------------
1111 1111 1111 1111 1111 1111 1100 0000

　　向右移动5位后，以下所示：

0000 0111 1111 1111 1111 1111 1111 1110

console.log(0b00000111111111111111111111111110);//134217726

常见应用

【1】乘法运算

　　利用左移(<<)来实现乘法运算

console.log(2 << 1);//4
console.log(3 << 1);//6
console.log(4 << 1);//8

【2】除法运算

　　利用有符号右移(>>)来模拟2的整除运算

console.log(2 >> 1);//1
console.log(5 >> 1);//2
console.log(8 >> 1);//4
console.log(9 >> 1);//4

【3】值互换

　　利用异或操做(^)能够实现值互换的效果

var a=10,b=9;
a ^= b, b ^= a, a ^= b;
console.log(a,b);//9,10

【4】小数取整

　　利用取两次按位非、与0按位或、与0按位异或、左移0位、右移0位均可以实现小数取整效果

console.log(~~3.1);//3
console.log(3.1|0);//3
console.log(3.1^0);//3
console.log(3.1<<0);//3
console.log(3.1>>0);//3

【5】开关

　　位运算符能够用做设置对象属性的开关。假定某个对象有四个开关，每一个开关都是一个变量。那么，能够设置一个四位的二进制数，它的每一个位对应一个开关

var FLAG_A = 1; // 0001
var FLAG_B = 2; // 0010
var FLAG_C = 4; // 0100
var FLAG_D = 8; // 1000

　　上面代码设置A、B、C、D四个开关，每一个开关分别占有一个二进制位

　　如今假设须要打开ABD三个开关，咱们能够构造一个掩码变量

var mask = FLAG_A | FLAG_B | FLAG_D;
// 0001 | 0010 | 1000 => 1011

　　上面代码对ABD三个变量进行“或运算”，获得掩码值为二进制的1011

//“或运算”能够确保打开指定的开关
flags = flags | mask;

//“与运算”能够将当前设置中凡是与开关设置不同的项，所有关闭
flags = flags & mask;

//“异或运算”能够切换（toggle）当前设置，即第一次执行能够获得当前设置的相反值，再执行一次又获得原来的值
flags = flags ^ mask;

//“否运算”能够翻转当前设置，即原设置为0，运算后变为1；原设置为1，运算后变为0
flags = ~flags;

参考资料

【1】 ES5/位运算移位运算符 https://www.w3.org/html/ig/zh/wiki/ES5/expressions
【2】阮一峰Javascript标准参考教程——运算符 http://javascript.ruanyifeng.com/grammar/operator.html#toc16【3】《javascript权威指南(第6版)》第4章表达式和运算符【4】《javascript高级程序设计(第3版)》第3章基本概念