JavaScript位运算实现权限组合与控制的代码示例
本文详解如何利用JavaScript位运算实现灵活的权限组合与控制。通过定义读写删等基础权限，演示如何使用或、异或、与运算符进行权限添加、切换、判断及删除，结合Loash源码案例解析位掩码在复杂配置中的应用。
在业务开发场景中，处理不同权限的需求十分常见。例如，根据用户角色是否具备编辑权限来决定按钮的显示或隐藏，或者依据传入的配置参数执行特定的业务逻辑，这通常被称为权限控制。
在判断用户是否拥有特定权限时，常规的做法如下所示：
// 用户信息
const userInfo = {
permission: 1
};
const READ = 0; // 读取权限
const WRITE = 1; // 写入权限
const DELETE = 1; // 删除权限
// 判断用户是否有删除权限
if(userInfo.perssion === DELETE) {
// do something...
}
然而，若需判断用户是否同时具备读取和删除权限，上述单一判断方法便无法适用，因为它仅能处理单一权限状态。当涉及多种权限的组合状态时，位运算便成为了必要的解决方案。
以Loash库中的baseClone方法为例，该方法利用bitmask参数来判断是否执行深度克隆或是否克隆Symbols等属性。
普通的克隆方法clone与深度克隆方法cloneDeep均基于baseClone封装实现，两者的核心差异在于第二个参数的取值不同，此处正是位运算的具体应用场景。
接下来，我们将深入探讨位运算的具体机制。
1、位运算概述
现代计算机中，所有数据均以二进制形式存储于设备中，即仅包含0和1两种状态。计算机对二进制数据进行的加减乘除等运算，统称为位运算。
2、位运算符概览
| 符号 | 描述 | 运算规则 |
|---|---|---|
| & | 与 | 两个位都为1时，结果才为1 |
| | | 或 | 两个位都为0时，结果才为0 |
| 异或 | 两个位相同为0，相异为1 | |
| ~ | 取反 | 0变1，1变0 |
| << | 左移 | 各二进位全部左移若干位，高位丢弃，低位补0 |
| >> | 右移 | 各二进位全部右移若干位，对无符号数，高位补0，有符号数，各编译器处理方法不一样，有的补符号位（算术右移），有的补0（逻辑右移） |
3、位运算实现权限组合
既然位运算基于二进制数据进行，我们可以利用二进制数来定义权限变量。
const READ = 0b0001; // 读取权限
const WRITE = 0b0010; // 写入权限
const DELETE = 0b0100; // 删除权限
// 或
const READ = 1;
const WRITE = 2;
const DELETE = 4;
1）权限组合(添加权限)
前文已定义了读、写、删三个独立权限。若要定义一个包含读写功能的权限组合，应如何操作？
根据|运算符的规则，只要两个位中有一个为1，结果即为1。因此，可以按如下方式定义读写权限：
const READ = 0b0001; // 读取权限
const WRITE = 0b0010; // 写入权限
// 组合读写权限
const READ_WRITE = READ | WRITE; // 0b0011
2）权限切换
当用户拥有读权限时，删除其读权限；当用户没有读权限时，添加读权限。这种权限的切换如何实现？
根据^运算符的规则，当两个位相同时结果为0，相异时结果为1。
// 当两个值相等时，结果为0。即自己与自己做异或运算时，结果为0。
0b0001 ^ 0b0001 // 0b0000
// 一个0值与目标做异或运算时，得到目标值。
0b0000 ^ 0b0001 // 0b0001
因此，若要切换某项权限，只需将该权限与当前权限状态进行异或运算即可。
const READ = 0b0001; // 读取权限
const WRITE = 0b0010; // 写入权限
// 用户权限
let userPermission = READ | WRITE; // 0b0011 读写权限
// 切换读取权限
userPermission = userPermission ^ READ; // 0b0010 第一次执行，删除读权限
userPermission = userPermission ^ READ; // 0b0011 第二次执行，添加读权限
3）判断权限组合中是否拥有某个权限
当用户持有一个权限组合时，如何判断其是否拥有特定权限？
根据&运算符的规则，仅当两个位都为1时，结果才为1，否则为0。
// 自己与自己做与运算时，结果为自己。
0b0001 & 0b0001 // 0b0001
// 一个0值与目标做与运算时，结果为0。
0b0000 & 0b0001 // 0b0000
因此，要判断是否拥有某权限，只需将该权限与当前状态进行与运算。若运算结果等于该权限的值，则代表用户拥有该权限。
const READ = 0b0001; // 读取权限
const WRITE = 0b0010; // 写入权限
// 用户权限
const userPermission = READ | WRITE; // 0b0011
// 判断是否有读权限
const hasReadPermission = (userPermission & READ) === READ; // true
4）删除权限组合中的某个权限
若用户拥有读写权限，想要移除其读权限，应如何实现？ 由前述逻辑可知，需先判断用户是否拥有读权限，若拥有，则通过异或运算进行切换（即删除）该权限。
const READ = 0b0001; // 读取权限
const WRITE = 0b0010; // 写入权限
// 用户权限
const userPermission = READ | WRITE; // 0b0011
const hasPermission = (userPermission, value) => {
return (userPermission & value) === value;
};
// 删除读权限
if(hasPermission(userPermission, READ)) {
userPermission = userPermission ^ READ;
};
以上即为JS使用位运算实现权限组合的代码示例的详细内容，更多关于JS位运算实现权限组合的资料请关注本站其它相关文章！
JS中将数组和对象混合组装为JSON字符串
2026-11-05 16:41:42
JS运算符优先级与结合性的区别是什么？
2026-11-05 13:22:02
JS Map怎么只遍历Key或Value
2026-11-05 13:00:36
D3.js 与 ECharts 选型对比：灵活性 vs 开发效率
2026-11-05 09:45:01
为什么JS中typeof []返回object：数组类型检测误区解析
2026-11-04 19:50:47