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

您可以嘗試對每個運算子使用不同的輸入，並觀察輸出以進行更多練習。

列印頁面
上一頁
下一頁
廣告