JS中将变量转为字符串

译者按: 语言的细枝末节了解一下就可以了,不需要太较真,不过如果一点也不知道的话,那就不太妙了。

为了保证可读性,本文采用意译而非直译。另外,本文版权归原作者所有,翻译仅用于学习。

对于JavaScript,有3种不同方法可以将变量转换为字符串。这篇博客将详细介绍这些方法,并比较他们的优劣。

3种方法

将变量转换为字符串的3种方法如下:

  1. value.toString()
  2. "" + value
  3. String(value)

valuenull或者undefined时,第1种方法就不行了。而方法2和方法3基本上是一样的。

  • ""+value: 将value空字符串相加,即可将其转换为字符串。这种方法其实是一种稍微晦涩的技巧,可能会让别人难于理解开发者的意图。不过,这一点见仁见智,有些人偏爱这种方法。
  • String(value): 这种方法非常清晰:使用String()函数将value转换为字符串。不过,String()有两种不同用法,容易混淆,尤其对于Java开发者来说。当String()和运算符new一起作为构造函数使用时,它返回一个新创建的String对象;当不用new运算符调用String()时,它只把value转换成原始的字符串。这两者是非常不同的:

> 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

事实上,将String()作为构造函数使用并不常见,因此仅使用它来转换字符串就好了。

“”+value与String(value)的细微差别

""+valueString(value)都可以将value转换为字符串,它们是如何做到的呢?事实上,它们虽然结果相同,但是方法稍有区别。

将primitive基本类型转换为字符串

两种方法都使用内部函数ToString()primitive基本类型转换为字符串。ToString()函数在ECMAScript 5.1 (§9.8)中定义了,但是并不能直接使用,因此称作内部函数。下面的表格显示了ToString()函数如何将primitive基本类型转换为字符串:

参数 结果
undefined "undefined"
null "null"
Boolean "true"或者 "false"
Number 将数字转换为字符串,例如: "1.765"
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

它们的结果相同

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


> var x = {}

> x.valueOf() === x

true

由于valueOf()返回值并非primitive,因此ToPrimitive(Number)会跳过valueOf(),而返回toString()的返回值。这样,与ToPrimitive(String)的返回值就一样了。

objectBooleanNumber或者String实例时,valueOf()将返回primitive。这就意味着两者的计算过程是这样的:

  • ToPrimitive(Number):valueOf()返回primitive值,然后使用ToString()转换为字符串。
  • ToPrimitive(String): toString()通过ToString()函数将primitive值转换为字符串。

可知,虽然计算过程不同,但是它们的结果是一样的。

结论

那么你该选择哪种方法呢?如果你可以确保value值不是nullundefined,那么不妨使用value.toString()。否则,你只能使用""+valueString(value),它们基本上是一样的。

参考

  1. JavaScript values: not everything is an object
  2. What is {} + {} in JavaScript?
  3. String concatenation in JavaScript
  4. JavaScript String 对象

版权声明:
转载时请注明作者Fundebug以及本文地址:
https://blog.fundebug.com/2017/09/18/value-to-string/
时间: 2024-10-11 10:28:21

JS中将变量转为字符串的相关文章

JS中将JSON的字符串解析成JSON数据格式《转》

在JS中将JSON的字符串解析成JSON数据格式,一般有两种方式: 1.一种为使用eval()函数. 2. 使用Function对象来进行返回解析. 使用eval函数来解析,并且使用jquery的each方法来遍历 用jquery解析JSON数据的方法,作为jquery异步请求的传输对象,jquery请求后返回的结果是json对象,这里考虑的都是服务器返回JSON形式的字符串的形式,对于利用JSONObject等插件封装的JSON对象,与此亦是大同小异,这里不再做说明. 这里首先给出JSON字符

js中数字转为字符串的几种用法

1.toString()方法 直接把数字用toString()方法转换 var number = 5; number.toString(); 2.加上空串 这个一般是我们在开发中常用的 var number = 5: var str = number + ' '; 这样str的类型自然就转化为string类型 3.自动转化 举个例子,一个div的透明度设置: div.style.opacity = 0.5; 这句代码中div.style.opacity执行完自动转为字符串类型.

JS数值变量和字符串变量

代码: <script type="text/javascript"> window.alert("你好"); document.write("你好"); document.write("<hr>"); var a = "10";//所谓链接就是将左右字符串连接起来 var b = 10; var c = a+b; document.write(c); document.write(

JS 实现变量在字符串中的多层拼接与嵌套

简单点... '<a onclick="editCsRole(roleId)" class="openNewTab">编辑</a>'; 其中 roleId 是变量,为实现数据的有效传递对 roleId 嵌套拼接如下, var param="'"+roleId+"'"; var a = '<a onclick="editCsRole('+ param +')" class=&qu

js中把JSON字符串转换成JSON对象最好的方法

在JS中将JSON的字符串解析成JSON数据格式,一般有两种方式: 1.一种为使用eval()函数. 2. 使用Function对象来进行返回解析. 第一种解析方式:使用eval函数来解析,并且使用jQuery的each方法来遍历 用jQuery解析JSON数据的方法,作为jQuery异步请求的传输对象,jQuery请求后返回的结果是json对象,这里考虑的都是服务器返回JSON形式的字符串的形式,对于利用JSONObject等插件封装的JSON对象,与此亦是大同小异,这里不再做说明. 这里首先

如何让JS变量和字符串拼接后,是变量而不是字符串

今天有个非常有趣的事,因为我需要用JS去实现多语言,就是我在JS文件里定义了不同的变量,尝试用变量拼接字符串组成之前定义好的变量名称,结果拼接之后,显示的却是字符串,而不是变量,所以无法解析 zh_test = '你好'; tw_test = ‘你好’; en_test = 'Hello'; // 然后再JS里尝试将前面的语言简写当成变量,拼接后面的字符串 var lang = 'zh'; var language = lang + '_test'; <pre name="code&quo

在JS中将指定表单内的“具有name数据的表单元素的值”封装为Get形式的字符串

//封装post时候,表单中所有具有name数据的表单元素的值,并返回“n=1&p=a” function serialize(formid) { var arr = []; var ipts = document.getElementById(formid).getElementsByTagName('input'); for (var i = 0; i < ipts.length; i++) { if (ipts[i].type=='text') { if (ipts[i].name)

js中将字符串转换成json的方式

1.eval 方式解析,实际中用的还是比较少 function evalJson(str){ var json = eval('(' + str + ')'); return json; } 2.使用js 的全局对象 JSON 对象 function isJson(str){ return JSON.parse(str); } 3.还有就是jq中 使用的 $.pareJSON $.parseJSON(str); 4.看jq源码和一些人的写法了解一种new Function function ne

js的变量的定义

1. 变量:声明(var) 赋值(=) 取值(使用变量名等效于使用变量中的值)***声明提前:程序开始执行前, 将所有var声明的变量提前到开始位置 赋值留在原地 console.log(a); //undefined var a=100; console.log(a); //100 ***使用变量报错:尝试从*未声明*的变量中*取值****给未声明的变量赋值,*不会报错*!会自动创建同名变量 2. 数据类型:2大类 原始类型:值保存在变量本地的数据类型 5种:Number String Boo