前言

在JavaScript中，將數(shù)字轉(zhuǎn)換為字符串是一項常見的操作。本文將介紹幾種常用的數(shù)字轉(zhuǎn)字符串的方式，并通過性能測試比較它們的效率。我們將深入探討每種方法的原理、使用場景，并總結(jié)它們的優(yōu)劣。

常見方式

• String() 函數(shù)：

  let num = 42;
  let str = String(num);
  

  原理： String() 函數(shù)是將給定的值轉(zhuǎn)換為字符串的內(nèi)建函數(shù)。對于數(shù)字，它會將其轉(zhuǎn)換為相應(yīng)的字符串表示。

  使用場景： 適用于通用的數(shù)字轉(zhuǎn)字符串需求。是一種簡單而直觀的方法。

• toString() 方法：

  let num = 42;
  let str = num.toString();
  

  原理： toString() 方法是基本數(shù)據(jù)類型的方法之一，用于將數(shù)字轉(zhuǎn)換為字符串。

  使用場景： 通常與數(shù)字對象一起使用，適用于數(shù)字對象的場景。

• 模板字符串（Template String）：

  let num = 42;
  let str = `${num}`;
  

  原理： 使用模板字符串是一種簡潔的方式，它在字符串中嵌入了變量，這里的變量是數(shù)字。

  使用場景： 適用于需要在字符串中嵌入變量的情況，同時進行數(shù)字轉(zhuǎn)字符串。

• String Concatenation（字符串拼接）：

  let num = 42;
  let str = '' + num;
  

  原理： 在JavaScript中，使用 + 運算符進行字符串拼接時，會將數(shù)字隱式轉(zhuǎn)換為字符串。

  使用場景： 適用于快速、簡便的數(shù)字轉(zhuǎn)字符串需求。

• new String() 構(gòu)造函數(shù)

  new String(num)
  

  原理： 使用 new String() 構(gòu)造函數(shù)創(chuàng)建一個字符串對象，將數(shù)字作為參數(shù)傳入。

  使用場景： 通常不推薦使用，因為它創(chuàng)建了一個字符串對象而非基本字符串類型。在一些特殊情況下可能有用。

• toFixed() 方法：

  let num = 42.567;
  let str = num.toFixed(2); // "42.57"
  

  原理： toFixed() 方法是數(shù)字對象的方法，用于將數(shù)字轉(zhuǎn)換為字符串，并指定小數(shù)點后的位數(shù)。

  使用場景： 適用于需要控制小數(shù)點后位數(shù)的情況，比如處理貨幣等。

性能測試及總結(jié)

我們通過執(zhí)行一百萬次的循環(huán)測試這六種方法的性能，得到以下結(jié)果：

• String(): 6.08 ms
• toString(): 5.54 ms
• 模板字符串（Template String）: 3.18 ms
• toFixed(): 118.79 ms
• 使用 + 運算符: 5.79 ms
• new String(): 12.04 ms

從性能測試結(jié)果可以看出，模板字符串是最快的，其次是 String() 、使用 + 運算符和 toString() 方法性能相近。new String() 構(gòu)造函數(shù)的性能相對較差，不建議在普通場景中使用。toFixed() 方法的性能最差差，主要因為它進行了復(fù)雜的小數(shù)位控制，適用于特定的場景，比如需要處理貨幣。

總體來說，根據(jù)具體場景選擇合適的方法是至關(guān)重要的。如果簡單直觀、性能足夠好，可以選擇 String() 函數(shù)或使用 + 運算符。如果需要在字符串中嵌入變量，模板字符串是一個不錯的選擇。new String() 構(gòu)造函數(shù)在通常情況下并不是首選，性能較差。

綜上所述，合理選擇數(shù)字轉(zhuǎn)字符串的方法可以在代碼性能和可讀性之間取得平衡。在實際開發(fā)中，建議根據(jù)具體需求靈活選擇適合的方法。

為什么String、toString()、+運算符時間近似？

JavaScript中使用String()、使用 + 運算符和toString()方法將值轉(zhuǎn)換為字符串的性能相近，是因為這三種方法都會調(diào)用對象的內(nèi)部方法@@toPrimitive來獲取原始值，然后再將原始值轉(zhuǎn)換為字符串。

@@toPrimitive是一個符號屬性，它是一個函數(shù)，接受一個字符串參數(shù)，表示轉(zhuǎn)換的期望類型（“number"或"string”），并返回一個原始值。²³

如果對象有自定義的@@toPrimitive方法，那么它會根據(jù)期望類型返回相應(yīng)的原始值。如果對象沒有自定義的@@toPrimitive方法，那么默認的轉(zhuǎn)換規(guī)則如下：

• 如果期望類型是"number"，那么先調(diào)用valueOf()方法，如果返回的是原始值，就返回這個值，否則再調(diào)用toString()方法，如果返回的是原始值，就返回這個值，否則拋出類型錯誤異常。
• 如果期望類型是"string"，那么先調(diào)用toString()方法，如果返回的是原始值，就返回這個值，否則再調(diào)用valueOf()方法，如果返回的是原始值，就返回這個值，否則拋出類型錯誤異常。

因此，使用String()、使用 + 運算符和toString()方法都會觸發(fā)對象的@@toPrimitive方法，只是期望類型不同。String()和toString()都期望得到"string"類型的原始值，而 + 運算符則根據(jù)操作數(shù)的類型來確定期望類型。如果其中一個操作數(shù)是字符串，那么期望類型是"string"，否則是"number"。

由于這三種方法都會調(diào)用相同的內(nèi)部方法，所以它們的性能相近。當(dāng)然，具體的性能還取決于瀏覽器的實現(xiàn)和優(yōu)化，以及對象的類型和結(jié)構(gòu)。一般來說，使用 + 運算符可能會稍微快一點，因為它不需要創(chuàng)建一個新的函數(shù)對象，而是直接使用內(nèi)置的運算符函數(shù)。

測試代碼

const num = 123456789
const times = 100000

console.time("String")
for (let i = 0; i < times; i++) {
	String(num)
}
console.timeEnd("String")

console.time("toString")
for (let i = 0; i < times; i++) {
	num.toString()
}
console.timeEnd("toString")

console.time("template string")
for (let i = 0; i < times; i++) {
	`${num}`
}
console.timeEnd("template string")

console.time("toFixed")
for (let i = 0; i < times; i++) {
	num.toFixed(2)
}
console.timeEnd("toFixed")

console.time('use +""')
for (let i = 0; i < times; i++) {
	num + ""
}
console.timeEnd('use +""')

console.time("new String")
for (let i = 0; i < times; i++) {
	new String(num)
}
console.timeEnd("new String")

總結(jié) 

到此這篇關(guān)于JavaScript中數(shù)字轉(zhuǎn)字符串的6種方式以及性能比較的文章就介紹到這了,更多相關(guān)JS數(shù)字轉(zhuǎn)字符串內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評論