JavaScript中Truthy值与false比较返回true的原因解析

这不是JavaScript的语言bug，本质是对Truthy定义、==抽象相等比较的隐式转换规则存在认知偏差。

关键规则说明 #

• Truthy/Falsy的定义仅适用于布尔上下文：也就是只有当值被放在if判断、Boolean()包装、逻辑非!运算这类明确需要转布尔值的场景时，才会按照Truthy/Falsy规则转换。Truthy仅代表值在布尔上下文会被转为true，不代表值本身和true相等，也不代表它和false比较时一定返回false。
• ==比较不会先把两边转成布尔值：根据ECMAScript标准，==对不同类型值做比较时，有固定的隐式转换优先级：只要比较的任意一侧是布尔值，会先将布尔值转为数字，再执行后续比较。
  • false转数字结果为0，true转数字结果为1，也就是说所有x == false的比较，第一步都会被转换为x == 0，之后再根据x的类型继续转换。

典型场景复现 #

以下值都属于Truthy值（直接放在if判断中会进入true分支），但和false做==比较时会返回true：

'0' == false // true
[] == false  // true
[0] == false // true

转换逻辑拆解：

1. 第一步统一把false转成数字0，比较式变为x == 0
2. 字符串类型的'0'会被转成数字0，和右侧0相等，返回true
3. 数组属于对象类型，会先执行ToPrimitive原始值转换：[]转原始值得到空字符串''，空字符串转数字为0，和右侧0相等，返回true；[0]转原始值得到字符串'0'，转数字为0，同样返回true

避坑建议 #

• 判断值是否为Truthy/Falsy时，直接将值放入布尔上下文即可，不要和true/false做==比较：

  // 正确写法
  if (x) { /* x为Truthy时执行 */ }
  const isTruthy = !!x
  
  // 错误写法，会触发非预期隐式转换
  if (x == true) {}
  if (x == false) {}
  

• 无特殊需求时优先使用===严格相等运算符，比较时不会做任何隐式类型转换，只有两边类型、值完全一致时才返回true，可以规避绝大多数隐式转换带来的反直觉问题。

内容的提问来源于stack exchange，提问作者Jatin Johny