JavaScript 类型转换与运算规则

前言

JavaScript 是弱类型语言 ，变量没有固定类型，运算时会自动隐式转换类型，这是 JS 最容易踩坑的点。

目录

[一、JS 数据类型](#一、JS 数据类型)

二、类型转换

[1. 原始转数字](#1. 原始转数字)

[2. 所有转布尔](#2. 所有转布尔)

[3. 原始转字符串](#3. 原始转字符串)

[4. 对象转原始](#4. 对象转原始)

三、运算规则

[1. 算术运算](#1. 算术运算)

[2. 比较运算](#2. 比较运算)

[3. 逻辑运算](#3. 逻辑运算)

总结

---

一、JS 数据类型

分为 原始类型 和 引用类型：

1. 原始类型 （7 种）：Number、String、Boolean、Undefined、Null、Symbol、BigInt
2. 引用类型 ：Object（包含数组、函数、对象等）

---

二、类型转换

1. 原始转数字

// +
Number(true)     // 1
Number(false)    // 0
Number(null)     // 0
Number(undefined)// NaN
Number('123')    // 123
Number('')       // 0
Number('abc')    // NaN

2. 所有转布尔

// !!
Boolean(null)     // false
Boolean(undefined)// false
Boolean(0)        // false
Boolean(NaN)      // false
Boolean('')       // false
// 以上 5 种是「假值」，其余全部为 true

3. 原始转字符串

// ""
String(123)      // "123"
String(true)     // "true"
String(null)     // "null"

4. 对象转原始

1. 先调用 valueOf()，如果返回原始值就用它
2. 否则调用 toString()，如果返回原始值就用它
3. 否则报错

三、运算规则

1. 算术运算 + - * / % ++ --

• 转换为数字，然后运算
• 特殊情况：x+y，x和y有一个是字符串，全部转换为字符串拼接
• 特殊情况：NaN和任何类型运算得到的还是NaN

2. 比较运算 > < >= <= == != === !==

• > < >= <=
  • 转换为数字，然后比较
  • 特殊情况：两端全是字符串，按Unicode 编码逐位比较
  • 特殊情况：两端存在NaN，一定为false
• ===
  • 类型和值必须都相同
  • 特殊情况：两端存在NaN，一定为false
• ==
  • 两端类型相同，比较值
  • 两端都是原始类型，转换成数字比较
  • 一端是原始类型，一端是对象类型把对象转换成原始类型后比较
  • 特殊情况：undefined和null只有与自身比较或者互相比较时，才会返回true
  • 特殊情况：两端存在NaN，一定为false
• != !==
  • 对相等取反

3. 逻辑运算 ! && || ?:

• x&&y
  • x为false，返回x
  • x为true，返回y
• x||y
  • x为false，返回y
  • x为true，返回x

总结

1. + 遇字符串必拼接，其他运算符优先转数字
2. == 会隐式转换，=== 绝对相等
3. 只有 6 个假值 ，其余全是 true
4. 引用类型运算：先 valueOf 再 toString
5. 开发尽量用：Number()/String() 显式转换 + === 严格相等