快捷導(dǎo)航

JavaScript中將一個(gè)值轉(zhuǎn)換為字符串的方法分析[譯]

更新時(shí)間：2012年09月21日 00:20:13 作者：

在JavaScript中,主要有三種方法能讓任意值轉(zhuǎn)換為字符串.本文講解了每種方法以及各自的優(yōu)缺點(diǎn)

譯者注:前兩天在看ES5的時(shí)候順便出了一道題,今天看到這篇文章,剛好解釋的很清楚,就翻譯了一下.
在JavaScript中,主要有三種方法能讓任意值轉(zhuǎn)換為字符串.本文講解了每種方法以及各自的優(yōu)缺點(diǎn).

1.轉(zhuǎn)換字符串的三種方法
這三種將value轉(zhuǎn)換為字符串的方法是:

1.value.toString()
2."" + value
3.String(value)

第一種方法存在的問題是,它不能把null和undefined轉(zhuǎn)換為字符串.還有第二種和第三種方法,這兩種方法的效果基本一樣.

•""+value: 使用加法運(yùn)算符配合一個(gè)空字符串可以把任意值轉(zhuǎn)換為字符串,我覺得這種方法代碼的可讀性很差,但相對(duì)String(value)來,還是有一些人更喜歡用這種轉(zhuǎn)換方式.
•String(value): 這種方法可讀性更好,唯一的問題是,這種函數(shù)調(diào)用可能會(huì)迷惑一些人,尤其是那些熟悉Java的的程序員,因?yàn)镾tring同時(shí)也是一個(gè)構(gòu)造函數(shù).要注意的是它作為普通函數(shù)和作為構(gòu)造函數(shù)時(shí)的表現(xiàn)完全不同:

復(fù)制代碼代碼如下:

 
> String("abc") === new String("abc") 
false 

> typeof String("abc") 
'string' 
> String("abc") instanceof String 
false 

> typeof new String("abc") 
'object' 
> new String("abc") instanceof String 
true 

String作為普通函數(shù)時(shí)會(huì)產(chǎn)生一個(gè)字符串(一個(gè)原始值).作為構(gòu)造函數(shù)時(shí)會(huì)產(chǎn)生一個(gè)String對(duì)象的實(shí)例.后者在JavaScript中很少用到,所以基本上你可以忽略掉String作為構(gòu)造函數(shù)的用法,但一定要記得它是個(gè)轉(zhuǎn)換函數(shù).

2.""+value 和 String(value)的細(xì)微差別
到現(xiàn)在你已經(jīng)知道了+ 和 String()都可以將它們的“參數(shù)”轉(zhuǎn)換為字符串.但他們的轉(zhuǎn)換方式還是著有細(xì)微的差別,不過幾乎所有的情況下,轉(zhuǎn)換結(jié)果都是一樣的.

2.1 將原始值轉(zhuǎn)換為字符串
這兩種方法都是使用引擎內(nèi)部的ToString()操作將原始值轉(zhuǎn)換為字符串的.“內(nèi)部操作”的意思是:這個(gè)操作函數(shù)是在ECMAScript 5.1 (§9.8)中定義的,但ES語言本身并不能訪問到它.下面這個(gè)表格解釋了ToString()是如何轉(zhuǎn)換原始值的.

參數(shù)	結(jié)果
`undefined`	`"undefined"`
`null`	`"null"`
布爾值	`"true"或者"false"`
數(shù)字	數(shù)字作為字符串,比如`"1.765"`
字符串	無需轉(zhuǎn)換

2.2 將對(duì)象值轉(zhuǎn)換為字符串

這兩種方法都先將對(duì)象值轉(zhuǎn)換為原始值,然后再將原始值轉(zhuǎn)換為字符串.但是在這個(gè)轉(zhuǎn)換中, + 使用的是內(nèi)部的ToPrimitive(Number)操作(除非被轉(zhuǎn)換的是date對(duì)象),而String()用的是ToPrimitive(String).

•ToPrimitive(Number): 將一個(gè)對(duì)象值轉(zhuǎn)換為原始值,首先調(diào)用obj.valueOf().如果返回值是一個(gè)原始值,則返回這個(gè)原始值.如果不是,則再調(diào)用obj.toString().如果返回值是個(gè)原始值,返回這個(gè)原始值.否則,拋出TypeError異常.
•ToPrimitive(String): 和上面的方法類似,只是優(yōu)先調(diào)用obj.toString()方法而不是obj.valueOf().
通過轉(zhuǎn)換下面的這個(gè)對(duì)象,你可以看到它們之間的差別:

復(fù)制代碼代碼如下:

 
var obj = { 
valueOf: function () { 
console.log("valueOf"); 
return {}; // 不是原始值,繼續(xù)執(zhí)行 
}, 
toString: function () { 
console.log("toString"); 
return {}; // 不是原始值,繼續(xù)執(zhí)行 
} 
}; 

//運(yùn)行: 
> "" + obj 
valueOf 
toString 
TypeError: Cannot convert object to primitive value 

> String(obj) 
toString 
valueOf 
TypeError: Cannot convert object to primitive value 

2.3 結(jié)果通常都相同
上面講的區(qū)別,在實(shí)際情況中幾乎不太可能遇到.因?yàn)?大部分對(duì)象都使用了默認(rèn)的繼承而來的valueOf()方法,返回值總是這個(gè)對(duì)象本身.

復(fù)制代碼代碼如下:

 
> var x = {} 
> x.valueOf() === x 
true 

因此, ToPrimitive(Number)通常會(huì)跳過valueOf方法返回toString()方法的返回值,這就表現(xiàn)的和ToPrimitive(String)完全一樣.但是,如果這個(gè)對(duì)象是Boolean,Number或者String的對(duì)象實(shí)例,那么它的valueOf()會(huì)返回一個(gè)原始值(被這個(gè)對(duì)象包裝前的原始值).那么這兩種操作就會(huì)按照如下步驟執(zhí)行:

•ToPrimitive(Number)返回了對(duì)象的valueOf()方法的返回值(被包裝前的原始值)再經(jīng)過ToString()操作后的結(jié)果.
•ToPrimitive(String)返回了對(duì)象的toString()方法的返回值(在該對(duì)象被包裝前的原始值上進(jìn)行ToString()操作的返回值).
就這樣,他們還是返回了相同的結(jié)果,只是轉(zhuǎn)換的途徑不同.

3.結(jié)論

你應(yīng)該選擇哪種方式來將其他類型的值轉(zhuǎn)換為字符串呢?如果你能確保這個(gè)值永遠(yuǎn)不會(huì)是null或者undefined,則可以用value.toString()來轉(zhuǎn)換.否則,""+value和String(value)選哪個(gè)都可以,看個(gè)人喜好,我認(rèn)為String(value) 更明確一點(diǎn).

4.相關(guān)文章