资讯专栏INFORMATION COLUMN

JS中将变量转为字符串

Alex / 796人阅读

摘要:将与空字符串相加,即可将其转换为字符串。这两者是非常不同的事实上,将作为构造函数使用并不常见,因此仅使用它来转换字符串就好了。这就意味着两者的计算过程是这样的返回值,然后使用转换为字符串。

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

原文: Converting a value to string in JavaScript

译者: Fundebug

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

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

3种方法

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

value.toString()

"" + value

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)的细微差别

""+value与String(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
它们的结果相同

""+value与String(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() 。否则,你只能使用""+value 和String(value),它们基本上是一样的。

参考

JavaScript values: not everything is an object

What is {} + {} in JavaScript?

String concatenation in JavaScript

JavaScript String 对象

版权声明:
转载时请注明作者Fundebug以及本文地址:
https://blog.fundebug.com/201...

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/88803.html

相关文章

  • 前端笔试题面试题记录(下)

    摘要:前言接上篇前端笔试题面试题记录上。默认值,不脱离文档流,,,,等属性不生效。。不脱离文档流,依据自身位置进行偏离,当子元素设置,将依据它进行偏离。。 前言 接上篇前端笔试题面试题记录(上)。趁清明小长假,把上篇剩下的部分也写一下,因为最近比较忙这篇已经拖了很久了。现在刚刚开始银四了,应该还是有些小伙伴在找工作,时间还不算太晚,希望本篇可以帮到这些小伙伴。 个人博客了解一下:obkoro...

    Lin_YT 评论0 收藏0
  • 前端笔试题面试题记录(下)

    摘要:前言接上篇前端笔试题面试题记录上。默认值,不脱离文档流,,,,等属性不生效。。不脱离文档流,依据自身位置进行偏离,当子元素设置,将依据它进行偏离。。 前言 接上篇前端笔试题面试题记录(上)。趁清明小长假,把上篇剩下的部分也写一下,因为最近比较忙这篇已经拖了很久了。现在刚刚开始银四了,应该还是有些小伙伴在找工作,时间还不算太晚,希望本篇可以帮到这些小伙伴。 个人博客了解一下:obkoro...

    suemi 评论0 收藏0
  • 数据类型转换,普通类型(原始对象)和对象的区别的一些知识点

    摘要:类型的和是,空字符串也是,所有的对象都是即使是空对象也是。六普通类型原始对象和包装对象的转换某些场合,原始类型的值会自动当作包装对象调用,即调用包装对象的属性和方法。第三重新给变量赋值且值是对象类型,此时会在堆内存保存的值。 一、数据类型转换:JS是一门动态类型的语言,变量数据类型没有限制,可以随时赋值,但是运算时是对数据类型有要求的,如果运算类型不符,js会自动强制转换类型后再进行计...

    y1chuan 评论0 收藏0
  • 【芝士整理】JS基础图谱

    摘要:没有找到的话,看上级函数作用域,向上查找到,找到为止。将会在执行上下文栈中保留上级作用域的执行上下文。若在闭包使用完毕之后不手动解除引用,相关执行上下文将会一直保留于执行上下文栈中,占据内存空间,若持续积累,容易造成内存泄漏。 JS有哪些基本数据类型呢? 值类型:undefined, Number, Boolean, String,null 引用类型:Object 值类型存放在栈中 引...

    netScorpion 评论0 收藏0
  • JS 里的数据类型与转换

    摘要:的数据类型,共有七种数值整数和小数比如和。布尔值表示真伪的两个特殊值,即真和假。符号其中是新增的基本数据类型,本文仅介绍前六种。转换规则是除了或空字符串六个值被转为,其他值都视为。属性对象的每一个键名又称为属性,它的键值可以是任何数据类型。 一、简介 JavaScript 语言的每一个值,都属于某一种数据类型。JavaScript 的数据类型,共有七种: 数值(number):整数和...

    yck 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<