一篇文章搞定JS類(lèi)型轉(zhuǎn)換

來(lái)源:一篇文章搞定JS類(lèi)型轉(zhuǎn)換
作者:老姚


為啥要說(shuō)這個(gè)東西歹篓?
一道面試題就給我去說(shuō)它的動(dòng)機(jī)萎战。
題如下:

var bool = new Boolean(false);
if (bool) {
    alert('true');
} else {
    alert('false');
}

運(yùn)行結(jié)果是true8廊荨!蚂维!
其實(shí)啥類(lèi)型轉(zhuǎn)換啊戳粒,操作符優(yōu)先級(jí)啊,這些東西都是最最基本的虫啥。
犀牛書(shū)上有詳細(xì)的介紹蔚约。但我很少去翻犀牛書(shū)的前5章。涂籽。苹祟。

比如說(shuō)優(yōu)先級(jí)那塊兒,很多書(shū)都教育我們评雌,“不用去背誦優(yōu)先級(jí)順序树枫,不確定的話,加括號(hào)就行了景东∩扒幔“
平常我們寫(xiě)代碼時(shí)也確實(shí)這么做的。
但現(xiàn)實(shí)是啥呢斤吐?面試時(shí)會(huì)出這種題搔涝,讓你來(lái)做厨喂。。庄呈。
真不知道這種題的意義是啥蜕煌。。抒痒。

抱怨到此為止幌绍,本文嘗試來(lái)解決類(lèi)型轉(zhuǎn)換問(wèn)題,爭(zhēng)取把《JS權(quán)威指南》49頁(yè)那個(gè)表背下來(lái)故响。

都有哪些東西是假值?
共6個(gè):

0或+0颁独、-0彩届,NaN
""
false
undefined
null

上面的順序是按照基本類(lèi)型來(lái)排列的。
除此之外的一律不是J木啤樟蠕!哪怕是如下形式:

Infinity
'0'、'false'靠柑、" "(空格字符)
任何引用類(lèi)型:[],{},function(){}

if (a && b)的正確理解方式是:a && b進(jìn)行表達(dá)式求值后寨辩,然后再轉(zhuǎn)換為Boolean類(lèi)型。

&&是種短路語(yǔ)法歼冰,求值后不一定是個(gè)Boolean類(lèi)型靡狞,更不是兩邊轉(zhuǎn)化布爾值再運(yùn)算。
比如 2&&3 的結(jié)果是3隔嫡,不是true甸怕。
所以if(a && b),我們平常理解的那種腮恩,"如果a和b同時(shí)為真的話"梢杭,是一種錯(cuò)誤的描述方式。

其他基本類(lèi)型轉(zhuǎn)化為字符串秸滴,基本和預(yù)期的一樣:

console.log("" + null);      // "null"
console.log("" + undefined); // "undefined"
console.log("" + false);     // "false"
console.log("" + true);      // "true"
console.log("" + 0);         // "0"
console.log("" + NaN);       // "NaN"
console.log("" + Infinity);  // "Infinity"

其他基本類(lèi)型轉(zhuǎn)化為數(shù)字武契,需要特殊記憶:

console.log(+null);          // 0
console.log(+undefined);     // NaN
console.log(+false);         // 0
console.log(+true);          // 1
console.log(+"");            // 0
console.log(+'1');           // 1
console.log(+'1x');          // NaN 

其中null,空字符是0荡含,undefined是NaN咒唆。
以上,基本類(lèi)型轉(zhuǎn)換都說(shuō)明白了内颗。

下面來(lái)看看引用類(lèi)型轉(zhuǎn)換為基本類(lèi)型钧排。
引用類(lèi)型轉(zhuǎn)換為布爾,始終為true

引用類(lèi)型轉(zhuǎn)換為字符串

1.優(yōu)先調(diào)用toString方法(如果有)均澳,看其返回結(jié)果是否是原始類(lèi)型恨溜,如果是符衔,轉(zhuǎn)化為字符串,返回糟袁。
2.否則判族,調(diào)用valueOf方法(如果有),看其返回結(jié)果是否是原始類(lèi)型项戴,如果是形帮,轉(zhuǎn)化為字符串,返回周叮。
3.其他報(bào)錯(cuò)辩撑。

引用類(lèi)型轉(zhuǎn)化為數(shù)字

1.優(yōu)先調(diào)用valueOf方法(如果有),看其返回結(jié)果是否是基本類(lèi)型仿耽,如果是合冀,轉(zhuǎn)化為數(shù)字,返回项贺。
2.否則君躺,調(diào)用toString方法(如果有),看其返回結(jié)果是否是基本類(lèi)型开缎,如果是棕叫,轉(zhuǎn)化為數(shù)字,返回奕删。
3.其他報(bào)錯(cuò)俺泣。

首先我們看看常見(jiàn)引用類(lèi)型toString和valueOf返回什么?

var a = {};
console.dir(a.toString());   // "[object Object]"
console.dir(a.valueOf());    // 對(duì)象本身

var b = [1, 2, 3];
console.dir(b.toString());   // "1,2,3"
console.dir(b.valueOf());    // 對(duì)象本身

var c = [[1],[2]];
console.dir(c.toString());   // "1,2"
console.dir(c.valueOf());    // 對(duì)象本身

var d = function() {return 2};
console.dir(d.toString());   // "function() {return 2}"
console.dir(d.valueOf());    // 對(duì)象本身

因此對(duì)應(yīng)的轉(zhuǎn)換為字符串和數(shù)字的情形是:

var a = {};
console.dir(a + "");         // "[object Object]"
console.dir(+a);             // NaN

