JavaScript中類型的強(qiáng)制轉(zhuǎn)換與隱式轉(zhuǎn)換詳解
一、隱式轉(zhuǎn)換
以下語句的執(zhí)行結(jié)果是什么?
A. undefined == null
B. isNaN("100")
C. parseInt("1a") === 1
D. [ ] instanceof Array
答案:
A. undefined == null 為 true; undefined === null 為 false
B. 當(dāng)傳入 NaN 或能被轉(zhuǎn)換成 NaN 的值,isNaN 返回 true,"100"會(huì)被先轉(zhuǎn)成 Number–>100,不為 NaN,因此返回 false
C. parseInt("1a")只會(huì)解析前面是數(shù)字的部分,即只解析"1",parseInt("1a1”) === 1 也為 true
D. [ ]是個(gè)空數(shù)組,返回 true
雙等號(hào)里的轉(zhuǎn)換
熱身完畢再來看一段代碼:
if ([]) {
console.log(true);
}
結(jié)果輸出了 true。
其實(shí) [] 為 false,因?yàn)樵诘忍?hào)比較時(shí),如果有一邊是 Boolean 值,會(huì)優(yōu)先將左右兩邊的數(shù)據(jù)轉(zhuǎn)為 Number,
即:
Number([]); // 0 Number(false); // 0
因此[] 為 false。
但是,但是,進(jìn)行 if 判斷時(shí),會(huì)將數(shù)據(jù)轉(zhuǎn)為 Boolean 類型,
即:
Boolean([]); // true
所以可以輸出 true。
總結(jié)一些雙等號(hào)判斷時(shí)的技巧:
- 如果雙等號(hào)前后有 NaN,一律返回 false;
- 如果雙等號(hào)前后有布爾值(0,1 也算),一律轉(zhuǎn)成數(shù)字再比較,(false 為 0,true 為 1);
- 如果雙等號(hào)前后有字符串,分為三種情況:
- 另一端是對象,則對象使用 toString 或者 ValueOf 進(jìn)行轉(zhuǎn)換;
- 另一端是數(shù)字,字符串轉(zhuǎn)數(shù)字;
- 另一端是字符串,直接比較;
- 其他一律返回 false。
- 如果一端是數(shù)字,另一端是字符串如 '3'則參考第三條。另一端是對象,取對象的 toString 或 ValueOf 結(jié)果進(jìn)行比較,其他一律返回 false;
- null 和 undefined 不進(jìn)行類型轉(zhuǎn)換,但是它們倆相等;
Boolean 類型轉(zhuǎn)換
var test = new Boolean();
console.log(test);
var test = new Boolean(0);
console.log(test.valueOf());
var test = new Boolean(null);
console.log(test.valueOf());
var test = new Boolean("");
console.log(test.valueOf());
var test = new Boolean(NaN);
console.log(test.valueOf());
答案為:
false false false false false
原理如下:
- 當(dāng)作為一個(gè)構(gòu)造函數(shù)(帶有運(yùn)算符 new)調(diào)用時(shí),Boolean() 將把它的參數(shù)轉(zhuǎn)換成一個(gè)布爾值,并且返回一個(gè)包含該值的 Boolean 對象,注意這里返回的是 Boolean 對象,可以通過 toString 或者 valueOf 取值;
- 如果作為一個(gè)函數(shù)(不帶有運(yùn)算符 new)調(diào)用時(shí),Boolean() 只將把它的參數(shù)轉(zhuǎn)換成一個(gè)原始的布爾值,并且返回這個(gè)值——強(qiáng)制類型轉(zhuǎn)換;
- 如果省略 value 參數(shù),或者設(shè)置為 0、-0、null、""、false、undefined 或 NaN,則該對象設(shè)置為 false。否則設(shè)置為 true(即使 value 參數(shù)是字符串 "false”)。
"+" 與 "-"
console.log(1 + "2" + "2");
console.log(1 + +"2" + "2");
console.log("A" - "B" + "2");
console.log("A" - "B" + 2);
輸出結(jié)果如何?
結(jié)果為:122 32 NaN2 NaN
解析:
- 數(shù)字和字符串相加,會(huì)將數(shù)字轉(zhuǎn)為字符串,所以結(jié)果是字符串拼接,第一句輸出"122";
- +"2”,這里的一元運(yùn)算符+,會(huì)將字符串轉(zhuǎn)為數(shù)字,于是 1+ +"2” = 1+2 = 3,再與后面的字符串合并,所以第二句輸出”32";
- 減號(hào)會(huì)將減號(hào)兩邊都先轉(zhuǎn)化成數(shù)字,而 Number("A”)、Number("B”)結(jié)果是 NaN,減法操作中,只要有一方為 NaN,結(jié)果都是 NaN,因此第三句是 NaN 和"2"的拼接,結(jié)果為 NaN2(第 4.1 點(diǎn)中提到,雙等號(hào)其中一方為 NaN,結(jié)果為 false);
- 根據(jù)前一句的解析,"A”-"B"結(jié)果為 NaN,與數(shù)字 2 相加,結(jié)果還是 NaN
二、強(qiáng)制類型轉(zhuǎn)換
對于代碼 var a = 10.42; 取出 a 的整數(shù)部分,以下代碼哪些是正確的?
A. parseInt( a );
B. Math.floor( a );
C. Math.ceil( a );
D. a.split('.')[0];
答案:AB
很多人看一眼就會(huì)選擇ABC
解析:
A. parseInt 轉(zhuǎn)換為整數(shù),默認(rèn)為 10 進(jìn)制,結(jié)果為 10;
B. floor 向下取整,結(jié)果為 10 —— floor 是地板的意思,向下取整,輔助記憶;
C. ceil 向上取整,結(jié)果為 11;
D. split 操作數(shù)必須是正則或字符串,結(jié)果為 TypeError。
new String 與 ' '
下面哪些執(zhí)行結(jié)果為 true?
A. 'foo' == new function(){ return String('foo'); };
B. 'foo' == new function(){ return new String('foo'); };
C. [] == 0
D. ![]
E: !0
答案:
A:下面細(xì)說;
B:下面細(xì)說;
C:Number([])結(jié)果是 0,因此 C 選項(xiàng)正確;
D:對象總等于真,但是為什么在判斷一個(gè)空對象 == true 或者 === true 得到的結(jié)果都是 false 呢?
根據(jù)我們在雙等號(hào)那里的總結(jié)可知,雙等號(hào)有一方為布爾值時(shí),兩邊都會(huì)轉(zhuǎn)換為 Number 類型,所以控制臺(tái)測試空對象== true 或者 === true,實(shí)際上都是在執(zhí)行 空對象==1 或者 === 1,所以才會(huì)返回 false,因此,如果你想驗(yàn)證對象總等于真,應(yīng)該使用!{} 和 !!{} !{}; // false; !!{}; // true
E:由于 Boolean(0) == false,因此!0=true,正確。
說說 AB 選項(xiàng),由于使用 new 關(guān)鍵字,調(diào)用 function 構(gòu)造函數(shù),結(jié)果變得出乎我們的意料。
首先我們要知道,當(dāng)使用 new 調(diào)用一個(gè)構(gòu)造函數(shù)時(shí),如果內(nèi)部返回了一個(gè)引用對象(數(shù)組,對象,函數(shù)等)都將覆蓋 new 創(chuàng)建的匿名對象。
如果返回一個(gè)原始類型(無顯式 return 時(shí),其實(shí)是返回了一個(gè) undefined),那么就返回了 new 創(chuàng)建的匿名對象。
如此看來,
A 選項(xiàng)中,構(gòu)造函數(shù)內(nèi)返回的是一個(gè)字符串,那么最終構(gòu)造函數(shù)返回的是 new 創(chuàng)建的匿名對象,也就是一個(gè)空對象。
B 選項(xiàng)中,構(gòu)造函數(shù)內(nèi)部返回的是一個(gè)字符串對象,那么最終構(gòu)造函數(shù)返回的是這個(gè)對象。
總結(jié)
到此這篇關(guān)于JavaScript中類型的強(qiáng)制轉(zhuǎn)換與隱式轉(zhuǎn)換的文章就介紹到這了,更多相關(guān)JavaScript類型強(qiáng)制轉(zhuǎn)換與隱式轉(zhuǎn)換內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
Javascript 自適應(yīng)高度的Tab選項(xiàng)卡
選項(xiàng)卡的原理其實(shí)比較簡單,就是設(shè)置2種狀態(tài),選中和未選中的2中不同CSS狀態(tài),因此也有直接不用JS之用css就能實(shí)現(xiàn)的效果2011-04-04
vue?element?loading遮罩層添加按鈕功能實(shí)現(xiàn)
這篇文章主要介紹了vue?element?loading遮罩層添加按鈕功能實(shí)現(xiàn),通過實(shí)例代碼補(bǔ)充介紹了vue+elementui的this.$loading遮罩使用方法,需要的朋友可以參考下2024-03-03
Typescript實(shí)現(xiàn)隊(duì)列的示例代碼
隊(duì)列作為一種數(shù)據(jù)結(jié)構(gòu),在現(xiàn)實(shí)生活中它可應(yīng)用于電影院、自助餐廳等場合,本文主要介紹了Typescript實(shí)現(xiàn)隊(duì)列的示例代碼,具有一定的參考價(jià)值,感興趣的可以了解一下2024-08-08
js計(jì)算兩個(gè)日期間的天數(shù)月的實(shí)例代碼
本文通過實(shí)例代碼給大家介紹了基于js計(jì)算兩個(gè)日期間的天數(shù)月,文中還通過一段代碼給大家簡單說明了js計(jì)算兩個(gè)日期差的方法,感興趣的朋友跟隨小編一起看看吧2018-09-09
JavaScript Serializer序列化時(shí)間處理示例
JavaScriptSerializer序列化時(shí)間后會(huì)把時(shí)間序列化成N進(jìn)制的鬼數(shù)據(jù) ,下面有個(gè)示例,需要的朋友可以了解下2014-07-07
小程序開發(fā)實(shí)現(xiàn)access_token統(tǒng)一管理
本文主要介紹了小程序開發(fā)實(shí)現(xiàn)access_token統(tǒng)一管理,文中通過示例代碼介紹的非常詳細(xì),需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-07-07
JavaScript獲取系統(tǒng)自帶的顏色選擇器功能(圖)
JavaScript獲取系統(tǒng)自帶的顏色選擇器功能,這個(gè)是針對IE瀏覽器,所以大家如果想用兼容性更好的代碼,可以查看腳本之家的相關(guān)文章。2010-08-08

