Conversion method: 1. Use the " " operator to combine with the empty string, the syntax is "value''"; 2. Use the template string, the syntax is "${value}"; 3. Use "JSON.stringify" (value)" statement; 4. Use the "value.toString()" statement; 5. Use the "String(value)" statement.
The operating environment of this tutorial: windows7 system, javascript version 1.8.5, Dell G3 computer.
Five ways to convert a value to a string in JavaScript
const value = 12345; // Concat Empty String value + ''; // Template Strings `${value}`; // JSON.stringify JSON.stringify(value); // toString() value.toString(); // String() String(value); // RESULT // '12345'
Compare 5 ways
Okay, let's test 5 ways with different values. Here are the variables we want to test it on:
const string = "hello"; const number = 123; const boolean = true; const array = [1, "2", 3]; const object = {one: 1 }; const symbolValue = Symbol('123'); const undefinedValue = undefined; const nullValue = null;
Combined with the empty string using the " " operator
string + ''; // 'hello' number + ''; // '123' boolean + ''; // 'true' array + ''; // '1,2,3' object + ''; // '[object Object]' undefinedValue + ''; // 'undefined' nullValue + ''; // 'null' // ⚠️ symbolValue + ''; // ❌ TypeError
From here you can see if the value is A Symbol, this method will throw TypeError. Otherwise, everything looks good.
Template string
`${string}`; // 'hello' `${number}`; // '123' `${boolean}`; // 'true' `${array}`; // '1,2,3' `${object}`; // '[object Object]' `${undefinedValue}`; // 'undefined' `${nullValue}`; // 'null' // ⚠️ `${symbolValue}`; // ❌ TypeError
The result of using the template string is basically the same as combining the empty string. Again, this may not be the ideal way to handle Symbol since it will throw a TypeError.
If you're curious, here's the TypeError: TypeError: Cannot convert a Symbol value to a string
JSON.stringify()
JSON.stringify(string); // '"hello"' JSON.stringify(number); // '123' JSON.stringify(boolean); // 'true' JSON.stringify(array); // '[1,"2",3]' JSON.stringify(object); // '{"one":1}' JSON.stringify(nullValue); // 'null' JSON.stringify(symbolValue); // undefined JSON.stringify(undefinedValue); // undefined
So you don't typically use JSON.stringify to convert a value to a string. And there's really no forcing happening here. So you know all the tools available. You can then decide what tool to use instead of using it on a case-by-case basis. When you use it on an actual string value, it changes it to a quoted string.
.toString()
string.toString(); // 'hello' number.toString(); // '123' boolean.toString(); // 'true' array.toString(); // '1,2,3' object.toString(); // '[object Object]' symbolValue.toString(); // 'Symbol(123)' // ⚠️ undefinedValue.toString(); // ❌ TypeError nullValue.toString(); // ❌ TypeError
String()
String(string); // 'hello' String(number); // '123' String(boolean); // 'true' String(array); // '1,2,3' String(object); // '[object Object]' String(symbolValue); // 'Symbol(123)' String(undefinedValue); // 'undefined' String(nullValue); // 'null'
As you can see , String() handles null and undefined quite well. No errors will be thrown - unless that's what you want. Generally remember my advice. You will know your application best, so you should choose what works best for your situation.
Conclusion: String()
After showing you how all the different methods handle different types of values. Hopefully you understand the differences and you'll know which tools to use the next time you're working on code. If you're not sure, String() is always a good default choice
javascript advanced tutorial
】The above is the detailed content of How to convert value to string in javascript. For more information, please follow other related articles on the PHP Chinese website!