您好,登錄后才能下訂單哦!
Javascript中的valueOf與toString有什么不同?針對(duì)這個(gè)問題,這篇文章詳細(xì)介紹了相對(duì)應(yīng)的分析和解答,希望可以幫助更多想解決這個(gè)問題的小伙伴找到更簡(jiǎn)單易行的方法。
+{ a: 1, toString: function() { return '10' }, valueOf: function() { return '100' } }
以上引申出對(duì)象數(shù)據(jù)的轉(zhuǎn)換的問題:
所有對(duì)象繼承了兩個(gè)轉(zhuǎn)換方法:
toString(): 它的作用是返回一個(gè)反映這個(gè)對(duì)象的字符串
valueOf():它的作用是返回它相應(yīng)的原始值
toString()
toString()函數(shù)的作用是返回object的字符串表示。
JavaScript中object默認(rèn)的toString()方法返回字符串”[object Object]“。定義類時(shí)可以實(shí)現(xiàn)新的toString()方法,從而返回更加具有可讀性的結(jié)果。
JavaScript對(duì)于數(shù)組對(duì)象、函數(shù)對(duì)象、正則表達(dá)式對(duì)象以及Date日期對(duì)象均定義了更加具有可讀性的toString()方法:
Array的toString()方法將返回以逗號(hào)分隔的數(shù)組成員。
var arr = [1, 2, 3] arr.toString() // "1,2,3"
Function的toString()方法將返回函數(shù)的文本定義。
var fun = function() { return 'fun' } fun.toString() // "function() { return 'fun' }"
RegExp的toString()方法與Function的toString()方法類似,將返回正則表達(dá)式的文本定義。
var reg = /d+/g reg.toString() // "/d+/g"
Date的toString()方法將返回一個(gè)具有可讀性的日期時(shí)間字符串。
var date = new Date() date.toString() // "Tue Feb 12 2019 14:04:36 GMT+0800 (中國(guó)標(biāo)準(zhǔn)時(shí)間)"
如果Boolean值是true,則返回 “true”。否則,返回 “false”。
var boolean = true boolean.toString() // "true"
valueOf()
valueOf()函數(shù)的作用是返回該object自身。
與toString()一樣,定義類時(shí)可以實(shí)現(xiàn)新的valueOf()方法,從而返回需要的結(jié)果。
JavaScript對(duì)于Date對(duì)象定義了更加具有可讀性的valueOf()方法:
Date的valueOf()方法將返回一個(gè)時(shí)間戳數(shù)值,該數(shù)值為Date對(duì)象與1970年1月1日零時(shí)的時(shí)間差(以毫秒為單位)。
var date = new Date() date.valueOf() // 1549951476233
其他一律返回對(duì)象本身。
var colors = ["red", "blue", "green"] // 創(chuàng)建一個(gè)包含3 個(gè)字符串的數(shù)組 alert(colors.toString()) // red,blue,green alert(colors.valueOf()) // red,blue,green alert(colors) // red,blue,green
三個(gè)輸出全部一樣,那么toString()和valueOf()區(qū)別到底是什么?看下一個(gè)我寫的例子:
var arr = [1,2,3] alert(Array.isArray(arr.valueOf())) // true alert(Array.isArray(arr.toString())) // false
結(jié)果是第一個(gè)是true而第二個(gè)是false,為什么呢,其實(shí)valueOf()調(diào)用完以后還是返回一個(gè)數(shù)組。這個(gè)數(shù)組被alert的時(shí)候會(huì)調(diào)用toString()函數(shù),所以不是valueOf()和toString()函數(shù)相同,而是間接的調(diào)用了toString()函數(shù)!
進(jìn)一步測(cè)試下:
var arr = [1,2,3] arr.toString = function () { alert("調(diào)用了toString函數(shù)"); } alert(arr.valueOf()) // "調(diào)用了toString函數(shù)"
結(jié)果就是我們會(huì)看到“調(diào)用了`toString函數(shù)”。
驗(yàn)證如下代碼:
var test = { value: 10, toString: function() { console.log('toString') return this.value }, valueOf: function() { console.log('valueOf') return this.value } } alert(test) // 10 toString alert(+test) // 10 valueOf alert('' + test) // 10 valueOf alert(String(test)) // 10 toString alert(Number(test)) // 10 valueOf alert(test == '10') // true valueOf alert(test === '10') // false
valueOf的意思是返回最適合該對(duì)象類型的原始值,而toString則是將在該對(duì)象類型的原始值以字符串形式返回。
示例1
alert(test) // 10 toString
這里我們的alert函數(shù)需要是的字符串,所以獲取的是字符串,而不是原始值,故而調(diào)用了toString
示例2
alert(+test) // 10 valueOf
同理,alert要的是字符串不是原始值,其實(shí)是(+test)的結(jié)果調(diào)用了toString,而+test被調(diào)用了valueOf
為了驗(yàn)證我們這樣寫:
var test = { value: 1, valueOf: function () { alert("調(diào)用了test的valueOf函數(shù)") return this.value }, toString: function () { alert("調(diào)用了test的toString函數(shù)") return this.value } }; var test2 = { value: +test, valueOf: function () { alert("調(diào)用了test2的valueOf函數(shù)") return this.value; }, toString: function () { alert("調(diào)用了test2的toString函數(shù)") return this.value } }; alert(test2) // 調(diào)用了test的valueOf函數(shù) // 調(diào)用了test2的toString函數(shù) // 1
其中讓test2 = +test,那么即可知道結(jié)果,果然如此,調(diào)用了test的valueOf和test2的toString
示例3
alert('' + test) // 10 valueOf
同理,我們可以把上一段寫的程序里面的test2: + test改成test2:'' + test
示例4
alert(String(test)) // 10 toString
String這個(gè)強(qiáng)制轉(zhuǎn)換其實(shí)在其內(nèi)部是調(diào)用了傳入?yún)?shù)的toString函數(shù)
alert(Number(test)) // 10 valueOf
alert(test == '10') // true valueOf
這個(gè)里面的判等的順序是,獲取原始值,然后判斷兩邊的原始值是否相等,所以調(diào)用valueOf
示例7
alert(test === '10') // false
===
操作符不進(jìn)行隱式轉(zhuǎn)換,判全等的第一個(gè)步驟是判斷類型,因?yàn)轭愋投疾灰粯恿?,所以后面什么都不?huì)調(diào)用
總結(jié)
valueOf偏向于運(yùn)算,toString偏向于顯示。
在進(jìn)行強(qiáng)轉(zhuǎn)字符串類型時(shí)將優(yōu)先調(diào)用toString方法,強(qiáng)轉(zhuǎn)為數(shù)字時(shí)優(yōu)先調(diào)用valueOf。
在有運(yùn)算操作符的情況下,valueOf的優(yōu)先級(jí)高于toString。
下面給大家簡(jiǎn)單說下valueof和tostring的區(qū)別:
valueOf():返回最適合該對(duì)象類型的原始值
toString(): 將該對(duì)象的原始值以字符串形式返回
這兩個(gè)方法一般是交由JS去隱式調(diào)用,以滿足不同的運(yùn)算情況。
在數(shù)值運(yùn)算里,會(huì)優(yōu)先調(diào)用valueOf(),如a + b
在字符串運(yùn)算里,會(huì)優(yōu)先調(diào)用toString(),如alert(c)
關(guān)于Javascript中的valueOf與toString有什么不同問題的解答就分享到這里了,希望以上內(nèi)容可以對(duì)大家有一定的幫助,如果你還有很多疑惑沒有解開,可以關(guān)注億速云行業(yè)資訊頻道了解更多相關(guān)知識(shí)。
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。