Introduction to Javascript method of converting variables into strings

This article mainly introduces you to three methods of converting variables into strings in Javascript. These three methods are: value.toString(), "" + value and String(value). The article passes The sample code is introduced in very detail. Friends who need it can follow the editor to learn together.

Preface

Everyone should know that for JavaScript, there are 3 different ways to convert variables into strings. This article will introduce these methods in detail and compare their advantages and disadvantages. Not much to say below, let’s take a look at the detailed introduction.

3 methods

The 3 methods to convert a variable into a string are as follows:

• value. toString()

• ##"" + value

• ##String(value)

When value is null or undefined, the first method will not work. And method 2 and method 3 are basically the same.

""+value:

Add value to an empty string to convert it to a string. This method is actually a slightly obscure technique that may make it difficult for others to understand the developer's intentions. However, this is a matter of opinion, and some people prefer this method. String(value): This method is very clear: use the

String()

function to convert value to a string. However, String() has two different uses, which is easy to confuse, especially for Java developers. When String() is used as a constructor together with operator new, it returns a newly created String object; when String() is called without new operator, it only value is converted into a raw string. The two are very different:

> 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

In fact, it is not common to use

String()

as a constructor, so use it only Just convert the string.

""+Subtle differences between value and String(value)

""+value

and String(value) can convert value into a string. How do they do it? In fact, although their results are the same, their methods are slightly different.

Convert the primitive basic type to a stringBoth methods use the internal function

ToString()

Convert the primitive Basic types are converted to strings. ToString()The function is defined in ECMAScript 5.1 (§9.8), but cannot be used directly, so it is called an internal function. The following table shows how the ToString() function converts primitive primitive types to strings:

Parametersundefined##null"null"Boolean"true" or "false"NumberConvert a number to a string, For example: "1.765"No need to convert

Result
"undefined"
	##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) ，它们基本上是一样的。

The above is the detailed content of Introduction to Javascript method of converting variables into strings. For more information, please follow other related articles on the PHP Chinese website!