JavaScript/運算子

正則表示式

控制結構

正則表示式

控制結構

字串連線

+ 運算子根據其兩個運算元的型別以兩種不同的方式起作用。如果其中一個或兩個都是字串，它充當字串連線符。如果兩個都是數字，它充當算術加法。

字串連線的一個例子是 "one " + "world"，結果為 "one world"。如果兩個運算元之一不是字串，它會在 + 操作執行之前隱式轉換為字串。

"use strict";

// regular concatenation
const word_1 = "one";
const word_2 = "world";
let   result = word_1 + " " + word_2;
alert(result);        //  "one world"

// implicit type conversion
const arr = [41, 42, 43];
result = word_1 + arr + word_2;   // first, the array is converted to a string
alert(result);        //  "one41,42,43world"

// dito
const x = 1;
result = x + word_2;
alert(result);        //  "1world"

算術運算子

JavaScript 有算術運算子 +、-、*、/、%（餘數）和 **（指數）。這些運算子按你在數學中學習的方式工作。乘法和除法將在加法和減法之前計算。如果你想改變這種優先順序，你可以使用括號。

提示：與其他一些語言相反，除法運算可能導致浮點數 - 它並不總是純粹的整數。

const a = 12 + 5;       // 17
const b = 12 - 5;       // 7
const c = 12 * 5;       // 60
const d = 12 / 5;       // 2.4   Division results in floating point numbers
const e = 12 % 5;       // 2     Remainder of 12/5 is 2
const f = 12 - 2  * 5;  // 2     Multiplication is calculated first
const g =(12 - 2) * 5;  // 50    Parenthesis are calculated first

一些數學運算，例如除以零，會導致返回的變數成為錯誤值之一 - 例如，infinity 或 NaN（非數字）。

餘數運算子的返回值保留第一個運算元的符號。

+ 和 - 運算子也有單目版本，它們只對一個變數進行操作。當以這種方式使用時，+ 返回物件的數字表示，而 - 返回其負對應物。

"use strict";
const a = 42;
const b = +a;    // b is 42
const c = -a;    // c is -42

如上所述，+ 也用作字串連線運算子：如果它的任何引數是字串或不是數字，則所有引數都將轉換為字串並連線在一起。所有其他算術運算子的工作方式相反：它們在求值之前嘗試將其引數轉換為數字。

"use strict";
const a = 42;
const b = "2";
const c = "3";
alert(a + b);   //  "422"  (a string)
alert(a * b);   //  84     (a number)
alert(b * c);   //  6      (a number)

按位運算子

有七個按位運算子：&、|、^、~、>>、<< 和 >>>。

這些運算子將它們的運算元轉換為整數（將任何浮點數截斷為 0），並在它們上執行指定的按位運算。邏輯按位運算子 &、| 和 ^ 在每個單獨的位上執行 and、or 和 xor，並提供返回值。~（not 運算子）反轉整數內的所有位，通常與邏輯按位運算子結合使用。

兩個位移運算子 >>、<< 將位移向一個方向移動，這與乘以或除以二的冪的效果類似。最後一個位移運算子 >>> 的工作方式相同，但在移位時不保留符號位。

這些運算子是為與相關程式語言保持一致而保留的，但在大多數 JavaScript 程式中不太可能使用。

賦值運算子

賦值運算子 = 將值賦給變數。原始型別，如字串和數字，直接分配。但是，函式和物件名稱只是指向相應函式或物件的指標。在這種情況下，賦值運算子只改變對物件的引用，而不是物件本身。例如，在執行以下程式碼後，將提醒“0, 1, 0”，即使傳遞給提醒的是 array_A，但更改的是 array_B。這是因為它們是對同一個物件的兩個引用。

"use strict";
const array_A = [0, 1, 2];
const array_B = array_A;
array_B[2] = 0;
alert(array_A);  // 0, 1, 0

類似地，在執行完下一個程式碼片段後，x 指向一個空陣列。

"use strict";
const z = [5];
const x = z;
z.pop();
alert (x);

如果上述任何一個算術或按位運算子的結果應分配給其第一個運算元，你可以使用更短的語法。將運算子，例如 +，直接與賦值運算子 = 結合，得到 +=。例如，x = x + 5 可以簡寫為 x += 5。

簡寫運算子/賦值語法如下

算術	邏輯	移位
+=	&=	>>=
-=	\|=	<<=
*=	^=	>>>=
/=
%=

例如，+= 在 for 迴圈中的常見用法

"use strict";
const arr = [1, 2, 3];
let sum = 0;
for (let i = 0; i < arr.length; i++) {
  sum += arr[i];  // same as: sum = sum + arr[i];
}
alert(sum);

自增運算子

自增和自減運算子是算術運算子的一種特殊形式：++ 和 --。a++ 自增 a 並返回 a 的舊值。++a 自增 a 並返回 a 的新值。自減運算子的作用類似，但減少了變數。

例如，接下來的操作都執行相同的任務

"use strict";
let a = 1;
alert(a);     // 1

a = a + 1;
alert(a);     // 2

a += 1;
alert(a);     // 3

a++;
alert(a);     // 4

++a;
alert(a);     // 5

// but this SHOWS something different; see next chapter
alert(a++);   // shows 5 again
alert(a);     // nevertheless, 'a' was incremented to 6

前置和後置自增運算子

自增運算子可以在變數之前或之後編寫。該位置決定了它們是前置自增還是後置自增運算子。這會影響操作。

"use strict";

// increment occurs before a is assigned to b
let a = 1;
let b = ++a;  // a = 2, b = 2;

// increment occurs to c after c is assigned to d
let c = 1;
let d = c++;  // c = 2, d = 1;

