类型转换
一、是什么
类型转换,又称类型强制转换,是指将数据从一种数据类型隐式或显式地转换为另一种数据类型的过程。
二、为什么重要
理解类型转换可以帮助我们:
-
避免隐式转换带来的 Bug:如 if (str == 0) 的意外 true
-
写出更健壮的比较逻辑:区分 == 与 === 的使用场景
-
提升代码可读性与可维护性:显式转换比依赖隐式规则更清晰
-
深入理解 JavaScript 运行时行为
-
更好定位线上问题:快速识别因类型不匹配导致的逻辑错误
三、核心原理
1. 类型分类
JavaScript 内置数据类型分为两大类:
-
原始类型(Primitive):undefined、null、boolean、number、string、symbol、bigint
-
引用类型(Object):Object、Array、Function、Date、RegExp 等
2. 转换方向
类型转换主要发生在以下几种情况:
-
转换为字符串(ToString)
-
转换为数字(ToNumber)
-
转换为布尔值(ToBoolean)
3. 隐式转换触发场景
-
算术运算符:+、-、*、/、%、++、--
-
比较运算符:==、!=、>、<、>=、<=
-
逻辑运算符:&&、||、!
-
条件判断:if、while、for 等语句中的条件表达式
-
模板字符串:
${value}
4. 转换规则速查表
| 原始值 | 转字符串 | 转数字 | 转布尔 |
|---|---|---|---|
undefined | "undefined" | NaN | false |
null | "null" | 0 | false |
true | "true" | 1 | true |
false | "false" | 0 | false |
123 | "123" | 123 | true |
0 | "0" | 0 | false |
NaN | "NaN" | NaN | false |
"" | "" | 0 | false |
"123" | "123" | 123 | true |
"abc" | "abc" | NaN | true |
5. 对象转原始值
当对象需要被转换为原始类型时,会调用内部 @@toPrimitive 方法,或依次调用 valueOf() 和 toString():
-
转换为数字:先 valueOf(),若返回原始值则使用,否则调用 toString(),若仍不是原始值则报错
-
转换为字符串:先 toString(),若返回原始值则使用,否则调用 valueOf(),若仍不是原始值则报错
const arr = [1, 2, 3];
arr.valueOf(); // [1, 2, 3] 非原始值
arr.toString(); // "1,2,3"
const obj = {};
obj.valueOf(); // {}
obj.toString(); // "[object Object]"
四、总结
类型转换是 JavaScript 灵活性的体现