JavaScript 中的隱式類型轉換

基本上全部的語言都有 隱式類型轉換 ,可是對於 弱類型語言(JS) 來講 ,隱式類型轉換會比 強類型語言(Java) 帶來更大的反作用,有些行爲甚至是難以想象的。雖然你可能很驚訝 ,甚至可能懷疑是 JS 的 BUG,可是這都是有 JS 語言本身的一個隱式類型轉換的套路。

基本的隱式類型轉換

基本類型的隱式轉換

這個其實咱們使用的最多,例如 "10" + 1 結果返回的是 101 而不是 11,這就是String類型的隱式轉換。

在+號的左右側,只要又有一個或者兩個操做數是字符串則作拼接操做

可是其實這句話並不徹底對,例如[1,2] + [3,4]這種也會發生字符串拼接,至於爲何會拼接,我後面會提到,這裏就先賣個關子。

還有 if、while等表達式裏面會將值強行轉換成Boolean,-運算符會將左右兩邊換成 Number

這些都是基本類型的隱式轉換,因爲都比較熟了,加上例子太多我就不一一寫出來了

複雜類型的隱式轉化

上面提到的都是基本類型和基本類型的隱式轉換,那麼複雜類型是如何進行隱式轉換的呢？

複雜類型的轉換會把自身變成基本類型,其方法就是調用 ToPrimitive,實際上就是去嘗試使用 valueOf() 和toString()獲取一個基本類型,優先使用 valueOf 若是沒法獲取到基本類型,則使用 toString。若是二者都沒有獲取到基本類型,他會拋出一個 Cannot convert object to primitive value 錯誤.

如今咱們看回上面提到的 [1,2] + [3,4] 實際上就是 "1,2" + "3,4" 結果天然等於 1,23,4

相等比較的隱式類型轉換

在開始講解 相等比較的隱式類型轉換 的以前,我寫幾個行代碼,你們看看下面這些代碼會打出什麼類型.

false == "";
true == "why?";
false == "0";

"" == 0;

[] == 0;
[] == false;
[] == ![];
[] == "";
[1,2,3] == "123";
[1,2,3] == "1,2,3";

let a = null,b;
a == b;

a == false;
b == false;
a == "";
b == "";
a == 0;
b == 0;

你們能夠執行一下代碼,看看結果是否是與你預期的同樣。我估計能答對的人不會不少。我用一個一個案例來說明 JS的隱式類型轉換

Number 與其餘類型的對比

假設 X 是 Number 類型,Y 是其餘類型,則 X == Y 其實是 X == Number(Y)

顯示轉化Number的時候,""和空格會被轉換爲0

"" == 0 ----> Number("") == 0 ----> 0 == 0

Boolean 與其餘類型的對比

首先咱們要明白 Boolean 中 true 和 false 的概念是什麼

false 的取值範圍是 undefined、null、false、+0、-0、 NaN、""。 true的取值範圍爲 除了 false意外的全部 狀況

而後就是在 Boolean 和其餘類型相等比較 的時候,會遵循下面的一條規則

假設 X 是 Boolean 類型,Y 是其餘類型,則 X == Y 其實是 Number(X) == Y

咱們按着這個規則去看上面的實例

false == "" ----> 0 == ""

而剛剛咱們在上面說過 0 == "" 結果爲 true

true == "why?" ----> 0 == "why?" ----> 0 == Number("why?") ----> 0 == NaN 結果爲 false

至於 false == "0" 我就不解釋了,同樣的轉換邏輯

特別的 undefined 和 null

undefined 和 null 在相等的對比中是比較特別的,JS 規範中

在相等比較中 null 和 undefined 是同一個概念 也就是 null == undefined 爲 true,除此以外他與任何東西都不想等

let a = null,b;
a == b; //true

//下面這些所有返回false
a == 0;
b == 0;
a == "";
b == "";
a == false;
b == false;

關於複雜類型的相等比較

複雜類型的想等比較涉及上面講的ToPrimitive,其規則就是

假設 X 是 複雜類型 類型,Y 是其餘類型,則 X == Y 其實是 ToPrimitive(X) == Y

[] == 0; // "" == 0
[] == false; // "" == false
[] == ""; // "" == ""
[] == ![] // [] == false
[1,2,3] == "123"; // "1,2,3" == "123"
[1,2,3] == "1,2,3"; // "1,2,3" == "1,2,3"

一些特別的狀況

• NaN 與自身不想等

NaN 與自身不想等是 JS 一直以來的規範,至於有啥設計緣由,我暫時不清楚,有了解的讀者能夠告訴我下

本書引用了一些<<你不知道的JavaScript(2)>>的內容,有興趣的能夠買來看一下,物超所值