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

