20个你不得不知道的js位运算用法

 更新时间:2023年12月04日 08:24:52   作者:慕仲卿  
位运算,那些看似晦涩但又蕴含无限魔力的数字魔术,在JavaScript开发中扮演了默默无闻却又至关重要的角色,本文介绍多个js位运算的使用场景,阐述在JavaScript中,如何巧妙运用位运算实现效率的提升和算法的优化,需要的朋友可以参考下

位运算的奇妙应用

1. 乘法和除法运算

位运算可实现乘法和除法的简易版本,如num << 1(乘2),num >> 1(除2)。

let num = 4;
let multiplied = num << 1; // 结果为8
let divided = num >> 1; // 结果为2

2. 判断奇偶性

通过和1的与运算检查最低位,判断数值的奇偶性。

let num = 7;
let isOdd = num & 1; // 结果为1,奇数

3. 交换变量

利用异或运算交换两个变量的值,无需额外空间。

let a = 2, b = 3;
a ^= b;
b ^= a;
a ^= b; // a === 3, b === 2

4. 取绝对值

使用位运算取整数的绝对值。

let num = -6;
let abs = (num ^ (num >> 31)) - (num >> 31); // 结果为6

5. 检测数值是否为2的幂

检测一个数是否为2的幂可以通过判断其是否只有一个位是1。

let num = 8;
let isPowerOfTwo = (num & (num - 1)) === 0; // 结果为true

6. 轮转位

通过位运算实现位的循环,左轮或右轮。

let num = 21; // (10101)
num = (num >> 3) | (num << (32 - 3)); // 右轮转3位

7. 快速计算

快速计算n2n,等同于n << n

let n = 5;
let result = 5 << 5; // 结果为160

8. 掩码运算

使用掩码进行位运算,快速提取片段中的信息。

// 使用掩码获取RGB颜色的红色分量
let color = 0xffeEDC;
let red = (color & 0xff0000) >> 16;

9. 快速杜敏运算

利用异或运算实现一次杜敏运算,即不改变其他位的情况下翻转特定位。

let flags = 5; // (101)
let mask = 2; // (010)
flags ^= mask; // 结果为7 (111)

10. 利用掩码来设置位

设置特定位为1而不影响其他位。

let num = 4; // (100)
num |= 2; // 结果为6 (110)

11. 利用掩码来清零位

通过与运算将特定位清零。

let num = 15; // (1111)
num &= ~8; // 结果为7 (0111)

12. 低效的按位非运算

通过按位非运算实现变量值减1。

let num = 10;
num = ~num; // 结果为-11

13. 条件无分支

实现条件判断无需if语句,适用于某些性能敏感的场合。

let a = 10, b = 20;
let max = a - ((a - b) & ((a - b) >> 31));

14. 检测位是否被置位

检测某一位是否为1。

let flag = 8; // (1000)
let isSet = flag & (1 << 3); // 结果为8,表示第3位被置位

15. 浮点数转整数

通过零填充右移将浮点数向下取整。

let floatNum = 3.9;
let intNum = floatNum >> 0; // 结果为3

16. RGB颜色混合

通过位运算实现简易的RGB颜色值混合。

let color1 = 0xff00ff, color2 = 0x00ff00;
let mixed = (color1 & color2) + (((color1 ^ color2) & 0xfefefe) >> 1);

17. 模2^n取余

利用位运算快速取模2的幂。

let num = 19;
let mod = num & (8 - 1); // 结果为3,相当于19 % 8

18. 实现布尔数组

使用位运算实现高效的布尔数组,节约空间。

let array = 0;
array |= 1 << index; // 设置index位置为1
let isTrue = (array & (1 << index)) !== 0; // 检测index位置是否为1

19. 求相反数

通过位运算获取一个数的相反数。

let num = -48;
let opposite = ~num + 1; // 结果为48

20.计算汉明权重

计算一个数二进制表示中1的个数(汉明权重)。

let num = 13; // (1101)
let count = 0;
while(num) {
    count++;
    num &= num - 1; // 清除最低位的1
}
// 结果 count 为3

以上就是20个你不得不知道的js位运算用法的详细内容,更多关于js位运算用法的资料请关注脚本之家其它相关文章!

相关文章

  • JavaScript通过attachEvent和detachEvent方法处理带参数的函数

    JavaScript通过attachEvent和detachEvent方法处理带参数的函数

    通过 attachEvent 和 detachEvent 方法处理带参数的函数(示例代码)
    2010-03-03
  • javascript对象的相关操作小结

    javascript对象的相关操作小结

    下面小编就为大家带来一篇javascript对象的相关操作小结。小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-05-05
  • Handtrack.js库实现实时监测手部运动(推荐)

    Handtrack.js库实现实时监测手部运动(推荐)

    这篇文章主要介绍了实时监测手部运动的 JS 库,可以实现很多有趣功能,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2021-02-02
  • 如何创建 JavaScript 自定义事件

    如何创建 JavaScript 自定义事件

    这篇文章主要介绍了如何创建 JavaScript 自定义事件,我们将通过文章学习到有关创建自定义事件,侦听自定义事件以及创建双击自定义事件所要了解的内容,需要的朋友可以参考一下
    2022-05-05
  • javascript正则表达式模糊匹配IP地址功能示例

    javascript正则表达式模糊匹配IP地址功能示例

    这篇文章主要介绍了javascript正则表达式模糊匹配IP地址功能,结合简单实例形式演示了JS模糊匹配IP地址的实现方法,涉及针对数字及字符串的相关正则判定与匹配操作技巧,需要的朋友可以参考下
    2017-01-01
  • 微信小程序如何自定义table组件

    微信小程序如何自定义table组件

    这篇文章主要介绍了微信小程序如何自定义table组件,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2019-06-06
  • javascript基本数据类型及类型检测常用方法小结

    javascript基本数据类型及类型检测常用方法小结

    这篇文章主要介绍了javascript基本数据类型及类型检测常用方法,总结分析了javascript的基本数据类型与类型检测的常用操作方法,具有一定参考借鉴价值,需要的朋友可以参考下
    2016-12-12
  • JS实现的文件拖拽上传功能示例

    JS实现的文件拖拽上传功能示例

    这篇文章主要介绍了JS实现的文件拖拽上传功能,涉及javascript事件触发、页面元素属性动态修改等相关操作技巧,需要的朋友可以参考下
    2018-05-05
  • ThingJS粒子特效一键实现雨雪效果

    ThingJS粒子特效一键实现雨雪效果

    在做3D项目时,我们经常需要模拟下雨,下雪的天气,有时也会模拟喷泉、着火等效果。这些效果需要使用名为粒子系统(particle)的技术来实现。使用ThingJS可以快速编写粒子效果,本文就来看看如何实现
    2021-05-05
  • Day.js常用方法集合(附各种事件格式的转换)

    Day.js常用方法集合(附各种事件格式的转换)

    dayjs是一个轻量的处理时间和日期的JavaScript库,下面这篇文章主要给大家介绍了关于Day.js常用方法的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下
    2024-03-03

最新评论