JavaScript 型別轉換

zhangbao發表於2018-01-06

翻譯、演繹自:http://javascript.info/type-conversions

多數時間,運算子和函式會自動將一個值轉換到正確的型別,這稱為“型別轉換”。

例如:alert 會自動將任何型別的值轉化為字串顯示,數學運算子則將值轉換為數字。

ECMAScript 內部定義了一些“抽象操作”,定義了各種值型別的轉換規則,包括:ToNumberToBooleanToStringToPrimitive

ToNumberToBooleanToString 是針對一種基本型別值轉換為另一種基本型別值,定義的轉換規則;ToPrimitive 是針對物件型別轉換為一種基本型別值,定義的轉換規則,而且在必要時從物件型別值轉換出來的基本型別值還要在進行一次轉換到另一個基本型別值的換算。

這節內容並不介紹物件型別轉換(即 ToPrimitive),而是介紹基本型別值的轉換規則。關於物件型別轉換,在 《將物件轉換為基本型別值》 一文介紹。

ToString

當一次運算的期望值是字串的時候,就會發生 ToString 轉換。

例如:用 alert(value) 顯示的 value,最終就會轉換為字串顯示。

當然,我們也可以呼叫 String(value) 函式顯式將 value 轉換為字串。

let value = true;
alert(typeof value); // boolean

value = String(value); // 現在 value 的值是字串 "true"
alert(typeof value); // string

ToString 的轉化規則比較符合直覺:

轉換為……
null "null"
undefined "undefined"
true 和 false "true" 和 "false"
Symbol() 和 Symbol('foo') "Symbol()" 和 "Symbol(foo)"
數字 轉換為對應的字串形式。例如:0 轉換為 "0"

ToNumber

數字轉換會自動發生於數學函式和表示式中。

例如:除號 / 兩邊的非數字型別值就會自動轉換為數字。

console.log('6' / '2'); // 3
console.log(typeof ('6' / '2')); // number

除了 /-*% 運算都會將運算元自動轉換為數字。

當然,如果字串不是一個可以有效轉為數字的值,結果就是 NaN

let age = Number('an arbitrary string instead of a number');
console.log(age); // NaN

總結一下數字轉換規則:

轉換為……
null 0
undefined NaN
true 和 false 1 和 0
Symbol值 NaN
字串 首先去除字串兩邊的空格。如果剩下的是空字串,結果就是 0;如果字串是一個可以有效轉為數字的值,就轉為對應數字,否則結果就是 NaN

例子:

console.log(Number(' 123 ')); // 123
console.log(Number('123z')); // NaN
console.log(true); // 1
console.log(false); // 0

+ 運算子

幾乎所有的數學運算子都會將運算元轉換為數字進行運算。

+ 運算子有一些例外:如果 + 運算子的一邊是字串,那麼另一邊的值也會自動轉換為字串再相加。

console.log(1 + '2'); // "12"
console.log('1' + 2); // "12"

當然,這種情況只發生在運算元之一是字串;如果兩邊都是非字串的情況,那麼就都轉換為數字,然後進行加法運算。

ToBoolean

布林值轉換是最簡單的了,它發生在邏輯運算中:

  • if(..)
  • for(..;..;..)
  • while(..) 和 do..while(..)
  • ?:
  • || 和 &&

但是也可以通過手動呼叫 Boolean(value) 實現。

轉換規則如下:

轉換為……
null, undefined, 0, NaN, '', false false
其它值 true

例如:

console.log(Boolean(1)); // true
console.log(Boolean(0)); // false

console.log(Boolean('Hello')); // true
console.log(Boolean('')); // false

需要注意的是:"0" 會轉換為 true

一些程式語言(比如 PHP)會把 "0" 作為 false 對待。但在 JavaScript 中,所有非空字串都是 true

console.log(Boolean('0')); // true
console.log(Boolean(' ')); // true

總結

這裡有 3 個最為常用的型別轉換:ToStringToNumberToBoolean

ToString:當做輸出操作(如 alert),或顯式呼叫 String(value) 發生。基本型別值轉換為字串是比較符合直覺的。

轉換規則如下:

轉換為……
null "null"
undefined "undefined"
true 和 false "true" 和 "false"
Symbol() 和 Symbol('foo') "Symbol()" 和 "Symbol(foo)"
數字 轉換為對應的字串形式。例如:0 轉換為 "0"

ToNumber:發生數學運算,或者顯式呼叫 String(value) 的情況。

轉換規則如下:

轉換為……
null 0
undefined NaN
true 和 false 1 和 0
Symbol值 NaN
字串 首先去除字串兩邊的空格。如果剩下的是空字串,結果就是 0;如果字串是一個可以有效轉為數字的值,就轉為對應數字,否則結果就是 NaN

ToBoolean:轉換規則是最簡單的,它發生在邏輯運算,或者顯式呼叫 Boolean(value) 的地方。

遵循以下規則:

轉換為……
null, undefined, 0, NaN, '', false false
其它值 true

大多數的規則都是容易理解和記憶的。最經常記錯是這兩個點:

  • undefined 轉換為數字結果是 NaN,而不是 0
  • "0" 和僅包含空格的字串(像 " ")轉換為布林值的結果都是 true,而不是 false

物件轉換在這裡沒有提及,會在下一篇 《將物件轉換為基本型別值》 中介紹。

相關文章