JavaScript 作为一个动态编程语言,其中的数据类型会随着程序运行而动态改变。对于很多人来说,强制类型转换很容易造成程序出错,而要记住所有的转换方式又是一件不那么容易的事情。比如下面这张 JavaScript 真值表
类型转换发生在静态类型语言的编译阶段,而强制类型转换则发生在动态类型语言运行时。
JavaScript 提供了一系列强制类型转换的方法
var str = String(10); // "10"
var num = Number('10'); // 10
var bool = Boolean('1'); // true
还有下面这种强制类型转换,就不那么明显了
var a = 10 + ''; // "10"
接下来介绍的就是第二种强制类型转换,只有了解这些转换的规则,就能够避免很多强制类型转换的“坑”。
首先,我们先来了解下 == 和 === 的区别,== 和 === 都是等性操作符,而 == 表示相等,而 === 表示完全相等。== 会强制转换两个值的类型来比较,而 === 不会。
接下来我们来看一组比较特殊的数值,undefined 和 null,它们的名字既是类型也是值。
undefined == null; // true
undefined === null; // false
可以看到 undefined 和 null 在 == 下面会返回 true,那是因为 == 只会比较值,而不会比较其中的类型。
在 === 中,也会有特殊情况,比如 0 和 NaN。
NaN === NaN; // false
+0 === -0; // true
在 ES6 中,提供了 Object.is 方法来更好的处理两个值相等的情况
Object.is(NaN, NaN); // true
Object.is(+0, -0); // false
除了上面的值以外,还有字符串、数字、布尔型之间的相等转换规则:
- 字符串与数字比较,会转换字符串为数字
- 布尔型与其他类型比较,会转换成数字
- 数字与字符串与对象比较,都会转换成对象
在下面的强制转换中,根据 ToBoolean 规则,它会进行布尔值的强制类型转换,所以 ![] 变成了 false,而 [] == false,所以就会返回 true。
[] == ![] // true
之后再来看一个栗子
[] + {}; // "[Object Object]"
{} + [] // 0
第一行代码中,{} 会被当成一个值([object, Object])来处理,而 [] 会转换为 “”。而第二行代码中,{} 被当做一个空的代码块,而 [] 被强制转换为了 0,所以才会出现上面这样的情况。
在平常的习惯中,我们应该尽可能的使用 === 而不是 ==。同时,可以选择使用 typeof 或者 ts 来避免强制类型转换的错误。
感谢阅读!