JS位运算符

JavaScript09

JS位运算符,第1张

之前对js的一些涉及到二进制的运算符一直似懂非懂,看到了就一脸懵逼,还得去控制台算一下。然后最近看算法的时候又看到了这个运算符,这里就简单介绍一下学习这些位运算符的过程。

注意: 以下运算均不涉及到小数。

先说这句话是什么意思。左移位是二进制的一种运算,就是在不改变二进制数值32位长度的前提下,将每位的数字都向左移动,左边移出去的直接丢弃,右边空出来的位置用0填充。无符号就是保持符号位不变,即本来是正数,移位后一样为正数。

这里以 7 <<2 为例。

首先将7转为二进制是 0000 0000 0000 0000 0000 0000 0000 0111 .

然后对其向左移两位.

得到值为 0000 0000 0000 0000 0000 0000 0001 1100 .

转换为十进制为 28.即 7 <<2 = 28 。

然后我们对以上的运算过程做一个处理,将这些二进制转换为我们熟悉的十进制。

对移位后的算式进行合并项可得到 2^4 + 2^3 + 2^2 = (2^2 + 2^1 + 2^0) * 2^2 ,即 2^4 + 2^3 + 2^2 = (2^2 + 2^1 + 2^0) * 2^2 = 7 * 2^2 。由此我们可得出 7 <<2 = 7 * 2^2 = 28 。

我们通过计算几个简单的左移位运算,与标准答案进行比较,验证一下这个结论。

在控制台中以上几个算式的结果为

答案完全一致。说明我们的结论是正确的。当然这个结论 仅限于那些二进制移位不会左移移出的数字的简单运算 。当我们遇到一些简单的可以口算的左移位运算时就可以使用这个结论快速得到结果,如果对于 99999 <<66 这种较复杂的运算你也用这个结论计算,也没有人会介意。

下面我们看一下负数的左移位运算。以 -66 <<2 为例。

首先,我们先复习一下负数如何转换为二进制。

负数转换为二进制的步骤有三:

然后对其向左移两位.

得到值为 1111 1111 1111 1111 1111 1110 1111 1000 .然后我们将其转换成十进制。

转换为十进制为 -264.即 -66 <<2 = -264 。

刚刚我们计算 -66 的二进制得到的是 1111 1111 1111 1111 1111 1111 1011 1110 。我们在控制台验证一下我们得到的这个二进制。

我们比较一下下面几个算式。

是的没错,进行无符号左移位运算时,当两个数的绝对值相等时,其相同位数的移位的绝对值一定相等。

这里以 666 >>3 为例。

首先将666转换为二进制是 0000 0000 0000 0000 0000 0010 1001 1010 。

然后对其向右移三位。

得到值为 0000 0000 0000 0000 0000 0000 0101 0011 .

转换为十进制为 83.即 666 >>3 = 83 。

然后我们对以上的运算过程做一个处理,将这些二进制转换为我们熟悉的十进制。

这个规律好像不太好总结?

这里以 -666 >>3 为例。

因为是有符号的运算,所以这里不再适用上一小节说的js的特殊处理。先将-666转换为二进制。

即-666的二进制形式为 1111 1111 1111 1111 1111 1101 0110 0110 ,然后对其进行有符号右移位运算

移位后得到的值为 1111 1111 1111 1111 1111 1111 1010 1100 ,是一个负值,我们将其转成十进制。

我们对此结果进行验证。

可见,我们的运算是完全正确的。

这里我们以 666 >>>3 为例。

首先将666转换为二进制是 0000 0000 0000 0000 0000 0010 1001 1010 。

然后对其向右移三位。

得到值为 0000 0000 0000 0000 0000 0000 0101 0011 .

转换为十进制为 83.即 666 >>3 = 83 。

这里以 -666 >>3 为例。

因为是有符号的运算,所以这里不再适用上一小节说的js的特殊处理。先将-666转换为二进制。

即-666的二进制形式为 1111 1111 1111 1111 1111 1101 0110 0110 ,然后对其进行有符号右移位运算

移位后得到的值为 0001 1111 1111 1111 1111 1111 1010 1100 ,转成十进制为536870828。

是不是超级大。因为是无符号右移位运算,所以在左边空出部分不论正负都会填充0.

我们对此结果进行验证。

可见,我们的运算是完全正确的。

注意:因为对负数进行无符号右移位运算时,所得结果很大,所以在使用过程中需要格外注意。

疑问:左移位和右移位根本都是只对位置进行了移动,那么对于 x1 >>k = y1 和 y2 <<k = x2 中的 x1 等于 x2 , y1 等于 y2 吗?

