JavaScript Weird Part (17) - 強制型轉

Javascript 是一種動態型別語言（Dynamic Typing），所以強制型轉也是常見的情況。強制型轉(Coercion) 也就是轉換一個值的型別，例如數值型別轉換成字串。舉例來說，先前我們已經知道運算子是一種特殊的函數，需要傳入 2 個參數，並且回傳 1 個值。

var a = 1 + 2;
console.log(a);
// 3

以上是單純數字的運作狀況，可是如果是特殊的數字如 NaN，在運算式裡面，只要有一個是 NaN ，結果都會是 NaN :

11 + NaN; //NaN

加號 +

但是以下傳入 2 個不同型別的參數，卻出現 12，發生什麼事？

var a = 1 + "2";
console.log(a);
// 12

在上面的範例中，當 + 號兩側其中一方是字串的時候，另一端就會被「自動型轉」為字串。第一個參數被強制型轉成字串，對 Javascript 而言，當字串與數字相加時，它會自動把數值自動轉型為字串，改變 1 的表現方式來完成這個函數，它選擇轉換型別而非報錯，所以 1 變成’1’，字串’1’與字串’2’相加就是字串’12’，而不是數學意義上的相加。

以 number、boolean、object 來看，型轉的時候會呼叫 toString()去取得對應的字串。但是 null 與 undefined 則透過 String() 分別轉為 null 與 undefined。

10 + "abc"; //'10abc'
true + "abc"; //'trueabc'

//數字與 undefined 相加時，undefined 會被嘗試轉成數字 NaN
123 + undefined; //NaN
//數字與 null 相加時，null 會被嘗試轉成數字 0
123 + null; // 123

以下範例，由於運算式是「由左到右」且「先乘除後加減」所以前面的字串會先跟 num1 相加，再把結果跟 num2 相加

var num 1 = 10;
var num 2 = 100;
var str ="10 加 100 的識字會是" + num1 + num2;
// '10 加 100 的數字會是 10100'

要避免這種問題，可以先用小括號 () 把 num1+num2 包起來

var str = "10 加 100 的數字會是" + (num1 + num2);

減號 -

與加號不同，減法運算式的其中一方不是數字，會有幾種狀況，基本型別：(string、boolean、undefined、null)在做減法運算的時候，JavaScript 會先把基本型別的一方先透過 Number()轉為數字後再運算。

// abc 被 Number() 型轉成 NaN
100 - "abc"; // NaN
// false 被 Number() 型轉成 0

乘法 ＊

乘法運算子比較單純，就由 * 來計算前後兩個數值的乘積。如果前後兩者都是數字，計算結果就是兩個數值的乘積。如果其中有一個不是數字，JavaScript 就會先嘗試用 Number()轉換後再計算

100 * "abc"; //NaN
// true 被型轉成 1
100 * true; // 100

除號 /

除法和乘法規則類似，如果其中一個是 NaN ，結果也會是 NaN，如果其中一個不是數字，就會先用 Number()轉換後再計算。但是在被除數為 0 的情況下：

• 除數為正數，結果為 infinity
• 除數為負數，結果為 - infinity
• 除數為 0，結果為 NaN

取餘數 %

四則運算外，還有一種取餘數，取的是除法運算後的「餘數」。

var a = 100 % 33;
console.log(a); //1

如果被除術是 Infinity 或 -Infinity，取餘數後的結果都會是 NaN

Infinity % 0; //NaN
infinity % -infinity; //NaN

如果被除數是一般值，取餘數的結果為被除數

100 % Infinity; //100