JavaScript位运算符：深入理解与高效应用
简介
尽管JavaScript中的位运算符鲜少受到关注，但它们实际上功能强大且用途广泛。位运算符可用于更快速的数值计算和转换，甚至能替代某些复杂的编码场景，从而使代码更易读。
通过本教程的学习，您将对位运算符有一个基本的理解，包括它们是什么以及如何使用它们。
先决条件
在开始阅读本指南之前，您需要具备以下知识：
概念前提
- 对二进制有非常基本的理解。
- 了解逻辑“与”（AND）和“或”（OR）运算符的工作原理及其结果。
- 理解运算符和操作数。
技术先决条件
JavaScript中二进制的工作原理
由于位运算符在二进制层面工作，因此理解JavaScript如何进行二进制转换至关重要。相信我，这比听起来要简单得多。
我们可以使用toString()函数将任何数字转换为字符串，如下所示：
var n = 2;
console.log(n.toString());
输出2
toString函数有一个参数（称为基数），可用于指定进制。基数决定了目标转换。您可以传入“2”来获取二进制，传入“8”来获取八进制，传入“16”来获取被转换数字的十六进制值。默认情况下，基数为10，因此返回十进制值。
var num = 18;
var binaryText = num.toString(2);
console.log(binaryText);
输出10010
正如我们所见，数字18被转换成了二进制字符串——10010。
注意
提示：要进行反向转换（从二进制字符串获取数字），我们可以使用parseInt("binary_string", 2)。
因此，在我们的例子中，要将“10010”转换为数字18，我们可以使用以下代码：
var num = 18;
var binaryText = num.toString(2);
console.log(binaryText);
console.log(parseInt(binaryText));
输出10010
18
这涵盖了JavaScript中二进制转换的最基本知识。我们可以在不实际了解二进制转换的情况下使用位运算符。然而，这样可能无法理解位运算符的结果是如何计算的。让我们实际看看。
使用位运算符
在本教程中，我们考虑使用基本数字进行位运算。我们将使用的数字是1、2和3。以下是它们各自的二进制表示：
1 → 001
2 → 010
3 → 011
注意
注意：实际的二进制字符串将有63个0和一个1在末尾，构成64位二进制表示。然而，为了简化，我们只取最后3位。
按位与 (&)
按位与运算符可以使用符号“&”来表示（请注意，对于非二进制变量之间的逻辑与操作，我们使用双“&&”）。
以下是“&”对位返回的结果：
0 & 0 = 0
1 & 0 = 0
1 & 1 = 1
这与我们的逻辑与操作非常相似——如果两个条件都为真，则返回真；否则返回假。在这种情况下，“真”被1取代，“假”等于0。
JavaScript通过比较每个二进制位来生成结果二进制数。下表显示了数字1和3之间的按位与操作。
| 数字 | 二进制等效值 | 二进制位 | ||
|---|---|---|---|---|
| 1 | 001 | 0 | 0 | 1 |
| & | & | & | & | & |
| 3 | 011 | 0 | 1 | 1 |
| 结果 = 1 | 0 & 0 = 0 | 0 & 1 = 0 | 1 & 1 = 1 |
如果我们将结果字符串“001”转换为十进制，那么我们将得到“1”作为输出。因此，“1” & “3”的结果是“1”。在内部，JavaScript识别位运算符，并将1和3转换为二进制格式，然后对每个位应用按位与操作，最后将结果二进制字符串转换为十进制数。您可以通过按F12键在浏览器控制台中快速尝试此操作，然后输入：
console.log(1&3);按位或 (|)
按位或使用单个符号“|”。
以下是“|”对位返回的结果：
0 | 0 = 0
1 | 0 = 1
1 | 1 = 1
这类似于逻辑或操作——如果任何一个条件为真，则返回真，否则返回假。在这种情况下，真被1取代，0等于假。
下表显示了数字1和3之间的按位或操作：
| 数字 | 二进制等效值 | 二进制位 | ||
|---|---|---|---|---|
| 1 | 001 | 0 | 0 | 1 |
| | | | | | | | | | |
| 3 | 011 | 0 | 1 | 1 |
| 结果 = 3 | 0 | 0 = 0 | 0 | 1 = 0 | 1 | 1 = 1 |
如果我们将结果字符串“011”转换为十进制，那么我们将得到“3”作为输出。因此，“1” | “3”的结果是“3”。在内部，JavaScript识别位运算符，并将1和3转换为二进制格式，然后对每个位应用按位或操作，最后将结果二进制字符串转换为十进制数。
按位异或 (^)
按位异或的符号是“^”。
以下是“^”对位返回的结果：
0 ^ 0 = 0
1 ^ 0 = 1
1 ^ 1 = 0
异或（排他或）的规则是，如果两个位不同，则返回“1”，否则返回“0”。1和3之间的异或将返回2。以下是解释：
| 数字 | 二进制等效值 | 二进制位 | ||
|---|---|---|---|---|
| 1 | 001 | 0 | 0 | 1 |
| ^ | ^ | ^ | ^ | ^ |
| 3 | 011 | 0 | 1 | 1 |
| 结果 = 2 | 0 ^ 0 = 0 | 0 ^ 1 = 1 | 1 ^ 1 = 0 |
按位左移 (<<)
语法: 数字 << 位置
移位运算符左侧的数字是实际的数字，运算符右侧的数字是移位的位置。例如，“5 << 2”告诉JavaScript对数字5执行向左移位两个位置的操作。以下是JavaScript实际执行左移操作的方式：
- 它将数字转换为二进制等效值。在我们的例子中，数字5将被转换为二进制形式——101。
- 在二进制字符串的右侧添加两个“00”。对于数字5，这将导致10100。
- 将二进制字符串转换为十进制数。在我们的例子中，它将是20。因此，
console.log(5<<2);将返回数字20。
按位右移 (>>)
语法: 数字 >> 位置
右移运算符将从右侧移除二进制位。将移除多少位？正如您可能已经猜到的，就是作为位置指定的数字。
这里有一个例子。假设我们有 5 >> 2。
- JavaScript会将5转换为二进制等效值，在我们的例子中是101。
- 从右侧移除两位。这将导致101。
- 将结果转换为十进制。在我们的例子中，结果将是1。
结论
位运算符初听起来非常复杂，但是一旦我们理解了基础知识，它就非常简单。我们可以使用“.toString(2)”方法将任何数字转换为二进制。这种转换将有助于理解位运算符的输出。所有位运算符在将操作数转换为二进制格式后，都在位级别上工作。
- 位与（AND）运算符：当两个位都为1时，结果为1；否则为0。
- 位或（OR）运算符：当至少一个位为1时，结果为1；否则为0。
- 位异或（XOR）运算符：仅当两个操作数位不同时，结果为1；否则为0。
- 左移（Shift Left）运算符：在末尾添加由第二个操作数指定的0。右移（Shift Right）运算符：移除由第二个操作数指定的位。
希望这篇简要的介绍能帮助您理解位运算符及其结果的计算方式。