不一定。因为我们不能确保移动过程中被丢弃的值均为0。但凡有一个1被丢弃,就不会相等。而如果被丢弃的都是0,那么 x1 === x2 y1 === y2 。如下图所示。

这里以 66 &33 为例。

首先将两个数转换为二进制是 0000 0000 0000 0000 0000 0000 0100 0010 和 0000 0000 0000 0000 0000 0000 0010 0001 。

然后对其进行与运算。

得出结果为 0.

负数的与运算与正数并无区别,不做讨论。

这里以 66 | 66 为例。

首先将两个数转换为二进制是 0000 0000 0000 0000 0000 0000 0100 0010 和 0000 0000 0000 0000 0000 0000 0100 0010 。

然后对其进行与运算。

得出结果为 66.

负数的与运算与正数并无区别,不做讨论。

这里以 66 ^ 66 为例。

首先将两个数转换为二进制是 0000 0000 0000 0000 0000 0000 0100 0010 和 0000 0000 0000 0000 0000 0000 0100 0010 。

然后对其进行与运算。

得出结果为 0.

负数的与运算与正数并无区别,不做讨论。

这里以 ~66 为例。

首先将其转换为二进制是 0000 0000 0000 0000 0000 0000 0100 0010 。

然后对其进行与运算。

将结果( 1111 1111 1111 1111 1111 1111 1011 1101 )转换为十进制

得出结果为 -67.

这里我们再我看几个例子。

从中我们可以看出, 位非操作就是对数字加一,然后取负 。我们可以写个简单的判断方法来验证。

位运算符运算结果非常有趣,在平时可以多加应用,但是一定要注意可能产生大数的预算,避免产生不必要的BUG。

这篇文章只是做了一个简单的介绍。后面有空了会做一下在实际开发中的应用,虽然我可能很久都遇不到。

JavaScript学习指南:JS入门教程

在了解位运算之前, 必须先了解一下什么是原码, 反码和补码, 以及二进制与十进制的转换.

原码

一个数在计算机中是以二进制的形式存在的, 其中第一位存放符号, 正数为0, 负数为1. 原码就是用第一位存放符号的二进制数值. 例如2的原码为00000010, -2的原码为10000010

反码

正数的反码是它本身, 负数的反码是在其原码的基础上, 符号位不变, 其余各位取反.

可见如果一个反码表示的是负数, 并不能直观的看出它的数值, 通常要将其转换成原码再计算

补码

正数的补码是它本身, 负数的补码是在其原码基础上, 符号位不变, 其余各位取反, 最后+1. (即负数的补码为在其反码的基础上+1)

可见对于负数, 补码的表示方式也是让人无法直观的看出其数值的, 通常也需要转换成原码再计算.

正整数十进制转二进制

正整数的十进制转二进制的方法为将一个十进制数除以2, 得到的商再除以2, 以此类推知道商为1或0时为止, 倒序取得除得的余数, 即为转换所得的二进制数.

负整数十进制转二进制

负整数的十进制转二进制, 先将该负整数对应的正整数转为二进制, 然后对其取反再+1. 即补码的形式

十进制小数转二进制

十进制小数转二进制的方法为"乘2取整", 对十进制的小数部分乘2, 得到的整数部分即是相应的二进制码数, 然后继续对得到的小数部分乘2, 如此不断重复, 直到小数部分为0或达到精度要求为止. 顺序取得每次的整数部分, 即是该十进制小数的二进制表示.

按位运算符有6个

&: 按位与

|: 按位或

^: 按位异或

~: 按位取反

>>: 右移

<<: 左移

将运算数以二进制表示, 对应位都为1, 则结果为1, 否则为0.

使用场景示例:

判断一个数是奇数还是偶数

奇数的二进制码的最后一位数肯定是1, 而1只有最后一位为1, 按位与运算后, 结果肯定只有最后一位数是1. 而偶数的二进制表示的最后一位数是0, 和1进行按位与运算, 结果的所有位都是0.

将运算数以二进制表示, 对应位有一个为1, 则结果为1, 否则为0.

使用场景示例:

对浮点数向下求整

其实浮点数是不支持位运算的, 所以会先把小数位丢弃, 然后以整数进行位运算, 而任何数与0进行按位或操作, 结果都是它本身, 就好像是对浮点数向下求整.

将运算数以二进制表示, 对应位相同为0, 相异为1.

异或满足交换律和结合律, 数字与它本身进行异或操作, 得到0数字与0进行异或操作, 得到它本身.

使用场景示例:

交换两个变量数字的值

将操作数转换为二进制数, 然后按位求反.

浮点数是不支持位运算的,所以会先直接去除小数部分,转成整数再进行位运算,就好像是对浮点数向下求整.

