JavaScript數(shù)據(jù)類型轉(zhuǎn)換簡單方法舉例
一、類型轉(zhuǎn)換簡介
所謂的類型轉(zhuǎn)換,就是將一種數(shù)據(jù)類型轉(zhuǎn)換為另外一種數(shù)據(jù)類型,例如上一節(jié)課說到的,如果一個數(shù)字與一個字符串相加,JavaScript會自動將數(shù)字轉(zhuǎn)換為字符串,然后再與另外一個字符串相加(隱式類型轉(zhuǎn)換)。
我們都知道,JavaScript是一種弱類型的語言,這一點(diǎn)區(qū)別于傳統(tǒng)編程語言(如C和Java)。雖然在運(yùn)算時,JavaScript會自動進(jìn)行類型轉(zhuǎn)換,但是為了避免自動轉(zhuǎn)換或不轉(zhuǎn)換產(chǎn)生的不良后果,有時候我們需要進(jìn)行顯式的類型轉(zhuǎn)換。
隱式類型轉(zhuǎn)換指的是JavaScript自動進(jìn)行的類型轉(zhuǎn)換,顯式類型轉(zhuǎn)換指的是我們手動用代碼強(qiáng)制進(jìn)行的類型轉(zhuǎn)換。
1、字符串型轉(zhuǎn)換為數(shù)值型
在JavaScript中,將字符串型數(shù)據(jù)轉(zhuǎn)換為數(shù)值型數(shù)據(jù)有parseInt()和parseFloat()這2種方法。其中,parseInt()可以將字符串轉(zhuǎn)換為整型數(shù)據(jù);parseFloat()可以將字符串轉(zhuǎn)換為浮點(diǎn)型數(shù)據(jù)。
語法:
parseInt() //將字符串型轉(zhuǎn)換為整型 parseFloat() //將字符串型轉(zhuǎn)換為浮點(diǎn)型
說明:將字符串型轉(zhuǎn)換為整型,前提是字符串一定要是數(shù)值字符串。那什么叫數(shù)值字符串呢?“123”、“3.1415”這些只有數(shù)字的字符串就是數(shù)值字符串,而“hao123”、“360cn”等就不是數(shù)值字符串。
舉例:
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script type="text/javascript"> var m=parseInt("3.14")+10; var n=parseFloat("3.14")+10; document.write(m+"<br/>"); document.write(n); </script> </head> <body> </body> </html>
在瀏覽器預(yù)覽效果如下:
分析:parseInt("3.14")的結(jié)果是3,而parseFloat("3.14")的結(jié)果是3.14。大家好好理解一下。
2、數(shù)值型轉(zhuǎn)換為字符串型
在JavaScript中,將數(shù)值型數(shù)據(jù)(整型或浮點(diǎn)型)轉(zhuǎn)換為字符串,都是使用toString()方法。
語法:
.toString()
舉例:
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script type="text/javascript"> var n=3.1415; var str=n.toString()+926; var num=n+926; document.write(str+"<br/>"); document.write(num); </script> </head> <body> </body> </html>
在瀏覽器預(yù)覽效果如下:
分析:這個例子雖然簡單,不過涉及知識也不少。大家好好琢磨一下,也是非常值得思考的一個例子。
記住,算術(shù)運(yùn)算符的兩邊必須都是數(shù)值,若在“+”運(yùn)算中存在字符或字符串,則該表達(dá)式將是字符串表達(dá)式。因?yàn)镴avaScript會自動將數(shù)值型數(shù)據(jù)轉(zhuǎn)換成字符串型數(shù)據(jù)。
類型轉(zhuǎn)換雖然內(nèi)容比較少,但是在實(shí)際開發(fā)中,我們會經(jīng)常要用到的。
二、JavaScript中數(shù)據(jù)類型轉(zhuǎn)換函數(shù)總結(jié)
在JavaScript中,可以使用一些內(nèi)置函數(shù)將一個數(shù)據(jù)類型轉(zhuǎn)換為另一個數(shù)據(jù)類型。這些內(nèi)置函數(shù)包括toString()、parseInt()、parseFloat()和Number()。
toString()
toString()方法可以將數(shù)字、字符串和布爾值轉(zhuǎn)換為字符串類型。例如:
var num = 123; var str = num.toString(); //將數(shù)字轉(zhuǎn)換為字符串 console.log(typeof str); //輸出: string var bool = true; var str = bool.toString(); //將布爾值轉(zhuǎn)換為字符串 console.log(typeof str); //輸出: string
parseInt()和parseFloat()
parseInt()和parseFloat()方法可以將字符串轉(zhuǎn)換為數(shù)字類型。parseInt()方法將字符串轉(zhuǎn)換為整數(shù)類型,而parseFloat()方法將字符串轉(zhuǎn)換為浮點(diǎn)數(shù)類型。例如:
var str = "123"; var num = parseInt(str); //將字符串轉(zhuǎn)換為整數(shù) console.log(typeof num); //輸出: number var str = "3.14"; var num = parseFloat(str); //將字符串轉(zhuǎn)換為浮點(diǎn)數(shù) console.log(typeof num); //輸出: number
注意:如果不能成功將字符串轉(zhuǎn)換為數(shù)字類型,則會返回NaN(非數(shù)值)。例如:
var str = "abc"; var num = parseInt(str); //將字符串轉(zhuǎn)換為整數(shù),但是失敗 console.log(num); //輸出: NaN
Number()
Number()方法可以將任何數(shù)據(jù)類型都轉(zhuǎn)換為數(shù)字類型。例如:
var str = "123"; var num = Number(str); //將字符串轉(zhuǎn)換為數(shù)字 console.log(typeof num); //輸出: number var bool = true; var num = Number(bool); //將布爾值轉(zhuǎn)換為數(shù)字 console.log(typeof num); //輸出: number var obj = {a: 1}; var num = Number(obj); //將對象轉(zhuǎn)換為數(shù)字,但是失敗 console.log(num); //輸出: NaN
需要注意的是,在將字符串轉(zhuǎn)換為數(shù)字時,Number()方法會嘗試將字符串轉(zhuǎn)換為整數(shù)或浮點(diǎn)數(shù)。如果轉(zhuǎn)換失敗,則返回NaN。
在進(jìn)行數(shù)據(jù)類型轉(zhuǎn)換時,需要注意可能會導(dǎo)致意料之外的結(jié)果。例如,將字符串轉(zhuǎn)換為數(shù)字時,如果字符串中包含非數(shù)字字符,則會返回NaN。因此,在進(jìn)行類型轉(zhuǎn)換之前,應(yīng)該先進(jìn)行數(shù)據(jù)類型的檢查以避免錯誤。
總結(jié)
到此這篇關(guān)于JavaScript數(shù)據(jù)類型轉(zhuǎn)換的文章就介紹到這了,更多相關(guān)JS數(shù)據(jù)類型轉(zhuǎn)換內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
- js 數(shù)據(jù)類型轉(zhuǎn)換總結(jié)筆記
- JavaScript中的數(shù)據(jù)類型轉(zhuǎn)換方法小結(jié)
- JavaScript實(shí)現(xiàn)數(shù)據(jù)類型的相互轉(zhuǎn)換
- 詳解Javascript數(shù)據(jù)類型的轉(zhuǎn)換規(guī)則
- JavaScript中數(shù)據(jù)類型轉(zhuǎn)換總結(jié)
- javascript基本數(shù)據(jù)類型和轉(zhuǎn)換
- JavaScript的數(shù)據(jù)類型轉(zhuǎn)換原則(干貨)
- JavaScript數(shù)據(jù)類型轉(zhuǎn)換詳解(推薦)
相關(guān)文章
JavaScript實(shí)現(xiàn)移動端滑動選擇日期功能
這篇文章主要介紹了JavaScript實(shí)現(xiàn)滑動選擇日期功能,基于sui-mobile的移動端實(shí)現(xiàn),感興趣的小伙伴們可以參考一下2016-06-06Swiper 4.x 使用方法(移動端網(wǎng)站的內(nèi)容觸摸滑動)
Swiper是純javascript打造的滑動特效插件,面向手機(jī)、平板電腦等移動終端,這里為大家簡單介紹一下Swiper4的用法,需要的朋友可以參考下2018-05-05JavaScript增加數(shù)組中指定元素的5種方法總結(jié)
在JS中數(shù)組方法是非常重要且常用的的方法,在此整理總結(jié)一番,下面這篇文章主要給大家介紹了關(guān)于JavaScript增加數(shù)組中指定元素的5種方法,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下2024-02-02UEditor 自定義圖片視頻尺寸校驗(yàn)功能的實(shí)現(xiàn)代碼
UEditor支持單圖、多圖以及視頻上傳,編輯器配置項(xiàng)支持文件格式、文件大小校驗(yàn),對于文件寬高尺寸校驗(yàn)暫不支持。本文給大家介紹UEditor 自定義圖片視頻尺寸校驗(yàn)功能的實(shí)現(xiàn)代碼,感興趣的朋友一起看看吧2020-10-10JavaScript 嵌套函數(shù)指向this對象錯誤的解決方法
JavaScript對于全局函數(shù)內(nèi)的this綁定為全局對象,而對于嵌套函數(shù)也采用了相同的解釋。2010-03-03JS實(shí)現(xiàn)定時頁面彈出類似QQ新聞的提示框
類似QQ新聞的提示框要求頁面每隔半小時彈出一次提示消息,下面有個不錯的實(shí)現(xiàn)方法,感興趣的朋友可以參考下2013-11-11