在 JavaScript 中将数字转换为字符串的最佳方法是什么？

Question

What's the "best" way to convert a number to a string (in terms of speed advantage, clarity advantage, memory advantage, etc)?

Some examples:

1. String(n)

2. n.toString()

3. ""+n

4. n+""

Answer 1

like this:

var foo = 45;
var bar = '' + foo;

Actually, even though I typically do it like this for simple convenience, over 1,000s of iterations it appears for raw speed there is an advantage for .toString()

See Performance tests here (not by me, but found when I went to write my own): http://jsben.ch/#/ghQYR

Fastest based on the JSPerf test above: str = num.toString();

It should be noted that the difference in speed is not overly significant when you consider that it can do the conversion any way 1 Million times in 0.1 seconds .

Update: The speed seems to differ greatly by browser. In Chrome num + '' seems to be fastest based on this test http://jsben.ch/#/ghQYR

Update 2: Again based on my test above it should be noted that Firefox 20.0.1 executes the .toString() about 100 times slower than the '' + num sample.

Answer 2

在我看来n.toString()因其清晰而获奖，我认为它不会带来任何额外的开销。

Answer 3

Explicit conversions are very clear to someone that's new to the language. Using type coercion, as others have suggested, leads to ambiguity if a developer is not aware of the coercion rules. Ultimately developer time is more costly than CPU time, so I'd optimize for the former at the cost of the latter. That being said, in this case the difference is likely negligible, but if not I'm sure there are some decent JavaScript compressors that will optimize this sort of thing.

So, for the above reasons I'd go with: n.toString() or String(n) . String(n) is probably a better choice because it won't fail if n is null or undefined.

Answer 4

...JavaScript's parser tries to parse the dot notation on a number as a floating point literal.

2..toString(); // the second point is correctly recognized
2 .toString(); // note the space left to the dot
(2).toString(); // 2 is evaluated first

Source

Answer 5

Other answers already covered other options, but I prefer this one:

s = `${n}`

