背景
某天,开开心心准备下班,想着等会是来份烧烤还是关东煮,来抚慰一下忙碌一天的身体,突然:
- QA:不准走,有个bug,页面数值这里显示null了!
- 我:不可能,我特意处理了!
- QA:咯,你自己看!
- 我:哇哦!还真是!
满脸疑惑的我,又打开了电脑,开始逐一排查:
- 看了看代码,null值确实处理了啊
- 瞅了瞅提交记录,代码也push了啊
- 翻了翻部署流水线,测试环境已经部署了啊
- 清了清浏览器缓存,bug还稳定复现啊
摸了摸我还不太高的发际线,告诉自己,遇事不要慌,什么大场面没见过。
问题
查看接口请求,确实给我返回个null
;又看了看代码,难道是处理方法错了?
// 出现bug的代码
<span v-if="num >= 0">{{ num }}</span>
在控制台调试了一下我写的判断条件,惊呆了!好家伙,null
居然在我眼皮子底下通关了
null >= 0 // true
于是我不死心,又试了试
null == 0 // false
null > 0 // false
这下我就更疑惑了,两个false
合在一起怎么就变成true
,难道这就是传说中的负负得正
!
问题依然没有那么简单
隐式转换?脑海中莫名浮现一个名词。对对对
Number(null) // 0
啊,这就说得通null >= 0
的结果是true
了。但是,又说不通null == 0
的结果是false
了。
以我以往学习的知识看来,null == 0
也会进行隐式转换啊。
查阅资料后才发现,并非如此,null
与0
相比较,会直接返回false
,而不会进行隐式转换
参考:非严格相等判断
但在null >= 0
中,null
会被隐式转换Number(null)
,然后再与0
比较
参考:大于或等于判断