js 關係的一些總結

2021-09-24 07:43:39 字數 4464 閱讀 8602

以前每次遇到用==時的型別轉換總是摸不著頭腦,不知道怎麼進行判斷,所以做了個簡單總結,以後只需套用一些規則即可準確判斷。可喜可賀可喜可賀。

這裡先簡單總結下if的型別轉換,if裡的型別轉換比較簡單,就是使用boolean函式進行轉換,一般憑直覺都可以得出結論:

舉例:

if () 

if ('')

複製**

繼續看看簡單的、不涉及型別轉換的比較,直接看**:

null == null//true

undefined == undefined//true

nan == nan//false,特例

'' == '' //true

0 == 0 //true

true == true//true

{} == {} //false,因為兩個物件的引用不相等

== //false,因為兩個陣列(物件)的引用不相等

var a = function

() {}

var b = function

() {}

a == b//false,因為a與b存放的對函式的引用不相等

var c = d =function

() {}

c == d //true,因為a與b存放的對函式的引用相等

複製**

總結:相同型別相同值的比較之間採用==比較,相當於採用 === 比較,相同型別不同值的比較同理,不會發生型別轉換。

不同型別的比較就比較複雜了,甚至覺得毫無道理可言,隱式的型別轉換是個大坑。

先把number轉換規則放上來,方便後面參考:

undefined、nan、null轉換後分別為nan,nan,0

boolean:ture --> 1, false --> 0

string:「abc」 --> nan, 「123」 --> 123, '' -->0, ' ' -->0,' \n' --> 0

先看簡單的:

null == undefined //true

null == nan //false

undefined == nan //false

nan == nan //false

複製**

這幾個確實比較特別呢,先記著就好,特別是nan,它與自己比較都不相等,別說其他型別的值了。

再看

null == 0;//false

null == '0'//false

null == ''//false

null == ' '//false

null == false//false

null == {}//false

null == //false

複製**

雖然不嚴謹,但綜合以上,我們還是可以大致得出null除了與null 或undefined比較得出true外,其餘為false。同樣地,undefined除了和undefined 或 nul比較得出true外,其餘比較的結果是false,感興趣可以試試。

繼續,先不看引用型別的比較:

0 == '0'//ture

0 == ''//true,number('')返回0

0 == ' '//true,number(' ')返回0

0 == false//true,number(false)返回0

1 == true//true,number(true)返回1

//------ 下面是引用型別的比較,回頭再看--------

.tostring()//''

0 == //true,呼叫valueof後返回引用型別的值,然後呼叫tostring,

//返回'',number('')返回0

[123].tostring()//「123」,number(「123」)返回123

123 == [123]//true,呼叫valueof後返回引用型別的值,會呼叫tostring,返回"123"

//返回的"123"再次發生型別轉換,number("123")返回123

var obj =

}1 == obj//true,呼叫valueof後返回基本型別的值,返回1

var obj2 =

}1 == obj2//true,呼叫valueof方法後返回「1」,又再次進行了型別轉換

//看個稍微頭疼點的,valueof返回了乙個物件

var spam = }}

};1 == spam//false

spam == "[object object]"//true,明顯是呼叫了tostring方法。

複製**

感覺除了引用型別以外,都是把非數值型別通過number函式進行了轉換再和數字比較,引用型別後面再討論。

繼續,先不看引用型別的比較

'' == false //true,number('')返回0,number(false)返回0

' ' == false // true,number(' ')返回0,number(false)返回0

'' == 0 //true

'1' == true //true

'0' == false//true

"0.00" == false//true

'js' == true//false

'js' == false //false,number('js')返回nan

//------ 下面是引用型別的比較,回頭再看--------

var egg = {};

egg.tostring()//"[object object]"

"[object object]" == egg //true,呼叫tostring

var obj =

}'1' == obj//true,valueof返回1,再把左邊的'1'作型別轉換。複製**

有點不講道理,但也不是沒有規律可言:

除了引用型別以外,與字串比較的值都看起來都使用了number函式進行轉換,字串本身也使用了number函式進行轉換。

之前一直忽略了引用型別,回頭再看前面幾次比較,很容易發現它是呼叫了valueof方法,如果valueof返回乙個引用型別的值,則會呼叫tostring方法。

用布林值驗證一下:

obj == true//true,obj呼叫valueof方法後返回1,然後true往number轉

obj == false//false

obj2 == true//true,obj呼叫valueof方法後返回'1',然後obj和true往number轉

obj2 == false//false

var egg = {};

egg == false//false,egg呼叫tostring方法後返回"[object object]",轉number後為nan

egg == true//false

複製**

在使用==的情況下:

undefied和null都只與undefined或null相等。

nan與哪乙個值都不相等

在使用==的情況下若發生型別轉換,除undefined、null 和 nan外:

與number比較的基本型別的值,都會使用number函式轉換為number型別再進行比較。

與number比較的引用型別的值,會先呼叫valueof或tostring方法,如果返回的不是number,則再次進行型別轉換成number再進行比較。

與字串比較的基本型別的值,字串及基本型別的值都會使用number函式轉換為number型別再進行比較。

與字串比較的引用型別的值,會先呼叫valueof或tostring方法,如果返回的不是number,則再次進行型別轉換成number再進行比較。

與布林值比較的引用型別的值,會先呼叫valueof或tostring方法,如果返回的不是布林值,則根據規則1、2、3進行判斷。

如果使用tostring方法後返回的還是引用型別的值,則會嘗試呼叫valueof,反之亦然。

再提煉一下:

在使用==的情況下若發生型別轉換,除undefined、null 和 nan外:

基本型別之間作比較,均轉number若有引用型別,先判斷valueof方法返回的是否是基本型別的值,若是則呼叫valueof方法,否則呼叫tostring。若返回基本型別,返回規則1.感興趣的可以試試把valueof和tostring都重寫然後返回引用型別的值,你會得到乙個無情的報錯。

本文的結論純粹是由歸納推理得出,肯定有不嚴謹之處,望各位不吝賜教。

object.prototype.valueof()

JS一些方法總結

目錄 1 array like資料轉換為陣列,常見的array like資料有nodelist,agruments,具有索引,長度屬性的物件 2 型別判斷 for迴圈 2.array.prototype.slice.call 3.array.from 4.set,針對可迭代物件 typeof,主要用...

js 的一些總結獲取結果

2016年10月4日 每週一篇部落格 獲取下拉框select的選中值 scorestatus option selected val 獲取name為txt 的 input框的值 input name txt val 獲取name為txt 的 input框的id的值 input name txt at...

關於js運動的一些總結

js運動實現,有兩種。一種是速度版,另一種是時間版。速度版是通過對速度的加減乘除,得出元素的運動資料。時間版是通過對時間進行tween公式運算,得出元素的運動資料。速度版運動優點 容易在運動過程中,對運動做一些修改。時間版運動優點 切換或縮小瀏覽器頁面,瀏覽器會對網頁定時器進行停緩處理。這樣會導致一...