前言
这是菜鸟进阶的第二篇文章，从浅入深剖析JavaScript类型转换。
编程语言普遍内置了各式各样的数据结构，而在动态类型语言JavaScript中，变量并不与特定数据类型绑定，即任一变量均可被赋予且可随时重新赋予各类值。尽管这种灵活性使得JavaScript能够在无需明确声明类型的情况下，轻松实现不同类型值间的隐式转换，但过度依赖或误解这些隐式转换可能导致难以察觉的错误。
特别是在意料之外的场景中发生转换，或转化方向与预期不符（如期待字符串转数值，却反向发生数值转字符串）时，初涉前端领域的菜鸟们往往会因类型转换问题陷入困惑。
不要急，这篇文章将从浅入深带你剖析JavaScript类型转换，包你看完不再头疼JS类型转换。
Javascript的类型
要想弄清类型转换，我们需要复习一下JavaScript的数据类型：
在JavaScript中，我们可以将数据分成两种类型：
- 基本类型
- 复杂类型，也叫引用类型
两种类型的本质区别是：存储位置不同
- 基本数据类型存储在栈中
- 引用类型的对象存储于堆中
基本类型主要为以下7种：
- Number
- String
- Boolean
- Undefined
- null
- symbol
- BigInt
而引用类型这里则常见的有这三种
- Object
- Array
- Function
好了，接下来正式介绍JavaScript 中的类型转换机制，由于js的特性，只有到运行期间才会确定当前类型，如果变量的数据类型是不确定的，但是各种运算符对数据类型是有要求的，如果运算子的类型与预期不符合，就会触发类型转换机制。
这里可以简单将其分为两类，显式转换和隐式转换
显式类型转换
顾名思义，显式转换就是我们可以很明显地看到类型发生了转换
以下是一些常见的方法：
Number()
将任意类型的值转化为Number类型的值，其规则为：
| 转换前的值 | 转换结果 |
|---|---|
| Undefined | NaN |
| null | 0 |
| true | 1 |
| false | 0 |
| String | 根据语法规则 |
| Symbol | 抛出报错 |
| Object | 先进行Symbol.toPrimitive然后再toNumber() |
而String类型转换Number类型的语法规则有以下这些情况
- 如果可以被解析为数值，则转换为相应的数值
- 如果不可以被解析为数值，则返回NaN
- 空字符串转为0
如果遇到引用类型先将引用类型的值转为基本类型的值，再将基本类型的值转为数字
parseInt()
parseInt函数逐个解析字符，遇到不能转换的字符就停下来。
举个例子
parseInt('3月18日') //3
String()
可以将任意类型的值转化成字符串，其规则为：
| 转换前的值 | 转换结果 |
|---|---|
| Undefined | 'Undefined' |
| null | 'null' |
| Number | 对应的数字串如123-> '123' |
| true | 'true' |
| false | 'false' |
| Symbol | 抛出报错 |
| Object | 先进行Symbol.toPrimitive然后再toNumber() |
如果遇到引用类型先将引用类型的值转为基本类型的值，再将基本类型的值转为字符串
Boolean()
可以将任意类型的值转为布尔值，这里可以一句话记忆:
只有undefined、null、+-0、NaN、''(空字符串) 经过Boolean()转换会变成false,其他的都为true。
当然Boolean(false)肯定也是返回false,而Boolean('false')则会正常返回true
隐式类型转换
讲完了显式那我们接下来讲讲隐式类型转换，首先我们需要明确一个问题，即什么情况下发生隐式转换?
总结来说就是当两边运算符的操作类型不一致且运算符为以下两类时:
- 比较运算（
==、!=、>、<）、if、while需要布尔值的运算 - 算术运算（
+、-、*、/、%）
如何记忆呢？
当遇到判断布尔值时 比如if、while
灵活的js会将非布尔值的参数自动转为布尔值，系统内部会调用Boolean函数,规则直接参考上面。
当遇到算数运算时
除了+号这个特殊的个例外，其他的运算符都是把运算子自动转成数值，系统内部会调用Number函数再进行正常运算，规则直接参考上面。
而+号则特殊：
- 没有String类型参与运算时和其他算数运算逻辑一致，先调用
Number函数再进行正常运算 - 有String类型参与运算时，会将两边的数据先调用
String函数再进行正常运算
结语
至此，JS中的数据类型就已经介绍完了。
欢迎大家留言讨论，不足之处也烦请批评指正。
