简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Home > Web Front-end > JS Tutorial > body text

Introduction to Javascript method of converting variables into strings

巴扎黑
Release： 2017-09-20 09:27:59
Original
1432 people have browsed it

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
Copy after login

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 {};
 }
};
Copy after login

调用结果:


> "" + obj
valueOf
toString
TypeError: Cannot convert object to primitive value
> String(obj)
toString
valueOf
TypeError: Cannot convert object to primitive value
Copy after login

它们的结果相同

""+value与String(value)虽然不同，但是我们很少能感觉到。因为，大多数object使用默认的valueOf() ，它返回对象本身：


> var x = {}
> x.valueOf() === x
true
Copy after login

由于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!

Related labels：
javascript js string
source：php.cn
Previous article：js modular approach Next article：Relevant introduction to this, apply, call, and bind in JS
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Latest Issues
CSS only method to dynamically modify image src on click without using JavaScript I need to change the src of an image on mouse click using only css like img:active{}
From 2024-04-06 19:25:49
0
1
505
Scatterplot points do not maintain values ​​when zooming in d3.js This is my first time using d3.js, so please bear with me. I implemented it as pure JavaSc...
From 2024-04-06 18:16:26
0
1
403
JavaScript hover events on vendor-specific pseudo-elements I have the following htmlinput tag. $("input[type='range']::-webkit-slider-thumb"...
From 2024-04-06 15:35:24
0
1
274
Submit form without button using Javascript/Jquery I'm trying to submit a form without a button by calling a JavaScript function and executin...
From 2024-04-06 14:54:03
0
2
421
Customize the appearance of Bootstrap accordion headers using the CollapseDisplay class I want to style the card title of a panel with class collapseshow. In this example, it's t...
From 2024-04-06 12:53:11
0
1
376
Related Topics
More>
Popular Recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn：Public welfare online PHP training，Help PHP learners grow quickly！