[TOC] # 类型转换 在 JS 中类型转换只有三种情况，分别是： * 转换为布尔值 * 转换为数字 * 转换为字符串  ## 转Boolean 在条件判断时，除了`undefined`，`null`，`false`，`NaN`，`''`，`0`，`-0`，其他所有值都转为`true`，包括所有对象。 ## 对象转原始类型 对象在转换类型的时候，会调用内置的`[[ToPrimitive]]`函数，对于该函数来说，算法逻辑一般来说如下： * 如果已经是原始类型了，那就不需要转换了 * 调用`x.valueOf()`，如果转换为基础类型，就返回转换的值 * 调用`x.toString()`，如果转换为基础类型，就返回转换的值 * 如果都没有返回原始类型，就会报错 当然你也可以重写`Symbol.toPrimitive`，该方法在转原始类型时调用优先级最高。 ~~~ let a = { valueOf() { return 0 }, toString() { return '1' }, [Symbol.toPrimitive]() { return 2 } } 1 + a // => 3 ~~~ ## 四则运算符 加法运算符不同于其他几个运算符，它有以下几个特点： * 运算中其中一方为字符串，那么就会把另一方也转换为字符串 * 如果一方不是字符串或者数字，那么会将它转换为数字或者字符串 ~~~ 1 + '1' // '11' true + true // 2 4 + [1,2,3] // "41,2,3" ~~~ * 对于第一行代码来说，触发特点一，所以将数字`1`转换为字符串，得到结果`'11'` * 对于第二行代码来说，触发特点二，所以将`true`转为数字`1` * 对于第三行代码来说，触发特点二，所以将数组通过`toString`转为字符串`1,2,3`，得到结果`41,2,3` 另外对于加法还需要注意这个表达式`'a' + + 'b'` ~~~ 'a' + + 'b' // -> "aNaN" ~~~ 因为`+ 'b'`等于`NaN`，所以结果为`"aNaN"`，你可能也会在一些代码中看到过`+ '1'`的形式来快速获取`number`类型。 那么对于除了加法的运算符来说，只要其中一方是数字，那么另一方就会被转为数字 ~~~ 4 * '3' // 12 4 * [] // 0 4 * [1, 2] // NaN ~~~ ## 比较运算符 1. 如果是对象，就通过`toPrimitive`转换对象 2. 如果是字符串，就通过`unicode`字符索引来比较 ~~~ let a = { valueOf() { return 0 }, toString() { return '1' } } a > -1 // true ~~~ 在以上代码中，因为`a`是对象，所以会通过`valueOf`转换为原始类型再比较值。 ## == vs === 对于`==`来说，如果对比双方的类型**不一样**的话，就会进行**类型转换**。 假如我们需要对比`x`和`y`是否相同，就会进行如下判断流程： 1. 首先会判断两者类型是否**相同**。相同的话就是比大小了 2. 类型不相同的话，那么就会进行类型转换 3. 会先判断是否在对比`null`和`undefined`，是的话就会返回`true` 4. 判断两者类型是否为`string`和`number`，是的话就会将字符串转换为`number` ~~~ 1 == '1' ↓ 1 == 1 ~~~ 5. 判断其中一方是否为`boolean`，是的话就会把`boolean`转为`number`再进行判断 ~~~ '1' == true ↓ '1' == 1 ↓ 1 == 1 ~~~ 6. 判断其中一方是否为`object`且另一方为`string`、`number`或者`symbol`，是的话就会把`object`转为原始类型再进行判断 ~~~ '1' == { name: 'yck' } ↓ '1' == '[object Object]' ~~~  这个流程图并没有将所有的情况都列举出来，我这里只将常用到的情况列举了，如果你想了解更多的内容可以参考[标准文档](https://link.juejin.im/?target=https%3A%2F%2Fwww.ecma-international.org%2Fecma-262%2F5.1%2F%23sec-11.9.1)。 # 参考资料 * 前端面试之道 - 掘金小册