JavaScript運算子總結
阿新 • • 發佈：2021-07-22
一、JavaScript 運算子
1)賦值運算子(Assignment operators [əˈsaɪnmənt]['ɒpəreɪtəz])
2)比較運算子(Comparison operators [kəmˈpærɪsən])
3)算數運算子(Arithmetic operators [əˈrɪθmɪtɪk])
4)位運算子(Bitwise operators [bɪt'waɪz])
5)邏輯運算子(Logical operators [ˈlɑ:dʒɪkl])
6)字串運算子(String operators)
7)條件（三元）運算子(Conditional operator [kənˈdɪʃənəl)
2.比較運算子
比較運算子比較它的運算元並返回一個基於表示式是否為真的邏輯值。運算元可以是數字，字串，邏輯，物件值。字串比較是基於標準的字典順序，使用Unicode值。
在多數情況下，如果兩個運算元不是相同的型別， JavaScript 會嘗試轉換它們為恰當的型別來比較。這種行為通常發生在數字作為運算元的比較。
型別轉換的例外是使用 === 和 !== 操作符，它們會執行嚴格的相等和不相等比較。這些運算子不會在檢查相等之前轉換運算元的型別。下面的表格描述了該示例程式碼中的各比較運算子
var var1 = 3;
var var2 = 4;
equal [ˈikwəl] 相等的
注意: （=>） 不是運算子，而是箭頭函式的標記符號 。
全等和等於的區別：
²全等“===”運算子比較過程：
只有兩個值型別相同並且值也相同的時候，它們才相等。
如果兩個引用值指向同一個物件、陣列或函式，則它們是相等的。如果指向不同的物件，則它們是不等的，儘管兩個物件具有完全一樣的屬性。
如果兩個值為字串，且所含的對應位上的16位數完全相等，則它們相等。如果它們的長度或內容不同，則它們不等。兩個字串可能含義完全一樣且所顯示出的字元也一樣，但具有不同編碼的16位值。JavaScript並不對Unicode進行標準化的轉換，因此像這樣的字串通過“==”和“===”運算子比較的結果也不相等。
²相等“==”運算子比較過程（只比較值，不比較型別）
兩個運算元型別相同並且值也相同，則它們相等。
兩個運算元型別不相同但是值相同，它們也相等，如下：
1）數字和字串運算時，系統會先將字串轉換為數字，然後使用轉換的數值進行比較。
2）數字和布林值比較，true會轉換為1，false會轉換為0再進行比較。
3）數字和物件比較過程，第一步，呼叫物件自身的valueOf方法。如果返回原始型別的值，則直接對該值使用Number函式，轉化為數字進行比較，不再進行後續步驟。
第二步，如果valueOf方法返回的還是物件，則改為呼叫物件自身的toString方法。如果toString方法返回原始型別的值，則對該值使用Number函式，不再進行後續步驟。
第三步，如果toString方法返回的是物件，就報錯。
4）另外：null和undefined相等；
5）其它不同型別之間的比較，均不相等。例如：
var x = "1";
var y = [1];
console.log(x===y);//false
3.JavaScript 算術運算子
算術運算子使用數值(字面量或者變數)作為運算元並返回一個數值.標準的算術運算子就是加減乘除(+ - * /)。
當運算元是浮點數時，這些運算子表現得跟它們在大多數程式語言中一樣（特殊要注意的是，除零會產生Infinity）。
其它算術運算子
4.邏輯運算子
邏輯運算子常用於布林（邏輯）值之間; 當運算元都是布林值時，返回值也是布林值。
不過實際上&&和||返回的是一個特定的運算元的值，所以當它用於非布林值的時候，返回值就可能是非布林值。
能被轉換為false的值有null, 0, NaN, 空字串("")和undefined。
&&（邏輯"與"）操作符的示例：
var a1 = true && true; // t && t returns true
var a2 = true && false; // t && f returns false
var a3 = false && true; // f && t returns false
var a4 = false && (3 == 4); // f && f returns false
var a5 = "Cat" && "Dog"; // t && t returns Dog
var a6 = false && "Cat"; // f && t returns false
var a7 = "Cat" && false; // t && f returns false
||（邏輯"或"）操作符的示例：
var o1 = true || true; // t || t returns true
var o2 = false || true; // f || t returns true
var o3 = true || false; // t || f returns true
var o4 = false || (3 == 4); // f || f returns false
var o5 = "Cat" || "Dog"; // t || t returns Cat
var o6 = false || "Cat"; // f || t returns Cat
var o7 = "Cat" || false; // t || f returns Cat
下面是！（邏輯"非"）操作符的示例：
var n1 = !true; // !t returns false
var n2 = !false; // !f returns true
var n3 = !"Cat"; // !t returns false
短路求值
作為邏輯表示式進行求值是從左到右，它們是為可能的“短路”的出現而使用以下規則進行測試：
false && anything // 被短路求值為false
true || anything // 被短路求值為true
anything [ˈɛniˌθɪŋ] 任何東西
邏輯的規則，保證這些評估是總是正確的。請注意，上述表示式的anything部分不會被求值，所以這樣做不會產生任何副作用。
5.字串運算子
除了比較操作符，它可以在字串值中使用，連線操作符（+）連線兩個字串值相連線，返回另一個字串，它是兩個運算元串的結合。
例如，
console.log("my " + "string"); // console logs the string "my string".
簡寫操作符+= 也可以用來拼接字串，例如：
var myString = "alpha";
myString += "bet"; // 返回 "alphabet"
6.條件（三元）運算子
條件運算子是JavaScript中唯一需要三個運算元的運算子。運算的結果根據給定條件在兩個值中取其一。語法為：
條件? 值1 : 值2
如果條件為真，則結果取值1。否則為值2。你能夠在任何允許使用標準運算子的地方使用條件運算子。
例如，
var status = (age >= 18) ? "adult" : "minor";
當age 大於等於18的時候，將“adult”賦值給 status；否則將“minor”賦值給 status。
7.逗號操作符
逗號操作符（,）對兩個運算元進行求值並返回最終運算元的值。它常常用在 for 迴圈中，在每次迴圈時對多個變數進行更新。
例如，假如a 是一個二維陣列，每個維度各有10個元素，以下程式碼利用逗號操作符來同時改變兩個變數的值。這段程式碼的功能是打印出該二維陣列的對角線元素的值：
var x = [0,1,2,3,4,5,6,7,8,9]
var a = [x, x, x, x, x];
for (var i = 0, j = 9; i <= j; i++, j--)
console.log('a[' + i + '][' + j + ']= ' + a[i][j]);
8.一元操作符
一元操作符僅對應一個運算元。
8.1typeof
typeof操作符 可通過下面2種方式使用：
typeof operand
typeof (operand)
typeof 操作符返回一個表示 operand 型別的字串值。operand 可為字串、變數、關鍵詞或物件，其型別將被返回。operand 兩側的括號為可選。
假設你定義瞭如下的變數：
var myFun = new Function("5 + 2");
var shape = "round";
var size = 1;
var today = new Date();
typeof 操作符將會返回如下的結果：
typeof myFun; // returns "function"
typeof shape; // returns "string"
typeof size; // returns "number"
typeof today; // returns "object"
typeof dontExist; // returns "undefined"
對於關鍵詞true 和 null， typeof 操作符將會返回如下結果：
typeof true; // returns "boolean"
typeof null; // returns "object"
對於一個數值或字串，typeof 操作符將會返回如下結果：
typeof 62; // returns "number"
typeof 'Hello world'; // returns "string"
對於屬性值，typeof 操作符將會返回屬性所包含值的型別：
typeof document.lastModified; // returns "string"
typeof window.length; // returns "number"
typeof Math.LN2; // returns "number"
8.2delete
delete操作符，刪除一個物件或一個物件的屬性或者一個數組中某一個鍵值。語法如下:
delete objectName;
delete objectName.property;
delete objectName[index];
delete property; // legal only within a with statement
objectName是一個物件名，property 是一個已經存在的屬性，index是陣列中的一個已經存在的鍵值的索引值。
第四行的形式只在with宣告的狀態下是合法的， 從物件中刪除一個屬性。
你能使用delete 刪除各種各樣的隱式宣告， 但是被var宣告的除外。
如果delete 操作成功，屬性或者元素會變成 undefined。如果 delete可行會返回true，如果不成功返回false。
x = 42;
var y = 43;
myobj = new Number();
myobj.h = 4; // create property h
delete x; // returns true (can delete if declared implicitly)
delete y; // returns false (cannot delete if declared with var)
delete Math.PI; // returns false (cannot delete predefined properties)
delete myobj.h; // returns true (can delete user-defined properties)
delete myobj; // returns true (can delete if declared implicitly)
9.關係操作符
關係操作符對運算元進行比較，根據比較結果真或假，返回相應的布林值。
9.1instanceof
如果所判別的物件確實是所指定的型別，則返回true。其語法如下：
objectName instanceof objectType
objectName 是需要做判別的物件的名稱,而objectType是假定的物件的型別, 例如Date或 Array.
當你需要確認一個物件在執行時的型別時，可使用instanceof. 例如，需要 catch 異常時，你可以針對丟擲異常的型別，來做不同的異常處理。
9.2in
in操作符，如果所指定的屬性確實存在於所指定的物件中，則會返回true，語法如下：
propNameOrNumber in objectName
在這裡propNameOrNumber可以是一個代表著屬性名的字串或者是一個代表著陣列索引的數值表示式，而objectName則是一個物件名。
下面的例子是in 操作的常見用法。
// Arrays
var trees = new Array("redwood", "bay", "cedar", "oak", "maple");
0 in trees; // returns true
3 in trees; // returns true
5in trees; // returns false，索引只到4
"bay" in trees; // returns false (必須指定索引號, "bay"不是索引的值)
"length" in trees; // returns true (length 是陣列屬性)
// 預定義物件
"PI" in Math; // returns true
var myString = new String("coral");
"length" in myString; // returns true
// Custom objects
var mycar = {make: "Honda", model: "Accord", year: 1998};
"make" in mycar; // returns true
"model" in mycar; // returns true
10.位運算子
位運算子將它的運算元視為32位元的二進位制串（0和1組成）而非十進位制八進位制或十六進位制數。
例如：十進位制數字9用二進位制表示為1001，位運算子就是在這個二進位制表示上執行運算，但是返回結果是標準的JavaScript數值。
位運算子範例
移位運算子
移位運算子帶兩個運算元：第一個是待移位的數，第二個是指定第一個數要被移多少位的數。移位的方向由運算子來控制.
移位運算子把運算元轉為32bit整數，然後得出一個與待移位數相同種類的值。
移位運算子列表如下：
二、知識拓展：
1.運算子優先順序
運算子的優先順序，用於確定一個表示式的計算順序。在你不能確定優先順序時，可以通過使用括號顯式宣告運算子的優先順序。
下表列出了描述符的優先順序，從最高到最低。
2.二進位制
二進位制資料是用0和1兩個數碼來表示的數。它的基數為2，進位規則是“逢二進一”，借位規則是“借一當二”。它是計算技術中廣泛採用的一種數制。
2.1二進位制法則：
乘法法則：0×0=0，0×1=0，1×0=0，1×1=1
除法法則：0÷1=0，1÷1=1；除法應注意：0÷0 =0(無意義)，0÷1 =0，1÷0 =0(無意義)
加法法則：0+0=0，0+1=1，1+0=1，1+1=10
減法法則：0-0 =0，1-0=1，1-1=0，0-1=1此時有借位（需從上一位借值，當需要向上一位借數時，必須把上一位的1看成下一位的（2）實際是10）。比如：10100-1010=1010
二進位制演算法：
二進位制的或運算：遇1得1
二進位制的與運算：遇0得0
二進位制的非運算：各位取反
總結：二進位制與十進位制的演算法格式相同，只不過十進位制是逢十進一，而二進位制是逢二進一。
十進位制轉二進位制、十六進位制：
二進位制與八進位制十六進位制轉換技巧：
二進位制從最低位開始每三位轉換為十進位制即為其對應八進位制。
高位不足三位，補零。
同理二進位制從最低位開始每四位轉換為十進位制即為其對應十六進位制。
高位不足四位，補零。
例如1001100₂= 114₈= 4C₁₆
001001100轉八進位制時，高位補零。
01001100轉十六進位制時，高位補零。
其它：
位元組是電腦中的基本儲存單位，根據計算機字長的不同，字具有不同的位數，現代電腦的字長一般是32位的，也就是說，一個字的位數是32。
二進位制的負數：
比如：原碼：14 即 00000000 00000000 00000000 00001110（高位不足這麼多位的時候補零！）；
原碼：一個整數按照絕對值的大小轉化成二進位制的數；
二進位制中，負數以正數的補碼錶示
補碼：反碼加1
反碼：將二進位制數按位取反
14的反碼即原碼取反（也就是1變0，0變1）：11111111 11111111 11111111 11110001
補碼（-14）：11111111 11111111 11111111 11110010
二進位制<<左移運算子
將一個運算物件的各二進位制位全部左移若干位（即：左邊的二進位制丟棄，右邊補0）
14 的二進位制00000000 00000000 00000000 00001110左移2位 為
00000000 00000000 00000000 00111000//56
-14的二進位制（11111111 11111111 11111111 11110010）左移2位 為
11111111 11111111 11111111 11001000 結果為（-56）
總結：對於左移，直觀的理解為，對於正數來說，左移1位相當於乘以2（但效率比乘法高）；對於負數來說，沒有直觀的理解。
>>右移運算子
將一個運算物件的各二進位制位全部右移若干位，正數左補0，負數左補1.
4 >> 2 = 1;
-14 >> 2 = -4;
總結：對於右移，直觀的理解為，對於正數來說，右1移相當於除以2（但效率比除法高）；對於負數來說，沒有直觀的理解。
題：
var a = 2+"3";
console.log(typeof a);
var b = !a + null;
console.log(typeof b);
var c = !true + "3"*2;
console.log(typeof c);
var d = a++ + b--;
console.log(typeof d);
var e = ![23]+1+(1<6);
console.log(typeof e);
重點：
//1.賦值運算=+=支援字串拼接
//2.比較運算子=====兩個字串比較大小，比較的是Unicode編碼的序號，靠後的序號大
//其他情況，所有資料都轉換成數字進行比較
//NaN與資料比較的結果只能是false
//3.算數運算子所有資料都轉換成數字進行數學運算（除字串和+相連線的情況）
//i++先賦值，後運算當前i===之前的i
//++i先運算，後賦值當前i===之後的i
//所有語句的運算都是變數在參與運算，一定要知道當前變數的值是多少
//4.字串運算子+
//5.邏輯運算子：&&||！
//之前語句&&之後語句如果&&之前的語句結果可以轉換成false，那麼它的結果就是之前的語句，反之則是之後的語句
//之前語句||之後語句如果||之前的語句結果可以轉換成true，那麼它的結果就是之前的語句，反之則是之後的語句
| 名字 | 簡寫的操作符 | 含義 |
|
賦值(Assignment) |
x = y | x = y |
| 加法賦值(Addition assignment) | x += y | x = x + y |
| 減法賦值(Subtraction assignment) | x -= y | x = x - y |
| 乘法賦值(Multiplication assignment) | x *= y | x = x * y |
| 除法賦值(Division assignment) | x /= y | x = x / y |
| 求餘賦值(Remainder assignment) | x%= y | x = x% y |
|
求冪賦值(Exponentiation assignment) |
x **= y | x = x ** y |
| 左移位賦值(Left shift assignment) | x <<= y | x = x << y |
| 右移位賦值(Right shift assignment) | x >>= y | x = x >> y |
| 無符號右移位賦值(Unsigned right shift assignment) | x >>>= y | x = x >>> y |
| 按位與賦值(Bitwise AND assignment) | x &= y | x = x & y |
| 按位異或賦值(Bitwise XOR assignment) | x ^= y | x = x ^ y |
| 按位或賦值(Bitwise OR assignment) | x |= y | x = x | y |
| 運算子 | 描述 | 返回true的示例 |
| 相等Equal(==) | 如果兩邊運算元相等時返回true。 | 3 == var1 "3" == var1 3 == '3' |
| 不等於 Not equal(!=) | 如果兩邊運算元不相等時返回true | var1 != 4 var2 != "3" |
| 全等 Strict equal(===) | 兩邊運算元相等且型別相同時返回true。 | 3 === var1 |
| 不全等 Strict not equal(!==) | 兩邊運算元不相等或型別不同時返回true。 | var1 !== "3" 3 !== '3' |
| 大於 Greater than(>) | 左邊的運算元大於右邊的運算元返回true | var2 > var1 "12" > 2 |
| 大於等於 Greater than or equal(>=) | 左邊的運算元大於或等於右邊的運算元返回true | var2 >= var1 var1 >= 3 |
| 小於 Less than(<) | 左邊的運算元小於右邊的運算元返回true | var1 < var2 "2" < 12 |
| 小於等於 Less than or equal(<=) | 左邊的運算元小於或等於右邊的運算元返回true | var1 <= var2 var2 <= 5 |
| 算符 | 描述 | 例子 | x 運算結果 | y 運算結果 |
| + | 加法 | x=y+2 | 7 | 5 |
| - | 減法 | x=y-2 | 3 | 5 |
| * | 乘法 | x=y*2 | 10 | 5 |
| / | 除法 | x=y/2 | 2.5 | 5 |
| % | 取模（餘數） | x=y%2 | 1 | 5 |
| ++ | 自增（i++，先賦值，後 | x=++y | 6 | 6 |
| 加加；++i，先加加，後賦值） | x=y++ | 5 | 6 | |
| -- | 自減 | x=--y | 4 | 4 |
| x=y-- | 5 | 4 |
| 一元負值符(-) | 一元運算子,返回運算元的負值. | var x=3;console.log(-x); //輸入-3 |
| 一元正值符(+) | 一元運算子, 如果運算元在之前不是number，試圖將其轉換為number | console.log( +'3' ); // 3 |
| console.log( '3' ); // '3' | ||
| console.log(+true); // 1 | ||
| 指數運算子(**) | 計算base(底數)的exponent(指數)次方, 表示為baseexponent | 2 ** 3returns8. |
| 10 ** -1returns0.1. |
| 運算子 | 範例 | 描述 |
| 邏輯與(&&) | expr1 && expr2 | (邏輯與) 如果expr1能被轉換為false，那麼返回expr1；否則，返回expr2。因此，&&用於布林值時，當運算元都為true時返回true；否則返回false. |
| 邏輯或(||) | expr1 || expr2 | (邏輯或) 如果expr1能被轉換為true，那麼返回expr1；否則，返回expr2。因此，||用於布林值時，當任何一個運算元為true則返回true；如果運算元都是false則返回false。 |
| 邏輯非(!) | !expr | (邏輯非) 如果運算元能夠轉換為true則返回false；否則返回true。 |
| Operator | Usage | Description |
| 按位與AND | a & b | 在a,b的位表示中，每一個對應的位都為1則返回1， 否則返回0. |
| 按位或OR | a | b | 在a,b的位表示中，每一個對應的位，只要有一個為1則返回1， 否則返回0. |
| 按位異或XOR | a ^ b | 在a,b的位表示中，每一個對應的位，兩個不相同則返回1，相同則返回0. |
| 按位非NOT | ~ a | 反轉被運算元的位。 |
| 左移shift | a << b | 將a的二進位制串向左移動b位,右邊移入0. |
| 算術右移 | a >> b | 把a的二進位制表示向右移動b位，丟棄被移出的所有位.(譯註:算術右移左邊空出的位是根據最高位是0和1來進行填充的) |
| 無符號右移 (左邊空出位用0填充) | a >>> b | 把a的二進位制表示向右移動b位，丟棄被移出的所有位，並把左邊空出的位都填充為0 |
| 表示式 | 結果 | 二進位制描述 |
| 15 & 9 | 9 | 1111 & 1001 = 1001 |
| 15 | 9 | 15 | 1111 | 1001 = 1111 |
| 15 ^ 9 | 6 | 1111 ^ 1001 = 0110 |
| ~15 | -16 | ~00000000...00001111 =11111111...11110000 |
| ~9 | -10 | ~00000000...00001001 =11111111...11110110 |
| 運算子 | 描述 | 範例 |
| <<(左移位) | 將第一個運算元向左移動指定數量的位. 左邊移出位被拋棄. 左邊移出的幾位被丟棄.右邊多出的空位由0補齊 | 9<<2產生36，因為1001移位2位元向左變為100100，它是36。 |
| >>(帶符號右移) | 將第一個運算元向右移動指定數量的位.右邊移出位被拋棄. 左邊多出的空位由原值的最左邊數字補齊. | 9>>2產生2，因為1001移位2位向右變為10，其是2。同樣，-9>>2產生-3，由於符號被保留。 |
| >>>(補零右移) | 將第一個運算元向右移動指定數量的位.右邊移出位被拋棄. 左邊多出的空位由0補齊. | 19>>>2產生4，因為10011移位2位向右變為100，它是4。對非負數值，補零右移和帶符號右移產生相同結果。 |
| Operator type | Individual operators |
| member | . [] |
| call / create instance | () new |
| negation/increment | ! ~ - + ++ -- typeof void delete |
| multiply/divide | * / % |
| addition/subtraction | + - |
| bitwise shift | << >> >>> |
| relational | < <= > >= in instanceof |
| equality | == != === !== |
| bitwise-and | & |
| bitwise-xor | ^ |
| bitwise-or | | |
| logical-and | && |
| logical-or | || |
| conditional | ?: |
| assignment | = += -= *= /= %= <<= >>= >>>= &= ^= |= |
| comma | , |