这篇文章上次修改于 193 天前,可能其部分内容已经发生变化,如有疑问可询问作者。

js中的隐式转换是js中简化代码的一个很好的方式,同时也给阅读代码带来了很多的困难,之前一直都没有正视这个问题,今年看到了决定系统的总结一下js中隐式转换的规则

1、数学算符中的类型转换

当数学算符是-,*,/时,会将非Number类型转换为Number类型

特殊的+

加号因为除了数学运算的功能之外还有字符串拼接的功能,所以加法进行类型转换需要分情况讨论

  • 当一侧为String类型,被识别为字符串拼接,并会优先将另一侧转换为字符串类型。
  • 当一侧为Number类型,另一侧为原始类型,则将原始类型转换为Number类型。
  • 当一侧为Number类型,另一侧为引用类型,将引用类型和Number类型转换成字符串后拼接。

三个规则的优先级从上到下递减

123 + '123' // 123123   (规则1)
123 + null  // 123    (规则2)
123 + true // 124    (规则2)
123 + {}  // 123[object Object]    (规则3)

对象转换为字符串是Object.prototype.toString()方法进行转换

2、逻辑语句中的类型转换

在if(),while(),for()语句时,期望的输入值为boolean,所以会进行隐式转换

tips:只有 null undefined '' NaN 0 false 这几个是 false,其他的情况都是 true,比如 {} , []

转换规则

  • 规则 1:NaN和其他任何类型比较永远返回false(包括和他自己)。
NaN == NaN // false
  • 规则 2:Boolean 和其他任何类型比较,Boolean 首先被转换为 Number 类型。
true == 1  // true 
true == '2'  // false, 先把 true 变成 1,而不是把 '2' 变成 true
true == ['1']  // true, 先把 true 变成 1, ['1']拆箱成 '1', 再参考规则3
true == ['2']  // false, 同上
undefined == false // false ,首先 false 变成 0,然后参考规则4
null == false // false,同上
  • 规则 3:StringNumber比较,先将String转换为Number类型。
123 == '123' // true, '123' 会先变成 123
'' == 0 // true, '' 会首先变成 0

规则 4:null == undefined比较结果是true,除此之外,nullundefined和其他任何结果的比较值都为false

null == undefined // true
null == '' // false
null == 0 // false
null == false // false
undefined == '' // false
undefined == 0 // false
undefined == false // false

规则 5:原始类型引用类型做比较时,引用类型会依照ToPrimitive规则转换为原始类型。

ToPrimitive规则,是引用类型向原始类型转变的规则,它遵循先valueOftoString的模式期望得到一个原始类型。

如果还是没法得到一个原始类型,就会抛出 TypeError

'[object Object]' == {} 
// true, 对象和字符串比较,对象通过 toString 得到一个基本类型值
'1,2,3' == [1, 2, 3] 
// true, 同上  [1, 2, 3]通过 toString 得到一个基本类型值