詳解JavaScript對象轉(zhuǎn)原始值
Object.prototype.valueOf()
對象的valueOf旨在返回對象的原始值,會在需要將對象轉(zhuǎn)換成原始值的地方自動執(zhí)行。詳細點這里。
Object.prototype.toString()
toString()方法會返回表示該對象的字符串,會在對象預(yù)期要被轉(zhuǎn)換成字符串的地方自動執(zhí)行。對象默認的toString()方法會返回[object type],這個type就是對象構(gòu)造函數(shù)的名稱。詳細點這里。
Symbol.toPrimitive
Symbol.toPrimitive(hint)
方法作用同valueOf()一樣,但是優(yōu)先級要高于valueOf();而且該方法還會接受一個參數(shù)hint,這個參數(shù)用來表示期望轉(zhuǎn)換的原始值的具體類型,有以下幾種:
- number:數(shù)字類型
- string:字符串類型
- default:默認
let obj = { [Symbol.toPrimitive](hint) { switch (hint) { case 'number': return 123; case 'string': return 'str'; case 'default': return 'default'; default: throw new Error(); } } }; 2 * obj // 246 3 + obj // '3default' obj == 'default' // true String(obj) // 'str'
對象轉(zhuǎn)換原始值
以上三種方法都是在對象被預(yù)期轉(zhuǎn)換成某種原始值時觸發(fā)。
1. 預(yù)期被轉(zhuǎn)換成字符串類型
對應(yīng)的hint類型為string
進行輸出的地方,如alert()
String(obj)
let a = { toString () { return '2' } } console.log(String(a)) // 2
字符串連接(+)操作
let a = { toString () { return '2' } } console.log(a + 'vv')
模板字符串
let a = { [Symbol.toPrimitive] (hint) { console.log(hint) // string return 2 } } console.log(`你是老${a}?`) // 你是老2?
2. 預(yù)期被轉(zhuǎn)換成數(shù)字類型
對應(yīng)的hint類型為numbe
除法:
let a = { valueOf () { return 2 } } console.log(2 / a, a / 2) // 1 1
Number(obj):
let a = { [Symbol.toPrimitive] (hint) { console.log(hint) // number return 2 } } console.log(Number(a)) // 2
正負號(注意不是加減運算):
let a = { [Symbol.toPrimitive] (hint) { console.log(hint) // number return 2 } } console.log(+a) // 2 console.log(-a) // -2
3. 預(yù)期被轉(zhuǎn)換成默認類型(其他)
對應(yīng)的hint類型為default
數(shù)字加法(即與對象相加的一方為數(shù)字類型):
let a = { [Symbol.toPrimitive] (hint) { console.log(hint) // default return 2 } } console.log(1 + a) // 3
這一點有點意外,原以為像這種情況預(yù)期轉(zhuǎn)換的類型應(yīng)該是數(shù)字類型,但事實上卻是default;
布爾運算:所有對象都被轉(zhuǎn)換成true;
let a = { [Symbol.toPrimitive] (hint) { console.log(hint) // 沒有觸發(fā) return false } } console.log(Boolean(a), a && 123) // true 123
布爾運算包括==
三種方法觸發(fā)的順序
首先判斷對象是否有Symbol.toPrimitive(hint)方法,若有則執(zhí)行該方法,沒有則執(zhí)行下面的步驟;
如果預(yù)期被轉(zhuǎn)換成字符串類型時,則優(yōu)先執(zhí)行toString()方法;
如果預(yù)期被轉(zhuǎn)換成默認類型或者數(shù)字類型時,則優(yōu)先執(zhí)行valueOf()方法:
注:若沒有valueOf()方法,但是定義了toString()方法,則會執(zhí)行toString()方法;
總結(jié)
本篇文章就到這里了,希望能夠給你帶來幫助,也希望您能夠多多關(guān)注腳本之家的更多內(nèi)容!
相關(guān)文章
JavaScript位置與大?。?)之正確理解和運用與尺寸大小相關(guān)的DOM屬性
這篇文章主要介紹了JavaScript位置與大小(1)——正確理解和運用與尺寸大小相關(guān)的DOM屬性的相關(guān)資料,需要的朋友可以參考下2015-12-12document.body.scrollTop 值總為0的解決方法 比較常見的標準問題
頁面具有 DTD(或者說指定了 DOCTYPE)時,使用 document.documentElement。2009-11-11移動端網(wǎng)頁開發(fā)調(diào)試神器Eruda的介紹與使用技巧
在日常的移動端開發(fā)時,一般都是試用chrome瀏覽器的移動端模式進行開發(fā)和調(diào)試,只有在chrome調(diào)試完成,而最近發(fā)現(xiàn)了一個新的調(diào)試方法,所以這篇文章主要給大家介紹了關(guān)于移動端網(wǎng)頁開發(fā)調(diào)試神器Eruda的基本資料,以及其使用的一些技巧,需要的朋友可以參考下。2017-10-10