在 JavaScript 中,值可以有不同的型別。想改變變數的型別,可以透過明確的_型別轉換_來完成。除此之外,當情境需要時,JavaScript 也會進行_型別強制轉換_(隱式型別轉換)。
JavaScript 不像許多其他語言那樣具備把值轉型成(不同)型別的語法建構,但你可以改用一些內建輔助工具。其中最值得一提的是,Boolean、Number和String都可以當成函式使用,把值轉換成對應的型別。
用Boolean(value)可以把任何值轉換成布林值。有一組固定會轉換成false的值,這些值稱為_假值_。最重要的是,false、0、空字串、null、undefined和NaN都是假值。
對其他所有值來說,Boolean會回傳true。這些值稱為_真值_。
Boolean(-1);
// => true
Boolean(0);
// => false
Boolean(' ');
// => true
Boolean('');
// => false
請注意,因為上述規則,'0'、'false'、[]和{}在 JavaScript 中都是真值。
Number(value)可以用來把值轉換成數字。字串開頭和結尾的空白會被忽略,空字串則會轉換成0。如果你試著轉換非原始型別的值,或是無法表示成數字的字串,結果會是NaN(Not-A-Number)。
Number(' -12.34 ');
// => -12.34
Number('1,2');
// => NaN
Number('');
// => 0
Number({ num: 123 });
// => NaN
用String(value)可以把值轉換成字串。對原始型別的值來說,結果就跟你預期的一樣。
String(12.34);
// => '12.34'
String(false);
// => 'false'
String(null);
// => 'null'
String(undefined);
// => 'undefined'
對陣列來說,String函式會對每個元素做字串轉換,再用逗號把結果串接起來。你也可以自己套用join 方法,例如自訂分隔符號。請注意,在這些情況下,null和undefined會轉換成空字串。
String([42, null, true, 'abc']);
// => '42,,true,abc'
對物件來說,String預設會回傳一段沒什麼用的文字。
String({ key: 'value' });
// => '[object Object]'
在某些情境下,JavaScript 會在求值某個敘述之前,自動把值轉換成另一種資料型態。這種隱式轉換就稱為_型別強制轉換_。
當非布林值用在布林情境中時,JavaScript 會套用和Boolean函式相同的規則,隱式轉換這個值。
強制轉換成布林值常見於下列情況:
const num = 0;
if (num) {
// this block is NOT executed because 0 is falsy
}
如果加法運算子+用在原始型別的值上,而其中一個運算元是字串,另一個運算元也會被強制轉換成字串。轉換邏輯和使用String函式時相同。之後,這兩個字串會被串接起來。
let name;
'hello ' + name;
// => 'hello undefined'
許多運算子會依照前面說明的Number函式邏輯,把運算元強制轉換成數字(如果有必要的話)。
+(如果沒有牽涉到字串)、-、*、/、%、**
+、-
>、>=、<、<=
|、&、^、~
想進一步了解這些運算子,請參考 MDN 運算子列表。
為了避免出錯,最好在套用這些運算子之前,一律明確呼叫Number。
你的朋友 Kojo 非常喜歡數字。他有一個叫做「fun-with-numbers」的小網站。Kojo 的程式設計能力不太好,所以他請你幫忙。
你將為 Kojo 網站上的新數字遊戲打造兩個輔助函式,並再打造第三個函式,用來驗證使用者可以輸入的內容。
Kojo 網站上的其中一個遊戲看起來像吃角子老虎機,上面有兩組帶有數字的轉輪。每一組數字都代表一個數字。為了遊戲的運作機制,Kojo 需要知道這兩個數字的總和。
撰寫一個函式 twoSum,接受兩個陣列作為參數。每個陣列由一個或多個介於 0 到 9 之間的數字組成。這個函式應該將每個陣列解讀為一個數字,並回傳這兩個數字的總和。
twoSum([1, 2, 3], [0, 7]);
//=> 130
// [1, 2, 3] represents 123 and [0, 7] represents 7.
// 123 + 7 = 130
網站上的另一個遊戲是一個叫做「Lucky Numbers」的小測驗。使用者可以輸入一個數字,然後看看這個數字是否屬於某個秘密的數列或模式。「幸運數字」的數列或模式每個月都會改變,而且每位使用者只有有限的嘗試次數可以猜出它。
這個月的幸運數字應該是迴文數字。迴文數字在把數字反轉之後仍然維持不變。
實作新的 luckyNumber 函式,接受一個數字作為參數。如果這個數字是迴文,函式應該回傳 true,否則回傳 false。輸入的數字永遠會是正整數。
luckyNumber(1441);
//=> true
luckyNumber(123);
//=> false
網站上有許多地方都有輸入欄位,使用者可以在裡面輸入數字,並點擊按鈕來觸發某些動作。Kojo 想改善他網站的使用者體驗。他希望在使用者點擊按鈕、但欄位中包含無效的輸入值時,顯示錯誤訊息。
以下是關於輸入欄位的值如何產生的一些進一步說明。
undefined 或 null。撰寫一個函式 errorMessage,接受使用者輸入作為參數。如果使用者沒有提供任何輸入,errorMessage 應該回傳 'Required field'。如果輸入不代表非零數字(根據 JavaScript 的轉換規則),則應該回傳 'Must be a number besides 0'。在其他所有情況下,你可以假設輸入是有效的,回傳值應該是空字串。
errorMessage('123');
// => ''
errorMessage('');
// => 'Required field'
errorMessage('abc');
// => 'Must be a number besides 0'