談?wù)凧avaScript令人迷惑的==與+
前言
相信很多學(xué)習(xí)過(guò)JavaScript的小伙伴都對(duì)JavaScript的==與+有一些疑惑,經(jīng)常會(huì)出現(xiàn)結(jié)果與自己想象不一樣的情況,而且也沒(méi)找到一個(gè)通用的方法,只能死記硬背,非常難受。(咦,這不就是說(shuō)的我嘛,嘻嘻嘻)今天就一起來(lái)揭開(kāi)它們的神秘面紗,徹底解決掉他們。
正式開(kāi)始之前,先來(lái)小試牛刀一下:
null == undefined; [] == []; ’23’= 23; 45 == [45]; false == undefined; '' == [null]; {} + {}; false + 1
ToPrimitive函數(shù)
ToPrimitive是一個(gè)內(nèi)部函數(shù),用于處理類(lèi)型轉(zhuǎn)換,從字面意思就知道這個(gè)函數(shù)的就是將變量轉(zhuǎn)化為基本類(lèi)型的一個(gè)函數(shù)。
ToPrimitive(input, PreferredType)
第一個(gè)參數(shù)是 input,表示要轉(zhuǎn)化的值;
第二個(gè)參數(shù)是PreferredType,表示希望轉(zhuǎn)換成的類(lèi)型,可為Number/String。
<p style='color:red'>當(dāng)input是日期類(lèi)型時(shí),PreferredType為String,其余情況下都相當(dāng)于傳入Number。</p>
當(dāng)PreferredType傳入?yún)?shù)時(shí)處理步驟會(huì)有差異,處理步驟分別如下:
1.PreferredType傳入Number
(1). 如果input為基本類(lèi)型,直接返回;
(2). 否則,調(diào)用valueOf方法,如果得到一個(gè)基本類(lèi)值直接返回;
(3). 否則,調(diào)用toString方法,如果得到一個(gè)基本類(lèi)值直接返回;
(4). 否則,JavaScript 拋出一個(gè)類(lèi)型異常錯(cuò)誤。
2.PreferredType傳入String
(1). 如果input為基本類(lèi)型,直接返回;
(2). 否則,調(diào)用toString方法,如果得到一個(gè)基本類(lèi)值直接返回;
(3). 否則,調(diào)用valueOf方法,如果得到一個(gè)基本類(lèi)值直接返回;
(4). 否則,JavaScript 拋出一個(gè)類(lèi)型異常錯(cuò)誤。
==
上述介紹了ToPrimitive函數(shù),那么對(duì)于==的結(jié)果就能有一個(gè)清晰的認(rèn)知。
我先給出一個(gè)判斷邏輯,然后再以例子進(jìn)行具體分析:
1.兩邊類(lèi)型一致時(shí),基本變量就直接進(jìn)行值比較,相同則為true,不同則為false,引用變量如果兩邊都指向同一個(gè)內(nèi)存地址那么返回true,否則返回false。
<p style='color:red'>特別情況:</p>
null == undefined //true 可以理解為兩值都為無(wú)效的值,所以內(nèi)部認(rèn)為并無(wú)不同,所以相等 NaN == NaN //false //如果兩個(gè)symbol變量不指向同一內(nèi)存空間那么永為false,否則為true
2.兩邊類(lèi)型不一致:
(1). 先調(diào)用ToPrimitive()返回基本類(lèi)型;
(2). 若類(lèi)型不一致,則調(diào)用ToNumber();( 這里的ToNumber也是一個(gè)內(nèi)部函數(shù),可將值轉(zhuǎn)化為數(shù)字型 )
舉兩個(gè)例子吧:
false == undefined //true //false調(diào)用ToPrimitive返回false //undefined調(diào)用ToPrimitive返回undefined //false調(diào)用ToNumber返回0 //undefined調(diào)用ToNumber返回0
45 == [45] //true //45調(diào)用ToPrimitive返回45 //[45]調(diào)用ToPrimitive返回'45' //45調(diào)用ToNumber返回45 //'45'調(diào)用ToNumber返回45
+
一元操作運(yùn)算符+
+作為一元操作運(yùn)算符邏輯比較簡(jiǎn)單:先調(diào)用ToPrimitive,后調(diào)用ToNumber
+[’1’] //1 //[’1’]調(diào)用ToPrimitive返回'1' //'1'調(diào)用ToNumber返回1
+{} //NaN //{}調(diào)用ToPrimitive返回'[object Object]' //'[object Object]'調(diào)用ToNumber返回NaN
二元操作運(yùn)算符+
+作為二元操作運(yùn)算符邏輯如下:
兩個(gè)值分別調(diào)用ToPrimitive; 如果兩個(gè)的返回值中有一個(gè)為字符串類(lèi)型,則返回兩個(gè)值toString的拼接結(jié)果; 否則返回toNumber相加的結(jié)果null + 1 //1 //null調(diào)用ToPrimitive返回null //1調(diào)用ToPrimitive返回1 //null調(diào)用ToNumber返回0 //1調(diào)用ToNumber返回1 //0 + 1 = 1
[1, 2] + [3, 4] //'1,23,4' //[1, 2]調(diào)用ToPrimitive返回'1,2' //[3, 4]調(diào)用ToPrimitive返回'3,4' //'1,2'調(diào)用toString返回'1,2' //'3,4'調(diào)用toString返回'3,4' //'1,2' + '3,4' = '1,23,4'
以上就是談?wù)凧avaScript令人迷惑的==與+的詳細(xì)內(nèi)容,更多關(guān)于JavaScript ==和+的資料請(qǐng)關(guān)注好吧啦網(wǎng)其它相關(guān)文章!
相關(guān)文章:
1. ASP 信息提示函數(shù)并作返回或者轉(zhuǎn)向2. asp(vbs)Rs.Open和Conn.Execute的詳解和區(qū)別及&H0001的說(shuō)明3. CSS hack用法案例詳解4. PHP設(shè)計(jì)模式中工廠模式深入詳解5. 用css截取字符的幾種方法詳解(css排版隱藏溢出文本)6. ASP+ajax實(shí)現(xiàn)頂一下、踩一下同支持與反對(duì)的實(shí)現(xiàn)代碼7. .NET中l(wèi)ambda表達(dá)式合并問(wèn)題及解決方法8. ThinkPHP5實(shí)現(xiàn)JWT Token認(rèn)證的過(guò)程(親測(cè)可用)9. asp中response.write("中文")或者js中文亂碼問(wèn)題10. JSP數(shù)據(jù)交互實(shí)現(xiàn)過(guò)程解析
