深入理解JavaScript強(qiáng)制類型轉(zhuǎn)換
一、強(qiáng)制類型轉(zhuǎn)換
強(qiáng)制類型轉(zhuǎn)換是指將一種數(shù)據(jù)類型轉(zhuǎn)換為另一種數(shù)據(jù)類型的過(guò)程。在JavaScript中,這種轉(zhuǎn)換可以是顯式(調(diào)用轉(zhuǎn)換函數(shù))的或隱式的
基本類型轉(zhuǎn)換
主要涉及三種基本類型:字符串、數(shù)字和布爾值
轉(zhuǎn)換為字符串
將值轉(zhuǎn)換為字符串有多種方式,其中最常見(jiàn)的是通過(guò)調(diào)用String()函數(shù)或使用加號(hào)運(yùn)算符(+)與空字符串相加 或者ES6的模板字符串 ‘ `` ’ 。
let num = 123; let str = String(num); // 顯式轉(zhuǎn)換 let str2 = num + ''; // 隱式轉(zhuǎn)換 console.log(str); // "123" console.log(str2); // "123"
轉(zhuǎn)換為數(shù)字
將值轉(zhuǎn)換為數(shù)字也有多種方式,可以使用Number()函數(shù)、加號(hào)運(yùn)算符(+)、乘號(hào)運(yùn)算符 *、parseInt()或parseFloat()等
let str = "456"; let num = Number(str); // 顯式轉(zhuǎn)換 let num2 = +str; // 隱式轉(zhuǎn)換 console.log(num); // 456 console.log(num2); // 456
parseInt()和parseFloat()用于解析字符串中的數(shù)字,但它們與Number()有所不同,因?yàn)樗鼈?code>不會(huì)處理非數(shù)值字符并且可以解析帶有小數(shù)點(diǎn)的字符串。
let str = "3.14"; console.log(parseInt(str)); // 3 console.log(parseFloat(str)); // 3.14
轉(zhuǎn)換為布爾值
所有值在JavaScript中都可以轉(zhuǎn)換為布爾值。JavaScript中有一些被認(rèn)為是假值的值,它們轉(zhuǎn)換為布爾值時(shí)會(huì)得到false,包括:0、-0、null、undefined、NaN和空字符串("")。其他所有值都被認(rèn)為是真值,轉(zhuǎn)換為布爾值時(shí)會(huì)得到true。
console.log(Boolean(0)); // false
console.log(Boolean("")); // false
console.log(Boolean(null)); // false
console.log(Boolean(undefined));// false
console.log(Boolean(NaN)); // false
console.log(Boolean(123)); // true
console.log(Boolean("hello")); // true
console.log(Boolean({})); // true
二、常見(jiàn)的強(qiáng)制類型轉(zhuǎn)換場(chǎng)景
相等運(yùn)算符 == 與嚴(yán)格相等運(yùn)算符 ===
在使用相等運(yùn)算符== 時(shí),JavaScript會(huì)進(jìn)行強(qiáng)制類型轉(zhuǎn)換以比較不同類型的值。相反,嚴(yán)格相等運(yùn)算符===不會(huì)進(jìn)行類型轉(zhuǎn)換,只在兩個(gè)值類型相同且值相等時(shí)返回true。
console.log(123 == "123"); // true,字符串"123"被轉(zhuǎn)換為數(shù)字123 console.log(123 === "123"); // false,類型不同
算術(shù)運(yùn)算符
當(dāng)不同類型的值參與算術(shù)運(yùn)算時(shí),JavaScript會(huì)嘗試將它們轉(zhuǎn)換為數(shù)字
let result = "4" - 3; // "4" 被轉(zhuǎn)換為 4,結(jié)果為 1 console.log(result); // 1 result = "5" + 5; // 由于 + 運(yùn)算符優(yōu)先進(jìn)行字符串連接,結(jié)果為 "55" console.log(result); // "55"
邏輯運(yùn)算符
邏輯運(yùn)算符(&&、||、!)也會(huì)觸發(fā)類型轉(zhuǎn)換。它們通常會(huì)將操作數(shù)轉(zhuǎn)換為布爾值,以決定運(yùn)算結(jié)果
console.log(!!"hello"); // true,非空字符串被轉(zhuǎn)換為 true console.log(!!0); // false,0 被轉(zhuǎn)換為 false console.log(null || "default"); // "default",null 被轉(zhuǎn)換為 false
三、避免強(qiáng)制類型轉(zhuǎn)換的陷阱
NaN陷阱
當(dāng)嘗試將非數(shù)值字符串轉(zhuǎn)換為數(shù)字時(shí),會(huì)得到NaN(Not-a-Number)
let result = Number("hello");
console.log(result); // NaN
null和undefined的特殊情況
null和undefined在進(jìn)行類型轉(zhuǎn)換時(shí)有一些特殊的行為,需要特別注意。
console.log(Number(null)); // 0 console.log(Number(undefined)); // NaN
字符串連接與算術(shù)運(yùn)算
由于+運(yùn)算符既用于字符串連接又用于加法運(yùn)算,容易引起混淆。
console.log("5" + 3); // "53",字符串連接
console.log("5" - 3); // 2,算術(shù)運(yùn)算
到此這篇關(guān)于深入理解JavaScript強(qiáng)制類型轉(zhuǎn)換的文章就介紹到這了,更多相關(guān)JavaScript強(qiáng)制類型轉(zhuǎn)換內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
- 詳解JavaScript中的強(qiáng)制類型轉(zhuǎn)換和自動(dòng)類型轉(zhuǎn)換
- JS中強(qiáng)制類型轉(zhuǎn)換的實(shí)現(xiàn)
- 重學(xué)JS之顯示強(qiáng)制類型轉(zhuǎn)換詳解
- JavaScript強(qiáng)制類型轉(zhuǎn)換和隱式類型轉(zhuǎn)換操作示例
- 詳解JavaScript中的強(qiáng)制類型轉(zhuǎn)換
- JS在if中的強(qiáng)制類型轉(zhuǎn)換方式
- Javascript Boolean、Nnumber、String 強(qiáng)制類型轉(zhuǎn)換的區(qū)別詳細(xì)介紹
- Javascript 強(qiáng)制類型轉(zhuǎn)換函數(shù)
相關(guān)文章
Add a Formatted Table to a Word Document
Add a Formatted Table to a Word Document...2007-06-06
JS 動(dòng)態(tài)獲取節(jié)點(diǎn)代碼innerHTML分析 [IE,FF]
在IE 環(huán)境下 賦值類型為對(duì)象時(shí) innerHTML 獲取不到其改變,在FireFox環(huán)境下 .屬性 方式獲取不到其改變。2009-11-11
php main 與 iframe 相互通訊類(js+php同域/跨域)
這篇文章主要介紹了php main 與 iframe 相互通訊類(js+php同域/跨域),需要的朋友可以參考下2017-09-09
Javascript怎樣使用SessionStorage和LocalStorage
這篇文章主要介紹了Javascript怎樣使用SessionStorage和LocalStorage,對(duì)web存儲(chǔ)數(shù)據(jù)感興趣的同學(xué),可以參考下2021-04-04
怎樣使用?JavaScript?轉(zhuǎn)義字符串中的引號(hào)
要轉(zhuǎn)義字符串中的單引號(hào)或雙引號(hào),需要在字符串內(nèi)容中的每個(gè)單引號(hào)或雙引號(hào)之前使用反斜杠?\?字符,例如?‘that’s?it’,這篇文章主要介紹了如何使用?JavaScript?轉(zhuǎn)義字符串中的引號(hào),需要的朋友可以參考下2023-11-11
微信小程序開(kāi)發(fā)(二):頁(yè)面跳轉(zhuǎn)并傳參操作示例
這篇文章主要介紹了微信小程序開(kāi)發(fā)頁(yè)面跳轉(zhuǎn)并傳參操作,結(jié)合實(shí)例形式詳細(xì)分析了微信小程序頁(yè)面跳轉(zhuǎn)并傳參相關(guān)操作技巧,需要的朋友可以參考下2020-06-06
使用Mock.js生成前端測(cè)試數(shù)據(jù)
這篇文章主要介紹了使用Mock.js生成前端測(cè)試數(shù)據(jù),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-12-12

