重學(xué)JS之顯示強(qiáng)制類型轉(zhuǎn)換詳解
ToString
ToString負(fù)責(zé)處理非字符串到字符串的強(qiáng)制類型轉(zhuǎn)換,常用的字符串化方法String()、toString()。
基本類型值的字符串化規(guī)則:
- null轉(zhuǎn)換為'null'
- undefined轉(zhuǎn)換為'undefined'
- true轉(zhuǎn)化為'true'
- 數(shù)字的字符串化遵循通用規(guī)則,極大值或者極小值采用科學(xué)計(jì)數(shù)法表示
普通對象在字符串化時(shí),實(shí)際執(zhí)行Object.prototype.toString(),返回該對象的類型[object type],例如:
var test = {a : 'test'} console.log(test.toString()) // '[object Object]' console.log(String(test)) // '[object Object]'
但是當(dāng)對象有自己的toString方法時(shí),字符串化時(shí)就會(huì)調(diào)用該方法并返回該方法的返回值,例如:
var obj = { a: 'test', toString: function () { return 1 } } console.log(obj.toString()) // 1 console.log(String(obj)) // 1
數(shù)組在做字符串化時(shí),將數(shù)組所有元素字符串化再用","連接,例如:
var arr = [1, 2] console.log(arr.toString()) // '1,2' console.log(String(arr)) // '1,2'
JSON.stringify()
JSON.stringify()在將JSON對象序列化為字符串時(shí),也涉及到了字符串化的相關(guān)規(guī)則。
對大多數(shù)簡單值來說,JSON字符串化和toString()的效果基本相同,例如:
console.log(JSON.stringify("test")) // ""test"" console.log(JSON.stringify(1)) // "1" console.log(JSON.stringify(null)) // "null"
但是JSON.stringify()在對象中遇到function() {}、undefined、Symbol時(shí)會(huì)自動(dòng)將其忽略,在數(shù)組中則會(huì)返回null,例如:
var obj1 = { a: undefined, b: function () {}, c: Symbol() } console.log(JSON.stringify(obj1)) // "{}" console.log(JSON.stringify([undefined, function () {}, 1])) // "[null, mull, 1]"
當(dāng)對象執(zhí)行JSON.stringify()方法時(shí),如果對象中存在toJSON方法,用它的返回值來進(jìn)行序列化,例如:
var obj2 = { a: undefined, b: function () {}, c: Symbol(), toJSON: function () { return {a: 'replace'} } } console.log(JSON.stringify(obj2)) // "{"a":"replace"}"
ToNumber
ToNumber負(fù)責(zé)將非數(shù)字轉(zhuǎn)化為數(shù)字,Number()、parseInt()和parseFloat()都可以將非數(shù)字轉(zhuǎn)化為數(shù)字
Number()
Number()函數(shù)的轉(zhuǎn)換規(guī)則:
- 如果是Boolean類型,true和false分別轉(zhuǎn)換為0和1
- 如果是數(shù)字值,只是簡單的傳入和返回
- 如果是null值,返回0
- 如果是undefined,返回NaN
- 如果是字符串,遵循下列規(guī)則:
- 如果字符串中只包含數(shù)字,則將其轉(zhuǎn)變?yōu)槭M(jìn)制數(shù)
- 如果字符串中包含有效的浮點(diǎn)格式 ,則將其轉(zhuǎn)換為對應(yīng)的浮點(diǎn)數(shù)值
- 如果字符串中包含有效的十六進(jìn)制格式,則將其轉(zhuǎn)換為相同大小的十進(jìn)制數(shù)
- 如果字符串是空,則將其轉(zhuǎn)換為0
- 如果字符串中包含除上述格式之外的字符串,則將其轉(zhuǎn)換為NaN
- 如果是對象,則調(diào)用對象的valueOf()方法,然后依照前面的規(guī)則轉(zhuǎn)換值。如果轉(zhuǎn)換的結(jié)果是NaN,則調(diào)用對象的toString()方法,然后再依次照前面的規(guī)則轉(zhuǎn)換返回的字符串值
例如:
console.log(Number(true)) // 1 console.log(Number(1)) // 1 console.log(Number(null)) // 0 console.log(Number(undefined)) // NaN console.log(Number('11')) // 11 console.log(Number('1.1')) // 1.1 console.log(Number('0xf')) // 15 console.log(Number('')) // 0 var a = { valueOf: function () { return '10' } } var b = { toString: function () { return '10' } } var c = [1, 0] c.toString = function () { return c.join("") } console.log(Number(a)) // 10 console.log(Number(b)) // 10 console.log(Number(c)) // 10
parseInt()
parseInt()轉(zhuǎn)換規(guī)則:
- parseInt()函數(shù)在轉(zhuǎn)換字符串時(shí),會(huì)忽略字符串前面的空格,直到找到第一個(gè)非空格字符
- 如果第一個(gè)字符不是數(shù)字字符或者負(fù)號(hào),parseInt()就會(huì)返回NaN
- 如果第一個(gè)字符是數(shù)字字符,parseInt()就會(huì)繼續(xù)解析,直到解析完所有后續(xù)字符或者遇到一個(gè)非數(shù)字字符
- 如果字符串中的第一個(gè)字符是數(shù)字字符,parseInt()也能識(shí)別各種進(jìn)制數(shù)
例子:
console.log(parseInt('a')) // NaN console.log(parseInt('11')) // 11 console.log(parseInt('11aa')) // 11 console.log(parseInt('0xf')) // 15
parseFloat()
parseFloat()轉(zhuǎn)換規(guī)則:
- 與parseInt()函數(shù)類似,parseFloat()也是從第一個(gè)字符開始解析每一個(gè)字符,而且也是一直解析到字符串末尾,或者解析到遇見一個(gè)無效的浮點(diǎn)數(shù)字字符為止
- 解析時(shí)會(huì)忽略前導(dǎo)的0
- 只會(huì)解析十進(jìn)制數(shù)
例子:
console.log(parseFloat('12.3a')) // 12.3 console.log(parseFloat('0xf')) // 0 console.log(parseFloat('01.1')) // 1.1
ToBoolean
布爾強(qiáng)制類型轉(zhuǎn)換的假值列表:
- undefined
- null
- false
- +0、-0和NaN
- ""
除了上述列表以外的值在轉(zhuǎn)換的時(shí)候都應(yīng)該是真值,強(qiáng)制布爾類型轉(zhuǎn)換常用Boolean()或者!!,第一個(gè)!將值強(qiáng)制轉(zhuǎn)為布爾類型,但同時(shí)還將真假值反轉(zhuǎn),第二個(gè)!將結(jié)果返回原值,例子:
console.log(Boolean("0")) // true console.log(Boolean([])) // true console.log(Boolean(undefined)) // false console.log(!!"0") // true console.log(!![]) // true console.log(!!undefined) // false
總結(jié)
這篇文章對JS中的常見顯示強(qiáng)制類型轉(zhuǎn)換做了一個(gè)小結(jié),希望能對大家理解有所幫助。
好了,以上就是這篇文章的全部內(nèi)容了,希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,謝謝大家對腳本之家的支持。
- 詳解JavaScript中的強(qiáng)制類型轉(zhuǎn)換和自動(dòng)類型轉(zhuǎn)換
- JS中強(qiáng)制類型轉(zhuǎn)換的實(shí)現(xià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ù)
- 深入理解JavaScript強(qiáng)制類型轉(zhuǎn)換
相關(guān)文章
使用JavaScript實(shí)現(xiàn)按鈕的漣漪效果實(shí)例代碼
近來看到個(gè)不錯(cuò)的按鈕點(diǎn)擊效果,當(dāng)點(diǎn)擊時(shí)產(chǎn)生一次水波漣漪效果,挺好玩的,下面這篇文章主要給大家介紹了關(guān)于使用JavaScript實(shí)現(xiàn)按鈕漣漪效果的相關(guān)資料,需要的朋友可以參考下2022-11-11表單元素值獲取方式j(luò)s及java方式的簡單實(shí)例
下面小編就為大家?guī)硪黄韱卧刂但@取方式j(luò)s及java方式的簡單實(shí)例。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-10-10js知識(shí)點(diǎn)總結(jié)之getComputedStyle的用法
getComputedStyle是一個(gè)可以獲取當(dāng)前元素所有最終使用的CSS屬性值,下面這篇文章主要給大家介紹了關(guān)于js知識(shí)點(diǎn)總結(jié)之getComputedStyle用法的相關(guān)資料,需要的朋友可以參考下2022-10-10JS中國標(biāo)準(zhǔn)時(shí)間轉(zhuǎn)化為年月日時(shí)分秒'yyyy-MM-dd hh:mm:ss'的示例詳解
這篇文章主要介紹了JS中國標(biāo)準(zhǔn)時(shí)間轉(zhuǎn)化為年月日時(shí)分秒‘yyyy-MM-dd hh:mm:ss‘的相關(guān)知識(shí),通過示例代碼介紹了,Js各種時(shí)間轉(zhuǎn)換問題(YYYY-MM-DD 時(shí)間戳 中國標(biāo)準(zhǔn)時(shí)間),需要的朋友可以參考下2024-02-02JavaScript中對象property的讀取和寫入方法介紹
這篇文章主要介紹了JavaScript中對象property的讀取和寫入方法介紹,本文講解了原型繼承鏈中property的讀取、原型繼承鏈中property的寫入等內(nèi)容,需要的朋友可以參考下2014-12-12TopList標(biāo)簽和JavaScript結(jié)合兩例
TopList標(biāo)簽和JavaScript結(jié)合兩例...2007-08-08