var b = [1, 2, 3];
console.dir(b + "");         // "1,2,3"
console.dir(+b);             // NaN

var c = [[1],[2]];
console.dir(c + "");         // "1,2"
console.dir(+c);             // NaN

var d = function() {return 2};
console.dir(d + "");         // "function () {return 2}"
console.dir(+d);             // NaN

再來(lái)個(gè)報(bào)錯(cuò)的情形:

var a = {};
a.toString = function() {return {};}
console.log("" + a);         // 報(bào)錯(cuò)
console.log(+a)              // 報(bào)錯(cuò)

以上類(lèi)型轉(zhuǎn)換規(guī)律基本說(shuō)完急侥。

最后來(lái)說(shuō)一下萬(wàn)惡的“==”
面試題如下:

var a = false;
var b = undefined;
if (a == b) {
    alert('true');
} else {
    alert('false');
}

本以為會(huì)彈出true的砌滞。天那!為啥是false?
哈哈。坏怪。贝润。
雙等號(hào),如果兩邊類(lèi)型不同铝宵,會(huì)有隱式轉(zhuǎn)換發(fā)生打掘。犀牛書(shū)75頁(yè)總結(jié)如下:

1,null和undefined鹏秋,相等尊蚁。
2,數(shù)字和字符串侣夷,轉(zhuǎn)化為數(shù)字再比較横朋。
3,如果有true或false百拓,轉(zhuǎn)換為1或0琴锭,再比較晰甚。
4,如果有引用類(lèi)型决帖,優(yōu)先調(diào)用valueOf厕九。
5,其余都不相等地回。

因此有:

console.log(undefined == false); // false
console.log(null == false);      // false
console.log(0 == false);         // true
console.log(NaN == false);       // false
console.log("" == false);        // true

0 == false之所以為true根據(jù)第3條扁远。
"" == false之所以為true根據(jù)第3條,變成了"" == 0,再根據(jù)第2條刻像。

第4條再來(lái)一個(gè)例子:

console.log([[2]] == '2')

其上結(jié)果為true畅买,原因如下:
[[2]]的valueOf是對(duì)象本身,不是基本類(lèi)型细睡。
嘗試調(diào)用toString的結(jié)果是'2'皮获。
因此變成了'2'和數(shù)字2的比較。根據(jù)第2條纹冤,相等。WTF!!

最后說(shuō)句购公,使用"==="就沒(méi)有這些問(wèn)題了萌京。

本文完。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末宏浩,一起剝皮案震驚了整個(gè)濱河市知残,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌比庄,老刑警劉巖求妹,帶你破解...
    沈念sama閱讀 212,383評(píng)論 6 493
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異佳窑,居然都是意外死亡制恍,警方通過(guò)查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,522評(píng)論 3 385
  • 文/潘曉璐 我一進(jìn)店門(mén)神凑,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)净神,“玉大人,你說(shuō)我怎么就攤上這事溉委【槲ǎ” “怎么了?”我有些...
    開(kāi)封第一講書(shū)人閱讀 157,852評(píng)論 0 348
  • 文/不壞的土叔 我叫張陵瓣喊,是天一觀的道長(zhǎng)坡慌。 經(jīng)常有香客問(wèn)我,道長(zhǎng)藻三,這世上最難降的妖魔是什么洪橘? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 56,621評(píng)論 1 284
  • 正文 為了忘掉前任跪者,我火速辦了婚禮,結(jié)果婚禮上梨树,老公的妹妹穿的比我還像新娘坑夯。我一直安慰自己,他們只是感情好抡四,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,741評(píng)論 6 386
  • 文/花漫 我一把揭開(kāi)白布柜蜈。 她就那樣靜靜地躺著,像睡著了一般指巡。 火紅的嫁衣襯著肌膚如雪淑履。 梳的紋絲不亂的頭發(fā)上,一...
    開(kāi)封第一講書(shū)人閱讀 49,929評(píng)論 1 290
  • 那天藻雪,我揣著相機(jī)與錄音秘噪,去河邊找鬼。 笑死勉耀,一個(gè)胖子當(dāng)著我的面吹牛指煎,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播便斥,決...
    沈念sama閱讀 39,076評(píng)論 3 410
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼至壤,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了枢纠?” 一聲冷哼從身側(cè)響起像街,我...
    開(kāi)封第一講書(shū)人閱讀 37,803評(píng)論 0 268
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎晋渺,沒(méi)想到半個(gè)月后镰绎,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,265評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡木西,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,582評(píng)論 2 327
  • 正文 我和宋清朗相戀三年畴栖,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片户魏。...
    茶點(diǎn)故事閱讀 38,716評(píng)論 1 341
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡驶臊,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出叼丑,到底是詐尸還是另有隱情关翎,我是刑警寧澤,帶...
    沈念sama閱讀 34,395評(píng)論 4 333
  • 正文 年R本政府宣布鸠信,位于F島的核電站纵寝,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜爽茴,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 40,039評(píng)論 3 316
  • 文/蒙蒙 一葬凳、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧室奏,春花似錦火焰、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 30,798評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至绒怨,卻和暖如春纯赎,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背南蹂。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 32,027評(píng)論 1 266
  • 我被黑心中介騙來(lái)泰國(guó)打工犬金, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人六剥。 一個(gè)月前我還...
    沈念sama閱讀 46,488評(píng)論 2 361
  • 正文 我出身青樓晚顷,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親疗疟。 傳聞我的和親對(duì)象是個(gè)殘疾皇子音同,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,612評(píng)論 2 350

推薦閱讀更多精彩內(nèi)容