[JS] 關於 Operators 運算子

運算子 (Operators)

大部分的運算子只能搭配基本型別值使用，代表物件會先被強制轉型成基本型別，再進行運算。

[1, 2] + [3] // "1,23"
// String([1, 2]) + String([3])

分類：

1. 賦值運算子(assignment Operators) or 指定運算子
2. 相等性運算子(Equality operators)
3. 關係運算子(Relational operators) or 順序運算子(ordering operators)
4. 加法運算子(plus operator)
5. 特殊運算子

---

運算元的型別一樣

A. 數字運算子

A-1. 算數運算子(arithmetic operators)

eg. (+, -, *, /, %, **(指數: 計算x的y次方 2 ** 3 = 8), ++, - -, -x, +y )

A-2. 位元運算子 (bitwise operators)

eg. (~x, x&y , x|y, x^y, x<<y, x>>y, x>>>y)

B. 布林運算子

B-1. 二元邏輯運算子

eg. (x&&y, x||y)

B-2. 邏輯Not

eg. (!x)

1. 賦值運算子 (assignment operators) or 指定運算子

賦值運算子會根據其右側運算元的數值處理後賦值給其左側的運算元。

= : 賦值運算子 (assignment operator)

x=y=z=12 //x=12 y=12 z=12

+= -= :複合賦值運算子 (compound assignment operator)

1. 算術運算(Arithmetic operators): *=, /=, %=, +=, -=

   let x = 2;
   x+=3 //x=x+3 x=5 

2. 位元運算(bitwise operators): <<=, >>=, >>>=, &=, ^=, |=

3. 字串串接(string concatenation): +=

2. 相等性運算子 (Equality operators)

=== !== : 嚴格相等,不等

只比較同樣型別的值是否相等

undefined === undefined // true
null === null // true

//數字
+0 === -0 // true
NaN === NaN //** false

//字串 布林 結果很明顯

//物件 記憶體位置不同
let b = {}, c = {};
b === c  // false

== != : 寬鬆相等,不等

若是兩個運算元型別相同則以嚴格相等比較，若不同則會先試著轉換不同型別的再比較是否相等

//視為寬鬆相等
undefined == null // true 


//數字 與 字串(->數字) 
1 == '1' // true
0 == ''  // 0 === 0 // true
123 == '\n\t123\r' // true


//非布林 與 布林(->數字)
1 == true // true
'' == false // '' == 0 -> 0 === 0 // true


//數字或字串 與 物件(->ToPrimitive() 轉為基型值)
let obj = {x:2}; //obj.valueOf() -> obj.toString()
obj == '[object Object]'; // true

123 == ['123'] //true  ['123'].toString()  

0 == [] // [].toString() -> 0 == '' // true

//上述情形不適用則為false
0 == undefined // false
0 == null // false

檢查x是一個非值嗎？ (p89)

if(x === undefined || x === null){
   ...
}


if(x == undefined || x == null){
   ...
}

3. 關係運算子(Relational operators) or 順序運算子(ordering operators)

< <= > >=

// 物件 (->ToPrimitive() 轉為基型值)

//字串 比較16位元編碼順序
'apple' < 'orange' // true
'apple' < 'Orange' // false

// 兩個運算元轉為數字比較

4. + 加法運算子(plus operator)

// 物件 (->ToPrimitive() 轉為基型值)

//其中一個為字串 則會串接
'colors: ' + ['red', 'blue', 'green'] // 'colors: red,blue,green'

//兩個運算元轉為數字加起來
3 + true // 4

5. 特殊運算子

? : 條件運算子 or 三元運算子

(condition ? ifTrue : ifFalse)

let x = isMember ? '$2.00' : '$10.00';

, 逗號運算子

逗號運算子允許在一個敘述句中執行多個運算式並回傳最後一個運算式的結果。

123, 'abc' // 'abc'

運算子優先序

void 運算子

void 0 //undefined
void 4+7  //NaN (void 4)+7
void (4+7) //undefined

void的用途:

1. void 0 為 undefined 的同義詞。
2. 丟棄一個運算式的回傳值。

   javascript: void window.open('http://example.com')

3. 置於一個IIFE前

typeof 和 instanceof

• typeof: 運算子區別基本型別與物件，並判斷基本型別

運算元	結果
undefined, 未宣告的變數	‘undefined’
null	‘object’ (是一個BUG)
Boolean值	‘boolean’
數值	‘number’
字串值	‘string’
函式	‘function’
其他所有一般值	‘object’

• instanceof: 判斷一個物件是否為給定建構器(constructor)的實體

{} instanceof Object //true 好像會報錯
[] instanceof Array //true
[] instanceof Object //true

undefined instanceof Object //false
null instanceof Object //false

物件運算子

• new
• delete
• in

參考資料與延伸閱讀：

Speaking Javascript
MDN 運算式與運算子
運算子優先序