由於前置和後置自增行為可能令人困惑，如果你避免使用自增運算子，程式碼可能更容易閱讀。

"use strict";

// increment occurs before a is assigned to b
let a = 1;
a += 1;
let b = a;  // a = 2, b = 2;

// increment occurs to c after c is assigned to d
let c = 1;
let d = c;
c += 1;     // c = 2, d = 1;

比較運算子

比較運算子確定其兩個運算元是否滿足給定條件。它們返回 true 或 false。

關於“等於”和“不等於”運算子，你必須小心。== 與 === 不同。第一個嘗試將兩種型別的型別互相適應，然後比較值。第二個同時比較型別和值，只有在型別和值相同的情況下才返回 true：3 == "0003" 為 true，而 3 === "3" 為 false。

運算子。	返回	注意
==	true，如果兩個運算元相等	可能改變運算元的型別（例如，字串作為整數）。
===	true，如果兩個運算元嚴格相等	不改變運算元的型別。如果它們是相同的型別和值，則返回 true。
!=	true，如果兩個運算元不相等	可能改變運算元的型別（例如，字串作為整數）。
!==	true，如果兩個運算元不嚴格相等	不改變運算元的型別。如果它們在型別或值上不同，則返回 true。
>	true，如果第一個運算元大於第二個運算元
>=	true，如果第一個運算元大於或等於第二個運算元
<	true，如果第一個運算元小於第二個運算元
<=	true，如果第一個運算元小於或等於第二個運算元

我們建議使用嚴格版本 (=== 和 !==)，因為簡單版本可能會導致奇怪且不直觀的狀況，例如

0 == ''            // true
0 == '0'           // true
false == 'false'   // false (''Boolean to string'')
false == '0'       // true  (''Boolean to string'')
false == undefined // false
false == null      // false (''Boolean to null'')
null == undefined  // true

…雖然你可能想要

0 === ''            // false
0 === '0'           // false
false === 'false'   // false
false === '0'       // false
false === undefined // false
false === null      // false
null === undefined  // false

邏輯運算子

邏輯運算子是 and、or 和 not - 寫成 &&、|| 和 !。前兩個分別接受兩個布林運算元。第三個接受一個並返回它的邏輯否定。

運算元是布林值或求值為布林值的表示式。

"use strict";
const a = 0;
const b = 1;

if (a === 0 && b === 1) {  // logical 'and'
  alert ("a is 0 AND b is 1");
}

if (a === 1 || b === 1) {  // logical 'or'
  alert ("a is 1 OR b is 1");
}

&& 和 || 是短路運算子：如果在評估第一個運算元後結果得到保證，它將跳過第二個運算元的評估。因此，&& 運算子也被稱為守衛運算子，而 || 運算子被稱為預設運算子。

"use strict";

// declare 'myArray' without initialization
let myArray;

// runtime error!
if (myArray.length > 0) {
  alert("The length of the array is: " + myArray.length);
}

// no error because the part after '&&' will not be executed!
if (myArray && myArray.length > 0) {
  alert("The length of the array is: " + myArray.length);
}

! 運算子用於確定給定布林值的相反值：true 變為 false，而 false 變為 true。

注意：JavaScript 使用布林值 false、數字 0、NaN、空字串或內建型別 undefined 或 null 來表示 false。任何其他值都被視為 true。

關於這三個運算子的優先順序，! 首先被計算，其次是 &&，最後是 ||。

      a  ||   b  &&   !c

    |       |       |    |
    |       |       └ 1. ┘
    |       └───── 2. ───┘
    └───────── 3. ───────┘

有關優先順序和短路之間的關係的更多詳細資訊，請參閱 MDN

其他運算子

`? :`

? : 運算子（也稱為“三元”運算子）是 if 語句的縮寫。首先，它計算問號之前的部分。然後，如果為 true，則計算問號和冒號之間的部分並返回結果，否則計算冒號後的部分。

const target = (a == b) ? c : d;

但是，在使用它時要小心。雖然您可以用三元運算子替換冗長和複雜的 if/then/else 鏈，但這樣做可能不是一個好主意。您可以替換

if (p && q) {
    return a;
} else {
    if (r != s) {
        return b;
    } else {
        if (t || !v) {
            return c;
        } else {
            return d;
        }
    }
}

為

return (p && q) ? a
  : (r != s) ? b
  : (t || !v) ? c
  : d

上面的例子是糟糕的編碼風格/實踐。當其他人（很可能就是你）編輯或維護你的程式碼時，理解和使用程式碼就會變得更加困難。

相反，最好讓程式碼更易於理解。可以從上面的例子中移除一些過度的條件巢狀。

if (p && q) {
    return a;
}
if (r != s) {
    return b;
}
if (t || !v) {
    return c;
} else {
    return d;
}

`delete`

delete obj.x 將屬性 x 從物件 obj 中解綁。

delete 關鍵字從物件中刪除屬性。它會刪除屬性的值和屬性本身。刪除後，在再次新增該屬性之前，無法使用該屬性。delete 運算子旨在用於物件屬性。它對變數或函式沒有影響。

`new`

new cl 建立一個型別為 cl 的新物件。cl 運算元必須是建構函式。

`instanceof`

o instanceof c 測試 o 是否是由建構函式 c 建立的物件。

`typeof`

typeof x 返回一個字串，描述 x 的型別。可能返回以下值。

型別	返回
boolean	"boolean"
number	"number"
string	"string"
function	"function"
undefined	"undefined"
null	"object"
其他（array，...）	"object"

練習

... 在另一個頁面上提供（點選這裡）。

另請參閱

MDN：運算子