JavaScript 位运算符



JavaScript 位运算符

JavaScript 中的位运算符对整数的二进制值进行操作。它们用于操作整数的每一位。位运算符类似于逻辑运算符,但它们作用于单个位。

JavaScript 位运算符作用于 32 位操作数。在 JavaScript 中,数字存储为 64 位浮点数。JavaScript 在执行操作之前将数字转换为 32 位有符号整数。位运算之后,它将结果转换为 64 位数字。

JavaScript 中有七个位运算符。以下是位运算符及其说明的列表。

运算符 名称 描述
& 按位与 如果两个位都是 1,则返回 1,否则返回 0。
| 按位或 如果任一位是 1,则返回 1,否则返回 0。
^ 按位异或 如果两个位不同,则返回 1,否则返回 0。
! 按位非 如果位是 0,则返回 1,否则返回 0。
<< 左移 通过从右侧推入零并丢弃最左侧的位来将位向左移动。
>> 右移 通过从左侧推入最左侧位的副本并丢弃最右侧的位来将位向右移动。
>>> 零位右移 通过从左侧推入零并丢弃最右侧的位来将位向右移动。

JavaScript 按位与 (&) 运算符

按位与 (&) 运算符对其整数操作数的每对位执行 AND 操作。操作后,它返回一个具有更新位的新整数值。

当按位与运算符应用于一对位时,如果两个位都是 1,则返回 1,否则返回 0。

以下是按位与运算的真值表:

A B A & B
0 0 0
0 1 0
1 0 0
1 1 1

让我们以 4 位操作数为例来了解按位与运算。

A B A & B
1111 0001 0001
1111 0010 0010
1111 0100 0100
1111 1000 1000

示例

让我们对 5 和 7 执行按位与 (&) 运算。这些数字表示为 32 位整数。

十进制数 二进制等效值 (32 位)
5 00000000000000000000000000000101
7 00000000000000000000000000000111
5 & 7 00000000000000000000000000000101 (= 5)

对 101 和 111 二进制数的每一位进行 OR 运算的结果值与如下相同。

  • 1 & 1 = 1
  • 1 & 0 = 0
  • 1 & 1 = 1

因此,结果二进制数为 111,在十进制表示中等于 7。

<html>
<body>
<div id="output"></div>
<script>
  const a = 5;
  const b = 7;
  document.getElementById("output").innerHTML = "a & b = " + (a & b);
</script>
</body>
</html>

它将产生以下结果:

a & b = 5

JavaScript 按位或 (|) 运算符

按位或 (|) 运算符对其整数操作数的每对位执行 OR 操作。操作后,它返回一个具有更新位的新整数值。

当按位或运算符应用于一对位时,如果任一位是 1,则返回 1,否则返回 0。

以下是按位或运算的真值表。

A B A | B
0 0 0
0 1 1
1 0 1
1 1 1

让我们以 4 位操作数为例来了解按位或运算。

A B A | B
1111 0001 1111
1111 0010 1111
1111 0100 1111
1111 1000 1111

示例

让我们对 5 和 7 执行按位或 (|) 运算。这两个数字表示为 32 位整数。

十进制数 二进制等效值 (32 位)
5 00000000000000000000000000000101
7 00000000000000000000000000000111
5 | 7 00000000000000000000000000000111 (= 7)

对 101 和 111 二进制数的每一位进行 OR 运算的结果值与如下相同。

  • 1 | 1 = 1
  • 1 | 0 = 1
  • 1 | 1 = 1

因此,结果二进制数为 111,在十进制表示中等于 7。

<html>
<body>
<div id="output"></div>
<script>
  const a = 5;
  const b = 7;
  document.getElementById("output").innerHTML = "a | b = " + (a | b);
</script>
</body>
</html>

它将产生以下结果:

a | b = 7

JavaScript 按位异或 (^) 运算符

按位异或 (^) 运算符对其整数操作数的每对位执行异或运算。运算后,它返回一个具有更新位值的整数。

当按位异或运算符应用于一对位时,如果两个位不同,则返回 1,否则返回 0。

以下是按位异或运算的真值表:

A B A ^ B
0 0 0
0 1 1
1 0 1
1 1 0

示例

让我们对 5 和 7 执行按位异或 (^) 运算。

十进制数 二进制等效值 (32 位)
5 00000000000000000000000000000101
7 00000000000000000000000000000111
5 ^ 7 00000000000000000000000000000010 (= 2)

