由‘==’和‘===’引出的js的隱式轉換問題

2018-6-1    周周

‘==’和‘===’都是Javascript中的比較運算符,都是比較運算符兩邊是否相等。對于‘==’和‘===’的區(qū)別,大家也都知道:

  ‘==’僅僅是比較運算符兩邊的數值是否相等,如果數值相等則返回true;‘===’不僅會判斷運算符兩邊的數值是否相等,并且還會判斷兩邊的類型是否相等,只有數值和類型都相等才會返回true。雖然知道以上的判斷依據已經能解決絕大數此類問題,但是如果往其中深究來說,會有同學問:在比較的時候‘===’先判斷類型,如果類型不同就直接返回false,這個沒什么問題。但是如果是‘==’比較兩個不同類型的數據時,具體是怎么進行計算判斷的呢?

 既然是不同類型進行比較,肯定最終參與比較的結果必須是同一個類型的,因此JS會存在一個隱式轉換的問題,并且很多JS的隱式轉換很難通過console.log()等方法直觀的觀察到,因此很多初學者會對JS的隱式轉換感到疑惑。

 首先讓我們回憶一下,咱們的JS中一共有哪些數據類型?

       六大數據類型
       基本數據類型(簡單數據類型)
       number 數值型(NaN)
       string 字符串
       boolean 布爾型
       undefined 未定義
       null 空引用
       引用數據類型(復雜數據類型)
       object

       JS基礎中,我們學習到咱們的JS中一共有六種數據類型,分為基本數據類型(簡單數據類型)和引用數據類型(復雜數據類型),不同類型的值進行比較的時候,存在隱式轉換的問題,咱們通過‘==’來驗證一下JS隱式轉換的情況。

       1.我們首先來看看下列的語句計算結果:

console.log(NaN==true);//false
console.log(NaN==false);//false
console.log(NaN==0);//false
console.log(NaN==1);//false
console.log(NaN==NaN);//false

       由上面的例子可以看出,NaN屬于Number數據類型中一個特殊情況,如果‘==’兩邊同為Number數據類型的數字,很直觀的可以看出值是否相同一眼就可以看出結果,但是作為Number類型的特殊情況,NaN在進行比較的時候,也會有特殊的結果:如果 x 或 y 中有一個為 NaN,則返回 false;

       2.我們繼續(xù)看看下列的語句計算結果:

console.log(null == undefined); //true(特殊情況)---------------------------------
console.log(null == ''); //false
console.log(undefined == ''); //false

      在上述例子中,引出了一個null,null是一個簡單數據類型,它的意義就是一個空應用,但是你如果通過console.log(typeof null) 來打印結果的時候卻發(fā)現(xiàn),結果竟然是object?此時你可能會懷疑人生,然后瘋狂的翻閱之前學習的資料,因為object明明是一個復雜數據類型,怎么會在判斷null這個簡單數據類型的類型時打印出來呢?其實,這個問題屬于一個歷史問題。咱們學習的JS在發(fā)展過程中是通過ECMAScript來確定規(guī)范的,每年都會有新的規(guī)定和規(guī)范提出,在JS的發(fā)展過程中,null一開始的作用就是用來指向一個空地址,讓開發(fā)者在創(chuàng)建數據的時候,先用null賦值給還未給值的對象用于標準初始化。但是其實咱們開發(fā)過程中很少用到,但是這個仍作為規(guī)范留了下來。又因為typeof是根據數據的前幾位判斷數據類型的,null相當于空指針,前幾位是地址的格式,所以判斷結果就為object。又因為undefined值是派生自null值的,因此ECMA-262規(guī)定對他們的相等測試要返回true。所以這一情況判斷的條件為:如果 x 與 y 皆為 null 或 undefined 中的一種類型,則返回 true(null == undefined // true);否則返回 false(null == 0 // false);

       3.請看下列例子:

console.log(true == '123'); //false
console.log(true == '1'); //true
console.log(false == '0'); //true
 
console.log(true == !0); //true
 
console.log([] == []); //false
console.log([] == ![]); //true 比較地址 ------------------------------------------------
var a = c = [];
var b = [];
console.log(a == b); //false
console.log(a == !b); //true
console.log(a == c); //true
 
console.log(Boolean([]) == true); //true
console.log(Number([]) == 0); //true
console.log(Number(false) == 0); //true

       其實比較的邏輯為:如果 x,y 類型不一致,且 x,y 為 String、Number、Boolean 中的某一類型,則將 x,y 使用 Number 函數轉化為 Number 類型再進行比較;

      使用Number函數可以將其他的數據類型轉變?yōu)镹umber類型,這一同為Number類型的數據,對比起來就會變得十分簡單。值得注意的是在上述的例子中,兩個空數組進行比較,結果返回的結果仍然為false,這個是怎么回事呢?其實這個很好理解,因為數組也是對象的一種,是復雜數據類型,所以用變量儲存對象時儲存的其實是地址。對象的內容相同,但是儲存在堆區(qū)的位置不同,所以地址也是不同的,所以在判斷的時候返回的是false。

      其實在JS中還有很多的隱式轉換情況,以上只是針對于‘==’的隱式轉換情況,對于這些問題,在實際開發(fā)過程中,需要作為開發(fā)者不斷的學習和積累,這也是咱們作為開發(fā)者的一個要求之一。

分享本文至:

日歷

鏈接

個人資料

藍藍設計的小編 http://sillybuy.com

存檔