隐式类型转换

类型系统按照「是否允许隐式类型转换」来分类,可以分为强类型和弱类型。TypeScript 是弱类型。

数学运算符中的类型转换

由于JS并没有类型声明,所以任意两个变量或字面量,都可以做加减乘除。

1. 减、乘、除

我们在对各种非 Number 类型运用数学运算符 (减、乘、除)时,会先将非 Number 类型转换为 Number 类型。

1 - true // 0, 首先把 true 转换为数字 1, 然后执行 1 - 1
1 - null // 1,  首先把 null 转换为数字 0, 然后执行 1 - 0
1 * undefined //  NaN, undefined 转换为数字是 NaN
2 * ['5'] //  10, ['5']首先会变成 '5', 然后再变成数字 5

2. 加法的特殊性

加法要区别对待,因为JS中的+还可以用来拼接字符串。

  • 当一侧为 String 类型,会被识别为字符串拼接,并会优先将另一侧转换为字符串类型。
  • 当一侧为 Number 类型,另一侧为原始类型,会将原始类型转换为 Number 类型。
  • 当一侧为 Number 类型,另一侧为引用类型,将引用类型和 Number 类型转换成字符串后拼接。
123 + '123' // 123123   (规则1)
123 + null  // 123    (规则2)
123 + true // 124    (规则2)
123 + {}  // 123[object Object]    (规则3)

逻辑语句中的类型转换

当我们使用 if while for 语句时,我们期望表达式是一个 Boolean,所以一定伴随着隐式类型转换。

1. 单个变量

如果只有单个变量,会先将变量转换为 Boolean 值。

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

2. 使用 == 比较中的 5 条规则

    1. NaN 和其他任何类型相比 永远返回 FALSE (包括和他自己)
NaN == NaN // false
NaN === NaN // false
    1. 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,同上
    1. String 和 Number 比较,先将 String 转换为 Number 类型。
123 == '123' // true, '123' 会先变成 123
'' == 0 // true, '' 会首先变成 0
    1. null == undefined 比较结果为 true,除此之外,null、undefined 和其他任何结果的比较值都为 FALSE。
null == undefined // true
null == '' // false
null == 0 // false
null == false // false
undefined == '' // false
undefined == 0 // false
undefined == false // false
    1. 原始类型和引用类型做比较时,引用类型会依照 ToPrimitive 规则转换为原始类型。

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

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

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

练习

  1. [] == ![]
    - 第一步,![] 会变成 false
    - 第二步,应用 规则2 ,题目变成: [] == 0
    - 第三步,应用 规则5 ,[]的valueOf是0,题目变成: 0 == 0
    - 所以, 答案是 true !//
  1. [undefined] == false
    - 第一步,应用 规则5 ,[undefined]通过toString变成 '',
      题目变成  '' == false
    - 第二步,应用 规则2 ,题目变成  '' == 0
    - 第三步,应用 规则3 ,题目变成  0 == 0
    - 所以, 答案是 true !
    // 但是 if([undefined]) 又是个true!

附录:类型转换表



https://chinese.freecodecamp.org/news/javascript-implicit-type-conversion/

你可能感兴趣的:(隐式类型转换)