Javascript中的 '&” 和 '|” 詳解

一、前言：

在文章開始之前，先出幾個題目給大家看看：

var num1 = 1 & 0;
console.log(num1); // 0
var num2 = 'string' & 1;
console.log(num2); // 0
var num3 = true & 1;
console.log(num3); // 1
var num4 = undefined | false;
console.log(num4); // 0
var num5 = undefined | true;
console.log(num5); // 1
var num6 = 23 & 5;
console.log(num6); // 5
var num7 = 23 | 5;
console.log(num7); // 23

上面的題目大家都做對了嗎？我們之前有總結過 《淺談javascript中的 “ && ” 和 “ || ” 》，"&&” 和 “||” 是邏輯運算表達式中的運算符。那麼一個 “&” 或一個 “|” 又代表什麼意義呢？有什麼特性呢？接下來，我們就來一一揭秘。

首先，我們得清楚 “&” 和 “|” 是位元運算運算子。

位元運算子用於在最基本的層次上，即按記憶體中表示數值的位元來操作數值。 ECMAScript中的所有數值都以IEEE-754 64位元格式存儲，但位元操作符並不會直接操作64位元的值。而是先將64位的值轉換成32位的整數，然後執行操作，最後再將結果轉換為64位。對於開發人員來說，由於64位元儲存格式是透明的，因此整個過程就像是只存在32位元的整數一樣。

對於有符號的整數，32位元中的前31位元用來表示整數的值。第32位表示數值的符號：0表示正數，1表示負數。這個表示符號的位叫做符號位，符號位的值決定了其他位數值的格式。其中，正數以純二進位格式存儲，31位元中的每一位都表示2的冪。第一位（叫做位0）表示20，第二位表示21，以此類推。沒有用到的位元以0表示，即忽略不計。例如，數值18的二進位表示為0000 0000 0000 0000 0000 0000 0001 0010，或更簡潔的10010。這是5個有效位，這5位本身就決定了實際的值。

負數同樣以二進位碼存儲，但使用的格式是二進位補碼。計算一個數值的二進位補碼，需要經過下列3個步驟：

(1)求這個數值絕對值的二進位碼（例如，要求-18的二進位補碼，先求18的二進位碼）；

( 2)求二進位反碼，即將0替換為1，將1替換為0；

(3)得到的二進位反碼加1。

這樣，求得了-18的二進位表示，即1111 1111 1111 1111 1111 1111 1110 1110。

......在ECMAScript中，當對數值應用位元操作符時，後台會發生如下轉換過程：64位元的數值被轉換成32位數值，然後執行位元操作，最後再將32位元的結果轉換回64位數值。這樣，表面上看起來就好像是在操作32位數值，就跟在其他語言中以類似方式執行二進位操作一樣。但這個轉換過程也導致了一個嚴重的副效應，即在對特殊的NaN和Infinity值應用位元操作時，這兩個值都會被當成0來處理。

如果對非數值套用位元運算符，會先使用Number()函數將該值轉換為一個數值（自動完成），然後再套用位元運算。得到的結果將是一個數值。 ……（截取自《Javascript高級程式設計》）

二、「&」（位元與AND）：

按位與操作符由一個和號字符（&）表示，它有兩個操作符數。從本質上來講，按位與操作就是將兩個數值的每一位對齊，對相同位置上的兩個數執行AND操作。

按位與AND操作規則：只有兩個數值的對應位元都是1時才回傳1，任何一位是0，結果都是0。

前面已經把理論性的東西說的太多了，但是我覺得理論又很必要。接下來，直接分析例子吧！

我們先看上面題目中的 num1,num2,num3以及num6。我們嘗試結合上面的理論來分析為什麼會輸出最終的結果。

// num1是1和0进行“按位与”操作后的返回值。1的二进制码简写为1，0的二进制码简写为0，根据上面的规则，第二个操作符数为0，结果是0
var num1 = 1 & 0;
console.log(num1); // 0
// 第一个操作符数是字符串，按照前言里面的理论，对于非数值的操作符数，先使用Number()函数处理，结果返回NaN，NaN又会被当成0来处理。所以最终结果也是0
var num2 = 'string' & 1;
console.log(num2); // 0
// true是布尔类型值，同样使用Number()函数处理，处理后得到数值1，于是表达式就相当于“1 & 1” 进行位运算，当两个数值都为1的时候，结果返回1
var num3 = true & 1;
console.log(num3); // 1
// 23的二进制码是：...10111，5的二进制码是：...00101。然后每一位进行对齐处理，结合上面的规则，可以得出10111&00101的结果是：00101。00101就是5
var num6 = 23 & 5;
console.log(num6); // 5
// 再加个例子：24的二进制码为...11000，7的二进制码为...00111，相同位置的两个数执行AND操作，结果发现结果是...00000。所以最终结果是0，你算对了吗？
var add1 = 24 & 7;
console.log(add1); // 0

三、「|」（位元或OR）：

位元或運算子由一個垂直線符號（|）表示，同樣有兩個運算符數。本質上來講，按位或操作也是將兩個數值的每一位對齊，對相同位置上的兩個數執行OR操作。

按位或OR操作規則：只要兩個數值的對應位有一個是1就回傳1，而只有在兩個位都是0的情況下才回傳0。

我們接最上面的範例來看吧！

// 第一个操作符数为undefined，第二个操作符数是false，均不是数值，所以都要先使用Number()函数处理，处理结果都是返回NaN，NaN又会被当成0处理，于是最终结果是0
var num4 = undefined | false;
console.log(num4); // 0
// 第一个操作符数相当于0，第二个操作符数相当于1，结合按位或的规则，最终结果是1
var num5 = undefined | true;
console.log(num5); // 1
// 23的二进制码是：...10111，5的二进制码是：...00101。然后每一位进行对齐处理，结合上面的规则，可以得出10111|00101的结果是：10111。10111就是23
var num7 = 23 | 5;
console.log(num7); // 23
// 再加个例子：24的二进制码为...11000，7的二进制码为...00111，相同位置的两个数执行AND操作，结果发现结果是...11111。所以最终结果是31，你算对了吗？
var add2 = 24 | 7;
console.log(add2); // 31

四、其他：

相信也會有一些朋友不知道怎麼把數值轉換成標準的二進位碼，那麼有沒有快速的方法呢？答案是肯定的。

我的網路上隨機找到了一個線上轉換工具位址：數值進位轉換（點我查看）。 （當然，你也可以使用你找到的別的工具，不管怎樣，能實現效果就是我們的最終目的）

最後，再附上我通過手寫轉換二進制過程中總結的規律圖，依然可以快速將數值轉換成二進位碼，逼格滿滿噠！

更多Javascript中的 “&” 和 “|” 詳解相關文章請關注PHP中文網！