深入了解JavaScript中的二进制操作及位掩码应用

什么是二进制？

二进制数由0和1组成，这是计算机使用的基础数字系统。二进制可以表示每个数字，与十进制相似。例如：10 的二进制表示为 1010。十进制和二进制之间的转换可以通过数学方法进行。例如，将十进制数字20转换为二进制：

20 / 2 = 10/余数0
10 / 2 = 5/余数0 
5 / 2 = 2/余数1
2 / 2 = 1/余数0
1 / 2 = 0/余数1

所以，20的二进制表示为 10100。

二进制运算符

JavaScript 提供了许多二进制运算符，它们可以用于 JavaScript 中的数字数据类型。以下是一些最常用的运算符：

按位 AND(&)

按位AND运算符用符号 & 表示，它在两个数字的二进制位上执行逻辑AND操作，并返回一个新的位模式。例如：

console.log(5 & 9); // 输出1

在这个例子中，数字 5 的二进制表示为 101，而数字 9 的二进制表示为 1001。执行按位AND操作后，我们得到的结果是 1。

按位 OR(|)

按位OR运算符用符号 | 表示，它在两个数字的二进制位上执行逻辑OR操作，并返回一个新的位模式。例如：

console.log(5 | 9); // 输出13

在这个例子中，数字 5 的二进制表示为 101，而数字 9 的二进制表示为 1001。执行按位OR操作后，我们得到的结果是 1101。

按位 XOR(^)

按位XOR运算符用符号 ^ 表示，它在两个数字的二进制位上执行逻辑异或操作，并返回一个新的位模式。例如：

console.log(5 ^ 9); // 输出12

在这个例子中，数字 5 的二进制表示为 101，而数字 9 的二进制表示为 1001。执行按位XOR操作后，我们得到的结果是 1100。

按位 NOT(~)

按位NOT运算符用符号 ~ 表示，它对其操作数进行逐位取反，并返回一个新的位模式。例如：

console.log(~5); // 输出-6

在这个例子中，数字 5 的二进制表示为 101。执行按位NOT操作后，我们得到的结果是 -6。

左移(<<)

左移运算符用符号 << 表示，它将其第一个操作数向左移动指定的位数，并使用零填充右侧的空位。例如：

console.log(5 << 2); // 输出20

在这个例子中，数字 5 的二进制表示为 101。执行左移操作后，我们得到的结果是 10100，即十进制数 20。

右移(>>)

右移运算符用符号 >> 表示，它将其第一个操作数向右移动指定的位数，并使用符号位填充左侧的空位。例如：

console.log(10 >> 1); // 输出5

在这个例子中，数字 10 的二进制表示为 1010。执行右移操作后，我们得到的结果是 101，即十进制数 5。

位运算赋值

除了上述基本位运算符之外，JavaScript还提供了一些位运算赋值操作符，用于对变量或表达式进行位运算并将结果保存回同一个变量中。以下是最常见的位运算赋值操作符：

&=

按位AND赋值运算符用符号 &= 表示，它将其左侧的操作数与右侧的操作数进行逻辑AND操作，并将结果保存回左侧的操作数中。例如：

let a = 5;
a &= 9;
console.log(a); // 输出1

在这个例子中，变量 a 初始值为 5，即二进制 101。执行按位AND赋值操作后，我们得到的结果是 1，因为 101 & 1001 等于 1。

|=

按位OR赋值运算符用符号 |= 表示，它将其左侧的操作数与右侧的操作数进行逻辑OR操作，并将结果保存回左侧的操作数中。例如

let a = 5;
a |= 9;
console.log(a); // 输出13

在这个例子中，变量 a 初始值为 5，即二进制 101。执行按位OR赋值操作后，我们得到的结果是 1101，因为 101 | 1001 等于 1101。

^=

按位XOR赋值运算符用符号 ^= 表示，它将其左侧的操作数与右侧的操作数进行逻辑异或操作，并将结果保存回左侧的操作数中。例如：

let a = 5;
a ^= 9;
console.log(a); // 输出12

在这个例子中，变量 a 初始值为 5，即二进制 101。执行按位XOR赋值操作后，我们得到的结果是 1100，因为 101 ^ 1001 等于 1100。

<<=

左移赋值运算符用符号 <<= 表示，它将其左侧的操作数向左移动指定的位数，并使用零填充右侧的空位，并将结果保存回左侧的操作数中。例如：

let a = 5;
a <<= 2;
console.log(a); // 输出20

在这个例子中，变量 a 初始值为 5，即二进制 101。执行左移赋值操作后，我们得到的结果是 10100，即十进制数 20。

>>=

右移赋值运算符用符号 >>= 表示，它将其左侧的操作数向右移动指定的位数，并使用符号位填充左侧的空位，并将结果保存回左侧的操作数中。例如：

let a = 10;
a >>= 1;
console.log(a); // 输出5

在这个例子中，变量 a 初始值为 10，即二进制 1010。执行右移赋值操作后，我们得到的结果是 101，即十进制数 5。

使用位运算进行位掩码

位掩码是一种通过使用按位运算符来设置或清除二进制位的技术。在JavaScript中，可以将位掩码用于各种目的，例如：

• 布尔值：使用一个位表示 true 和 false。
• 权限：使用几个位来表示不同类型的权限。
• 颜色：使用三个字节（24位）来表示红、绿和蓝的值。

下面是一个示例，展示如何使用位掩码从一个字节中提取两个不同的值：

const byte = 0b10110110;
const mask1 = 0b11110000;
const mask2 = 0b00001111;
const value1 = (byte & mask1) >> 4; // 提取高4位并右移4位
const value2 = byte & mask2; // 提取低4位
console.log(value1, value2); // 输出 11 6

在这个例子中，我们首先定义了一个字节 0b10110110。然后我们定义了两个掩码：mask1 只保留字节的高4位（即前四位），而 mask2 只保留字节的低4位（即后四位）。我们然后使用按位AND运算符将每个掩码应用于字节。对于 value1，我们将结果向右移动4位以获取正确的值。最后，我们输出 value1 和 value2 的值，它们分别为 11 和 6。

结论

JavaScript中的二进制操作可以帮助您更好地处理数字和位掩码。本文介绍了一些基本的二进制运算符和位运算赋值操作符，并展示了如何使用位掩码从一个字节中提取多个值。虽然这些技术可能不会在您的日常编程中经常使用，但当您需要进行二进制操作时，它们可能会非常有用。

以上就是深入了解JavaScript中的二进制操作及位掩码应用的详细内容，更多关于JavaScript二进制及位掩码的资料请关注脚本之家其它相关文章！