js 位运算符_js按位运算符及其妙用

更新日期: 2019-01-03阅读量: 1512标签: 运算

大多数语言都提供了按位运算符,恰当的使用按位运算符有时候会取得的很好的效果。

在我看来按位运算符应该有7个:


1、& 按位与

&是二元运算符,它以特定的方式的方式组合操作数中对应的位,如果对应的位都为1,那么结果就是1, 如果任意一个位是0 则结果就是0。

1 & 3的结果为1

那我们来看看他是怎么运行的

1的二进制表示为 0 0 0 0 0 0 1

3的二进制表示为 0 0 0 0 0 1 1

根据 & 的规则 得到的结果为 0 0 0 0 0 0 0 1,十进制表示就是1


2、| 按位或

|运算符跟&的区别在于如果对应的位中任一个操作数为1 那么结果就是1。

1的二进制表示为 0 0 0 0 0 0 1

3的二进制表示为 0 0 0 0 0 1 1

所以 1 | 3的结果为3


3、^ 按位异或

^运算符跟|类似,但有一点不同的是 如果两个操作位都为1的话,结果产生0。

1的二进制表示为 0 0 0 0 0 0 1

3的二进制表示为 0 0 0 0 0 1 1

所以 1 ^ 3的结果为2


4、~ 按位非

~运算符是对位求反,1变0,0变1,也就是求二进制的反码

1的二进制表示为 0 0 0 0 0 0 1

所以 ~1 的结果是-2


5、>> 右移

>>运算符使指定值的二进制所有位都右移规定的次数,对于其移动规则只需记住符号位不变,左边补上符号位即按二进制形式把所有的数字向右移动对应的位数,低位移出(舍弃),高位的空位补符号位,即正数补零,负数补1。

1的二进制表示为 0 0 0 0 0 0 1

所以 1>>1的结果为0


6、<< 左移

<<运算符使指定值的二进制所有位都左移规定的次数,对于其移动规则只需记住丢弃最高位,0补最低位即按二进制形式把所有的数字向左移动对应的位数,高位移出(舍弃),低位的空位补零。

1的二进制表示为 0 0 0 0 0 0 1

所以 1<<1的结果为2 7、>>> 无符号右移

>>>运算符忽略了符号位扩展,0补最高位,但是只是对32位和64位的值有意义。

位运算符在js中的妙用:

1、使用&运算符判断一个数的奇偶

偶数 & 1 = 0

奇数 & 1 = 1

那么0&1=0,1&1=1

2、使用~~,>>,<<,>>>,|来取整

~~3.14 = 3

3.14 >> 0 = 3

3.14 << 0 = 3 3.14 | 0 = 3 3.14 >>> 0 = 3(>>>不可对负数取整)

注意:~~-3.14 = -3 其它的一样

3、使用<<,>>来计算乘除

乘法:

1*2 = 2

1<>1 = 1(2/2的一次方)

4、利用^来完成比较两个数是否相等

1 ^ 1 = 0

1 ^ 非1数 !=0

所以同一个数……同一个数等于0,否则不等于0

5、使用^来完成值交换

a = 1

b = 2

a ^= b

b ^= a

a ^= b

结果a=2,b=1

6、使用&,>>,|来完成rgb值和16进制颜色值之间的转换

16进制颜色值转RGB:

function hexToRGB(hex){
    var hex = hex.replace("#","0x"),
        r = hex >> 16,
        g = hex >> 8 & 0xff,
        b = hex & 0xff;
    return "rgb("+r+","+g+","+b+")";
}


RGB转16进制颜色值:

function RGBToHex(rgb){
    var rgbArr = rgb.split(/[^\d]+/),
        color = rgbArr[1]<<16 | rgbArr[2]<<8 | rgbArr[3];
    return "#"+color.toString(16);
}

运行hexToRGB("#ffffff")返回"rgb(255,255,255)"

运行RGBToHex("rgb(255,255,255)")返回"#ffffff"


站长推荐

1.云服务推荐: 国内主流云服务商,各类云产品的最新活动,优惠券领取。地址:阿里云腾讯云华为云

链接: https://www.fly63.com/article/detial/1764

JavaScript之操作符

计算机被发明的初衷仅仅是为了快速实现一些数学计算,然而经过多年发展,计算机已经不单单能实现快速计算这么简单的工作了,现代计算机不仅能够进行数值的计算,还能进行逻辑计算,还具备存储记忆功能,是能够按照程序运行

在JavaScript中使用Spread运算符的8种方法

延展操作运算符将可迭代的对象扩展为其单独的元素,可迭代对象是可以使用 for 循环进行循环的任何对象。可迭代的示例:Array,String,Map,Set,DOM节点。

为什么Js中 0.1+0.2 不等于 0.3 ?

在 js 中进行数学的运算时,会出现0.1+0.2=0.300000000000000004的结果,一开始认为是浮点数的二进制存储导致的精度问题,但这似乎不能很好的解释为什么在同样的存储方式下0.3+0.4=0.7可以得到正确的结果

js一些操作运算符

可选链操作符( ?. )允许读取位于连接对象链深处的属性的值,而不必明确验证链中的每个引用是否有效。?. 操作符的功能类似于 . 链式操作符,不同之处在于,在引用为空(nullish ) (null 或者 undefined) 的情况下不会引起错误

三元、或、且运算符妙用

几乎所有语言中||和&&都遵循“短路”原理,如&&中第一个表达式为假就不会去处理第二个表达式,而||正好相反。一方面精简js代码,能实质性的减少网络流量,尤其是大量应用的js公用库

Js四舍五入及精度丢失问题

在JS中使用数值计算时,经常会遇到未知的结果。问题:用toFixed保留小数时,四舍五入规则不固定:常见的解决思路:将小数放大为整数,进行四舍五入后,再缩小为小数。

JS保留两位小数

以下处理结果会四舍五入:以下处理结果不会四舍五入第一种,先把小数边整数:第二种,当作字符串,使用正则匹配:注意:如果是负数,请先转换为正数再计算,最后转回负数

js中的相等==

今天学习 jest,看文档的时候发现 jest 用到了 Object.is(),以前没有见过,所以记录下来,供以后开发时参考,相信对其他人也有用。如果下列任何一项相同,则 Object.is(value1, value2) 返回 true:

关于js开发中保留小数位计算函数(以向上取整或向下取整的方式保留小数)

前端工作中经常遇到数字计算保留小数问题,由于不是四舍五入的方式不能使用toFixed函数,本文采用正则表达式匹配字符串的方式,解决对数字的向上或向下保留小数问题:

看了此文,你还敢说你懂了Javascript运算符吗

JavaScript的很多奇技淫巧,都来自于对运算符的灵活使用。JavaScript的JavaScript的很多奇技淫巧,都来自于对运算符的灵活使用。优先级: 优先级高的运算符最先被执行

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!