譯者按: 語言的細枝末節了解一下就可以了,不需要太較真,不過如果一點也不知道的話,那就不太妙了。
為了保證可讀性,本文采用意譯而非直譯。另外,本文版權歸原作者所有,翻譯僅用於學習。
對於JavaScript,有3種不同方法可以將變量轉換為字符串。這篇博客將詳細介紹這些方法,並比較他們的優劣。
3種方法
將變量轉換為字符串的3種方法如下:
value.toString()
"" + value
String(value)
當value為null或者undefined時,第1種方法就不行了。而方法2和方法3基本上是一樣的。
-
""+value
: 將value與空字符串相加,即可將其轉換為字符串。這種方法其實是一種稍微晦澀的技巧,可能會讓別人難於理解開發者的意圖。不過,這一點見仁見智,有些人偏愛這種方法。 -
String(value)
: 這種方法非常清晰:使用String()函數將value轉換為字符串。不過,String()有兩種不同用法,容易混淆,尤其對於Java開發者來說。當String()和運算符new一起作為構造函數使用時,它返回一個新創建的String對象;當不用new運算符調用String()時,它只把value轉換成原始的字符串。這兩者是非常不同的:
>
String("Fundebug") === new String("Fundebug")
false
>
typeof String("Fundebug")
'string'
>
String("Fundebug") instanceof String
false
>
typeof new String("Fundebug")
'object'
>
new String("Fundebug") instanceof String
true
|
事實上,將String()作為構造函數使用並不常見,因此僅使用它來轉換字符串就好了。
“”+value與String(value)的細微差別
""+value
與String(value)
都可以將value轉換為字符串,它們是如何做到的呢?事實上,它們雖然結果相同,但是方法稍有區別。
將primitive基本類型轉換為字符串
兩種方法都使用內部函數ToString()將primitive基本類型轉換為字符串。ToString()函數在ECMAScript 5.1 (§9.8)中定義了,但是並不能直接使用,因此稱作內部函數。下面的表格顯示了ToString()函數如何將primitive基本類型轉換為字符串:
參數 | 結果 |
---|---|
undefined |
"undefined" |
null |
"null" |
Boolean | "true" 或者 "false" |
Number | 將數字轉換為字符串,例如: "1.765" |
String | 無需轉換 |
將Object轉換為字符串
轉換為字符串之前,兩種方法都會先將Object轉換為primitive。不同的是,""+value
使用內部函數ToPrimitive(Number)(除了date類型),而String(value)
使用內部函數ToPrimitive(String)。
- ToPrimitive(Number): 先調用obj.valueOf,若結果為primitive則返回;否則再調用obj.toString(),若結果為primitive則返回;否則返回TypeError。
- ToPrimitive(String): 與ToPrimitive(Number)類似,只是先調用obj.toString(),后調用obj.valueOf()。
可以通過以下示例了解區別,obj如下:
var obj = {
valueOf:
function()
{
console.log("valueOf");
return {};
},
toString:
function()
{
console.log("toString");
return {};
}
};
|
調用結果:
>
"" + obj
valueOf
toString
TypeError: Cannot convert object to primitive value
>
String(obj)
toString
valueOf
TypeError: Cannot convert object to primitive value
|
它們的結果相同
""+value
與String(value)
雖然不同,但是我們很少能感覺到。因為,大多數object使用默認的valueOf(),它返回對象本身:
>
var x = {}
> x.valueOf() === x
true
|
由於valueOf()返回值並非primitive,因此ToPrimitive(Number)會跳過valueOf(),而返回toString()的返回值。這樣,與ToPrimitive(String)的返回值就一樣了。
當object是Boolean、Number或者String實例時,valueOf()將返回primitive。這就意味着兩者的計算過程是這樣的:
- ToPrimitive(Number):
valueOf()
返回primitive值,然后使用ToString()轉換為字符串。 - ToPrimitive(String):
toString()
通過ToString()函數將primitive值轉換為字符串。
可知,雖然計算過程不同,但是它們的結果是一樣的。
結論
那么你該選擇哪種方法呢?如果你可以確保value值不是null和undefined,那么不妨使用value.toString()
。否則,你只能使用""+value
和String(value)
,它們基本上是一樣的。
參考
- JavaScript values: not everything is an object
- What is {} + {} in JavaScript?
- String concatenation in JavaScript
- JavaScript String 對象
關於Fundebug
Fundebug專注於JavaScript、微信小程序、微信小游戲、支付寶小程序、React Native、Node.js和Java實時BUG監控。 自從2016年雙十一正式上線,Fundebug累計處理了7億+錯誤事件,得到了Google、360、金山軟件、百姓網等眾多知名用戶的認可。歡迎免費試用!
版權聲明: 轉載時請注明作者Fundebug以及本文地址: https://blog.fundebug.com/2017/09/18/value-to-string/