执行 101 和 111 的按位异或运算后,生成的二进制数如下所示。

  • 1 ^ 1 = 0
  • 1 ^ 0 = 1
  • 1 ^ 1 = 0

因此,生成的二进制数为 010,等于 2。

<html>
<body>
<div id="output"></div>
<script>
  const a = 5;
  const b = 7;
  document.getElementById("output").innerHTML = "a ^ b = " + (a ^ b);
</script>
</body>
</html>

它将产生以下输出:

a ^ b = 2

JavaScript 按位非 (~) 运算符

按位非 (~) 运算符对二进制数的每一位执行非运算。它是一个一元运算符,它反转二进制数的每一位,并返回二进制数的二进制补码。

以下是按位异或运算的真值表。

输入 (A) 输出 (~A)
0 1
1 0

示例

让我们执行按位非 (~) 运算。

十进制数 二进制等效值 (32 位)
5 00000000000000000000000000000101
7 00000000000000000000000000000111
~5 11111111111111111111111111111010 (= -6)
~7 11111111111111111111111111111000 (= -8)

尝试执行以下代码:

<html>
<body>
<div id="output"></div>
<script>
  const a = 5;
  const b = 7;
  document.getElementById("output").innerHTML = 
  "~a = " + (~a) + "<br>" +
  "~b = " + (~b)
</script>
</body>
</html>

它将产生以下输出:

~a = -6
~b = -8

按位左移 (<<) 运算符

JavaScript 按位左移 (<<) 运算符将其第一个操作数中的所有位向左移动第二个操作数中指定的位数。新的位从右侧用零填充,最左边的位被丢弃。

将值左移一位相当于将其乘以 2,左移两位相当于将其乘以 4,依此类推。

示例

当您将 5 (101) 左移 1 位时,值变为 10 (1010)。当您执行左移 2 位操作时,结果值为 20 (10100)。

十进制数 二进制等效值 (32 位)
5 00000000000000000000000000000101
5 << 1 00000000000000000000000000001010 (= 10)
5 << 2 00000000000000000000000000010100 (= 20)

以下 JavaScript 程序演示了按位左移运算:

<html>
<body>
<div id="output"></div>
<script>
  const a = 5;
  document.getElementById("output").innerHTML = 
  "a << 1 = " + (a << 1) + "<br>" +
  "a << 2 = " + (a << 2);
</script>
</body>
</html>

它将产生以下输出:

a << 1 = 10
a << 2 = 20

按位右移 (>>) 运算符

按位右移 (>>) 运算符将其第一个操作数中的所有位向右移动第二个操作数中指定的位数。它从左侧插入最左侧位的副本,并丢弃最右边的位。通过这种方式,它保留了数字的符号。

简而言之,它从数字中删除 N 个最后一位。这里,N 是第二个操作数。二进制数的右移相当于将十进制数除以 2。

示例

在下面的示例中,当我们第一次对 101 执行右移运算时,a 的值变为 010。第二次执行右移运算后,结果值为 001,在十进制表示中等于 1。

十进制数 二进制等效值 (32 位)
5 00000000000000000000000000000101
5 >> 1 00000000000000000000000000000010 (= 2)
~5 11111111111111111111111111111010 (= -6)
~5 >>1 11111111111111111111111111111101 (= -3)

尝试执行以下程序:

<html>
<body>
<div id="output"></div>
<script>
  const a = 5;
  document.getElementById("output").innerHTML = 
  "a >> 1 = " + (a >> 1) + "<br>" +
  "~a >> 1 = " + (~a >> 1);
</script>
</body>
</html>

它将产生以下输出:

a >> 1 = 2
~a >> 1 = -3

带零的按位右移 (>>>) 运算符

带零的右移 (>>>) 运算符与右移运算符非常相似。它总是用零填充左侧的位,而无需考虑位的符号。

示例

这里,10 的二进制表示为 1010。当我们执行带零的右移运算时,它将所有位向右移动 2 次,并在开头插入两个 0。因此,结果值为 0010,等于 1。

十进制数 二进制等效值 (32 位)
5 00000000000000000000000000000101
5 >>> 1 00000000000000000000000000000010 (= 2)

以下 JavaScript 程序演示了 >>> 运算符的使用。

<html>
<body>
<div id="output"></div>
<script>
  const a = 5;
  document.getElementById("output").innerHTML = "a >>> 1 = " + (a >>> 1);
</script>
</body>
</html>

它将产生以下结果:

a >>> 1 = 2

您可以尝试对每个运算符使用不同的输入,并观察输出以进行更多练习。

广告