JS中if(xx)和==判断的类型转换规则

2018-08-02 本文已影响0人贪睡de狮子

在js里面，在使用if语句的时候，我们都知道，使用严格相等运算符===来进行条件判断，但是在日常工作中，我们可能经常会碰到这种代码：

if(xxx){
...
}

或者是

if(xxx==0){
...
}

那么这种情况下，if里面的条件是否成立，看起来就要花费一番心思了，而且有的时候的结果可能并非符合直觉。接下来就来解密一下当遇到上面两种情况时，条件到底何时能够成立呢

if(xxx)的情况

以下几个场景的结果分别是多少？

if ("hello") {
    console.log("hello")
}

if ("") {
    console.log('empty')
}

if (" ") {
    console.log('blank')
}

if ([0]) {
    console.log('array')
}

if('0.00'){
  console.log('0.00')
}

如果没有了解一定的规则，只凭直觉来判断的话，以上的代码很难估计出正确的结果。但是我们可以了解if(xxx)判断的规则后再去看，那么结果可能就显而易见了
对于if括号里的表达式，会被强制转换为布尔类型，而转换的规则如下

类型	结果
Undefined	false
Null	false
Boolean	直接判断
Number	+0, −0, 或者 NaN 为 false, 其他为 true
String	空字符串为 false,其他都为 true
Object	true

有了这个规则之后，再回头去看上面的问题，不难得出结果，分别为：
true false true true true

xxx==xx的情况
类似的，我们来看看不同类型的值使用==比较的结果
有如下问题

!" " == false
"0" == false  
"00" == false  
"0.00" == false  
undefined == null 
{} == true  
[] == true 
var obj = { 
  a: 0, 
  valueOf: function(){return 1} 
} 
obj == "[object Object]"
obj == 1 
obj == true

下表为==相等运算符的转换规则

x	y	结果
null	undefined	true
Number	String	x == toNumber(y)
Boolean	(any)	toNumber(x) == y
Object	String or Number	toPrimitive(x) == y
otherwise	otherwise	false

toNumber

type	Result
Undefined	NaN
Null	0
Boolean	ture -> 1, false -> 0
String	“abc” -> NaN, “123” -> 123

toPrimitive
对于 Object 类型，先尝试调用 .valueOf 方法获取结果。如果没定义，再尝试调用 .toString方法获取结果

从上方表格可以看出，当数字和字符串比较时，会将字符串转换为数字，而对象和字符串做比较时，会调用对象的valueOf或toString方法进行转换
因此上面的答案分别为
true
true
true
true
true
false
false
fasle
true
true

总结
虽然我们了解了上述两种情况的类型转换规则，但是在日常工作中还是建议使用规范的if(xxx===xx)的严格相等运算符的格式，否则可能会带来意想不到的副作用，也会给团队其他成员带来理解上的困扰

JS中if(xx)和==判断的类型转换规则

猜你喜欢

热点阅读