在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)的严格相等运算符的格式，否则可能会带来意想不到的副作用，也会给团队其他成员带来理解上的困扰
网友评论