JavaScript不完美亦可运行-数组对象相加问题

351 阅读2分钟

这是我参与11月更文挑战的第5天,活动详情查看:2021最后一次更文挑战

前文学习了几个 JavaScript 并不完美但是不影响其运行的神奇"bug", 本文继续来学习 JavaScript 其他的一些迷之神奇 bug

JavaScript 不完美亦可运行

JavaScript 其他的一些迷之神奇 bug. 先上代码, 来看第一个:

两个空数组相等吗

使用 == 比较两个空数组:

[] == []
[] == ![]

两个空数组不相等

对于第一行 [] == [] // false, 挺好理解的: 两个空数组并不是同一个对象, 所以不相等.

而第二行竟然可以让 r非r 相等, 太不可思议了. 这就是 JavaScript 中的 迷之神奇的 "bug", 为什么呢? :

我们知道 空数组是一个对象, 空数组也是 幻真的. [] 为真, 则 ![]为假false. 在使用 == 双等号时, 会对两个比较的值进行类型转换.

所以 == 首先会将 []false 进行类型转换, 转换为数值然后再进行比较. 但是实际上 [] 为真, 两者实际上都不是数值类型.

使用 == 的转换逻辑: 空数组[]会被强制类型转换为空字符串, 空字符串再被强制类型转换为 0. 同样 false 也会被转换为 0, 所以 0 == 0, 第二行为真输出 true

空数组和空对象 两两相加运算问题

  1. 上代码: 先不看答案猜一猜
[] + []
[] + {}
{} + []
{} + {}

对于第一行 [] + [], (如果按照上面的 == 的转换规则, 其结果应该是 0, 但是输出结果却是空字符串 ''! 但是在第一次转换后为 两个空字符串相加(这里为拼接)为空字符串"")

其实是: +作为拼接, 第一步就是类型转换, 将操作数转换为字符串, 这里的 []是通过 Array.prototype.toString()方法将 [] 转换为空字符串. 而这个方法将对象 {} 转换成了 "[object Object]", 然后就有了下面的答案, 如下图

对于其他的可自行探索学习,

  1. 来看下答案吧:

image