~~可以进行类型转换,位运算会默认将非数字类型转换成数字类型再进行运算 (转换结果为整数 直接去除小数部分)

使用场景示例:

类型转换

移位运算符将操作数转换成二进制, 然后向左或向右移动, 超过的位丢弃, 空出的位补0.

使用场景示例:

类型转换

任何小数 把它 >>0可以取整

如3.14159 >>0 = 3

其默认将非数字类型的转换为数字类型再做运算的性质与 ~~ , | 0 一样

JavaScript中的运算符优先级是一套规则。该规则在计算表达式时控制运算符执行的顺序。具有较高优先级的运算符先于较低优先级的运算符执行。例如,乘法的执行先于加法。

算数运算符:

加+,减—,乘*,除/,求余%,加加++,减减——,

加减乘除求余运算与数学上的用法完全一样。

不过,加号+还有连接字符串的作用,其他运算符还可以将字符串数字转换成数值型,参见 JavaScript中数据类型转换总结 中的隐式转换部分。

++,——分为前置和后置,前置表示在使用该变量之前加/减1,后置表示在使用之后加/减1。

逻辑运算符:

1.&&: 与运算, 当与运算的两个内容都为true的时候,结果为true,只要有一个内容为false,结果都是false,&&可以读作“并且”

2.||: 或运算, 当或运算的两个内容都为false的时候,结果为false,只要有一个内容为true,结果都是true,|| 可以读作“或者”

3.!:非运算, 取反运算,当内容为true时,取反结果为false,当内容为false时,取反结果为true

补充:

&&与||的其他用法

&&

如果两个操作数都不是布尔类型

且两个数值转换成布尔类型都是true,返回第二个操作数

如果有一个操作数转换成布尔类型是false,返回这个数

var b=undefined&&null

console.log(b)

返回undefined

||

如果两个操作数都不是布尔类型

第一个数转换成布尔类型为true,则不往下看,返回第一个数

如果第二个数转换成布尔类型为true,则返回第二个数值。

比较运算符:

== 相等操作符

如果两个操作数相等,则返回 true。

!= 不相等操作符

如果两个操作数不相等,则返回 true。

这两个操作符都会先转换操作数(通常称为强制转型),然后再比较它们的相等性。在转换不同的数据类型时,相等和不相等操作符遵循下列基本规则:

1、 如果有一个操作数是布尔值,则在比较相等性之前先将其转换为数值——false 转换为 0,而true 转换为 1;

2、如果一个操作数是字符串,另一个操作数是数值,在比较相等性之前先将字符串转换为数值;

3、 如果一个操作数是对象,另一个操作数不是,则调用对象的 valueOf()方法,用得到的基本类型值按照前面的规则进行比较;

这两个操作符在进行比较时则要遵循下列规则。

1、 null 和 undefined 是相等的。

2、 要比较相等性之前,不能将 null 和 undefined 转换成其他任何值。

3、 如果有一个操作数是 NaN,则相等操作符返回 false,而不相等操作符返回 true。重要提示:

即使两个操作数都是 NaN,相等操作符也返回 false;因为按照规则, NaN 不等于 NaN。

如果两个操作数都是对象,则比较它们是不是同一个对象。如果两个操作数都指向同一个对象,

则相等操作符返回 true;否则,返回 false。

下表列出了一些特殊情况及比较结果:

=== 全等操作符

在两个操作数未经转换就相等的情况下返回 true。即数值和类型都相同。

var result1 = ("55" == 55)//true,因为转换后相等

var result2 = ("55" === 55)//false,因为不同的数据类型不相等

!== 不全等操作符

在两个操作数未经转换就不相等的情况下返回 true。数据类型不同就不等。

var result1 = ("55" != 55)//false,因为转换后相等

var result2 = ("55" !== 55)//true,因为不同的数据类型不相等

赋值运算符:

=,+=,-=,*=,/=

简单的赋值操作符由等于号(=)表示,其作用就是把右侧的值赋给左侧的变量。

如果在等于号(=)前面再添加乘性操作符、加性操作符或位操作符,就可以完成复合赋值操作。

num = num + 10等同于num += 10

设计这些操作符的主要目的就是简化赋值操作。使用它们不会带来任何性能的提升。

三元运算符:

? :

举个例子:

var max = (num1 >num2) ? num1 : num2

在这个例子中, max 中将会保存一个最大的值。这个表达式的意思是:如果 num1 大于 num2(关系表达式返回 true),则将 num1 的值赋给 max;如果 num1 小于或等于 num2(关系表达式返回 false),则将 num2 的值赋给 max。

位运算符:

JavaScript也有位运算符,需要先转换成16进制数进行运算,在开发中好像还没有用到过,了解一下即可。

javascript 中运算符优先级