JavaScript进阶系列-类型转换、隐式类型转换

我的博客仓库

类型转换、隐式类型转换

用来放一些我看的书籍和学习的记录，欢迎点赞和讨论。

---

转换为字符串

ECMAScript 的 Boolean 值、数字和字符串的原始值都是伪对象，这意味着它们可以使用原型对象上面的属性和方法。

ECMAScript 定义所有对象都有 toString() 方法，无论它是伪对象，还是真对象。

let obj = {name:'obj'};
obj.toString(); // [object Object]

let arr = [1,2];
arr.toString(); // "1,2"

function func(){}
func.toString() // "function func(){}"

false.toString() // "false"
复制代码

参数	结果
undefined	"undefined"
null	"null"
boolean	"true" 或者 "false"
number	数字作为字符串。比如，"1.765"
string	无需转换
[]	""
[5,2]	"5,2"
{}	"[object Object]"
Symbol()	"Symbol()"

转换为数字

ECMAScript 提供了两种把非数字的原始值转换成数字的方法，即 parseInt() 和 parseFloat() 。 只有对 String 类型调用这些方法，它们才能正确运行；对其他类型返回的都是 NaN。

参数	结果
undefined	NaN
null	+0
boolean	true被转换为1,false转换为+0
number	无需转换
string	由字符串解析为数字。例如，"324"被转换为324
[]	+0
[5]	5
{}	NaN
Symbol	报错

转换为 Boolean

参数	结果
undefined	false
null	false
boolean	无需转换
number	+0,-0转换为false,其他为true
string	''为false,其他为true
[]	true
{}	true
Symbol	true

强制类型转换

ECMAScript 中可用的 3 种强制类型转换如下：

• Boolean(value) - 把给定的值转换成 Boolean 型；
• Number(value) - 把给定的值转换成数字（可以是整数或浮点数）；
• String(value) - 把给定的值转换成字符串；

Boolean() 函数

当要转换的值是至少有一个字符的字符串、非 0 数字或对象时，Boolean() 函数将返回 true。如果该值是空字符串、数字 0、undefined 或 null、NaN，它将返回 false。

Number() 函数

Number() 函数的强制类型转换与 parseInt() 和 parseFloat() 方法的处理方式相似，只是它转换的是整个值，而不是部分值。

String() 函数

String() 它可把任何值转换成字符串。

隐式类型转换

JavaScript 默认自动转换，没有任何警告 隐式类型转换常见场景

自动转换 Boolean

例如 if 语句 或者其他需要 Boolean 的地方

if (表达式){}
复制代码

运算符

在非 Numeber 类型进行数学运算符 - * / 时，会先将非 Number 转换成 Number 类型。 + 运算符要考虑字符串的情况，在操作数中存在字符串时，优先转换成字符串，

+ 运算符其中一个操作数是字符串的话，会进行连接字符串的操作。

1+'2' // '12'
复制代码

+ 操作符的执行顺序是：

• 当一侧操作数为 String 类型，会优先将另一侧转换为字符串类型。
• 当一侧操作数为 Number 类型，另一侧为原始类型，则将原始类型转换为 Number 类型。
• 当一侧操作数为 Number 类型，另一侧为引用类型，将引用类型和 Number 类型转换成字符串后拼接。

对象

只有在 JavaScript 表达式或语句中需要用到数字或字符串时，对象才被隐式转换。

当需要将对象转换为数字时，需要三个步骤

• 调用 valueOf()。如果结果是原始值（不是一个对象），则将其转换为一个数字。

3*{valueOf:function () { return 5 }} // 15
复制代码

• 否则，调用 toString() 方法。如果结果是原始值，则将其转换为一个数字。

3*{toString:function () { return 5 }} // 15
复制代码

• 否则，抛出一个类型错误。

3*{toString:function () { return {} }} //TypeError: Cannot convert object to primitive value
复制代码

参考

ECMAScript 类型转换

JavaScript 的怪癖 1：隐式类型转换

问题：可能发生隐式类型转换的场景以及转换原则，应如何避免或巧妙应用？

问题：{} + {} = ？

"[object Object][object Object]"

JavaScript中,{}+{}等于多少?

常见错误使用：false

Boolean('false') // true
Boolean('undefined') // true
// 这里他们都是字符串
复制代码

问题:如何让：a == 1 && a == 2 && a == 3

const a = {
  value:[3,2,1],
  valueOf: function(){this.value.pop()}
}
复制代码

转载于:https://juejin.im/post/5cda9178f265da0379419ad1