Short, succinct, already used in many other places (if you're using a modern framework / ES version) so it's a safe bet any programmer will understand it.

Not that it (usually) matters much, but it also seems to be among the fastest compared to other methods .

Answer 6

The below are the methods to convert an Integer to String in JS.

The methods are arranged in the decreasing order of performance.

var num = 1

Method 1:

num = `${num}`

Method 2:

num = num + ''

Method 3:

num = String(num)

Method 4:

num = num.toString()

Note: You can't directly call toString() on a number. 2.toString() will throw Uncaught SyntaxError: Invalid or unexpected token .

(The performance test results are given by @DarckBlezzer in his answer)

Answer 7

Tongue-in-cheek obviously:

var harshNum = 108;
"".split.call(harshNum,"").join("");

Or in ES6 you could simply use template strings :

var harshNum = 108;
`${harshNum}`;

Answer 8

The simplest way to convert any variable to a string is to add an empty string to that variable.

5.41 + ''    // Result: the string '5.41'
Math.PI + '' // Result: the string '3.141592653589793'

Answer 9

I used https://jsperf.com to create a test case for the following cases:

number + ''
`${number}`
String(number)
number.toString()

https://jsperf.com/number-string-conversion-speed-comparison

As of 24th of July, 2018 the results say that number + '' is the fastest in Chrome, in Firefox that ties with template string literals.

Both String(number) , and number.toString() are around 95% slower than the fastest option.

Answer 10

If you need to format the result to a specific number of decimal places, for example to represent currency, you need something like the toFixed() method.

number.toFixed( [digits] )

digits is the number of digits to display after the decimal place.

Answer 11

I recommended `${expression}` because you don't need to worry about errors.

 [undefined,null,NaN,true,false,"2","",3].forEach(elem=>{ console.log(`${elem}`, typeof(`${elem}`)) }) /* output undefined string null string NaN string true string false string 2 string string 3 string */

---

Below you can test the speed. but the order will affect the result. (in StackOverflow) you can test it on your platform.

 const testCases = [ ["${n}", (n) => `${n}`], // 👈 ['----', undefined], [`"" + n`, (n) => "" + n], [`'' + n`, (n) => '' + n], [`\`\` + n`, (n) => `` + n], [`n + ''`, (n) => n + ''], ['----', undefined], [`String(n)`, (n) => String(n)], ["${n}", (n) => `${n}`], // 👈 ['----', undefined], [`(n).toString()`, (n) => (n).toString()], [`n.toString()`, (n) => n.toString()], ] for (const [name, testFunc] of testCases) { if (testFunc === undefined) { console.log(name) continue } console.time(name) for (const n of [...Array(1000000).keys()]) { testFunc(n) } console.timeEnd(name) }

Answer 12

I'm going to re-edit this with more data when I have time to, for right now this is fine...

Test in nodejs v8.11.2: 2018/06/06

 let i=0; console.time("test1") for(;i<10000000;i=i+1){ const string = "" + 1234; } console.timeEnd("test1") i=0; console.time("test1.1") for(;i<10000000;i=i+1){ const string = '' + 1234; } console.timeEnd("test1.1") i=0; console.time("test1.2") for(;i<10000000;i=i+1){ const string = `` + 1234; } console.timeEnd("test1.2") i=0; console.time("test1.3") for(;i<10000000;i=i+1){ const string = 1234 + ''; } console.timeEnd("test1.3") i=0; console.time("test2") for(;i<10000000;i=i+1){ const string = (1234).toString(); } console.timeEnd("test2") i=0; console.time("test3") for(;i<10000000;i=i+1){ const string = String(1234); } console.timeEnd("test3") i=0; console.time("test4") for(;i<10000000;i=i+1){ const string = `${1234}`; } console.timeEnd("test4") i=0; console.time("test5") for(;i<10000000;i=i+1){ const string = 1234..toString(); } console.timeEnd("test5") i=0; console.time("test6") for(;i<10000000;i=i+1){ const string = 1234 .toString(); } console.timeEnd("test6")

output

test1: 72.268ms
test1.1: 61.086ms
test1.2: 66.854ms
test1.3: 63.698ms
test2: 207.912ms
test3: 81.987ms
test4: 59.752ms
test5: 213.136ms
test6: 204.869ms

Answer 13

The only valid solution for almost all possible existing and future cases (input is number, null, undefined, Symbol, anything else) is String(x) . Do not use 3 ways for simple operation, basing on value type assumptions, like "here I convert definitely number to string and here definitely boolean to string".

Explanation:

String(x) handles nulls, undefined, Symbols, [anything] and calls .toString() for objects.

'' + x calls .valueOf() on x (casting to number), throws on Symbols, can provide implementation dependent results.

x.toString() throws on nulls and undefined.

Note: String(x) will still fail on prototype-less objects like Object.create(null) .

If you don't like strings like 'Hello, undefined' or want to support prototype-less objects, use the following type conversion function:

/**
 * Safely casts any value to string. Null and undefined are converted to ''.
 * @param  {*} value
 * @return {string}
 */
function string (str) {
  return value == null ? '' : (typeof value === 'object' && !value.toString ? '[object]' : String(value));
}

Answer 14

With number literals, the dot for accessing a property must be distinguished from the decimal dot. This leaves you with the following options if you want to invoke to String() on the number literal 123:

123..toString()
123 .toString() // space before the dot 123.0.toString()
(123).toString()

Answer 15

.toString() 是内置的类型转换函数，我不是这些细节的专家，但每当我们比较内置类型转换和显式方法时，总是首选内置的变通方法。

Answer 16

I like the first two since they're easier to read. I tend to use String(n) but it is just a matter of style than anything else.

That is unless you have a line as

var n = 5;
console.log ("the number is: " + n);

which is very self explanatory

Answer 17

我认为这取决于情况，但无论如何您都可以使用.toString()方法，因为它很容易理解。

Answer 18

If I had to take everything into consideration, I will suggest following

var myint = 1;
var mystring = myint + '';
/*or int to string*/
myint = myint + ''

IMHO, its the fastest way to convert to string. Correct me if I am wrong.

Answer 19

If you are curious as to which is the most performant check this out where I compare all the different Number -> String conversions.

Looks like 2+'' or 2+"" are the fastest.

https://jsperf.com/int-2-string

Answer 20

We can also use the String constructor. According to this benchmark it's the fastest way to convert a Number to String in Firefox 58 even though it's slower than " + num in the popular browser Google Chrome.

Answer 21

Method toFixed() will also solves the purpose.

var n = 8.434332;
n.toFixed(2)  // 8.43

Answer 22

You can call Number object and then call toString() .

Number.call(null, n).toString()

You may use this trick for another javascript native objects.

Answer 23

Just come across this recently, method 3 and 4 are not appropriate because how the strings are copied and then put together. For a small program this problem is insignificant, but for any real web application this action where we have to deal with frequency string manipulations can affects the performance and readability.

Here is the link the read .

Answer 24

It seems similar results when using node.js. I ran this script:

let bar;
let foo = ["45","foo"];

console.time('string concat testing');
for (let i = 0; i < 10000000; i++) {
    bar = "" + foo;
}
console.timeEnd('string concat testing');


console.time("string obj testing");
for (let i = 0; i < 10000000; i++) {
    bar = String(foo);
}
console.timeEnd("string obj testing");

console.time("string both");
for (let i = 0; i < 10000000; i++) {
    bar = "" + foo + "";
}
console.timeEnd("string both");

and got the following results:

❯ node testing.js
string concat testing: 2802.542ms
string obj testing: 3374.530ms
string both: 2660.023ms

Similar times each time I ran it.

Answer 25

Just use Template literal syntax:

`${this.num}`