为什么在JavaScript中 [] == ![] 返回 TRUE?

开发 前端
把所有的责任都推给危险的 == 运算符。这只是我们总是告诉JavaScript新手永远不要使用它(真的永远不要)的又一个例子。尤其是如果他们之前一直在使用像C#这样固执且严格的语言编程。

图片图片

这毫无道理。

一个数组怎么可能不是一个数组呢?

图片图片

[] 是真值,而 ![] 应该是 false。

那么 [] 怎么可能等于 false 呢?

而且这种情况似乎并不发生在其他类型上,比如字符串和数字:

图片图片

JavaScript的数组是不是坏了?

这里发生了什么

把所有的责任都推给危险的 == 运算符。

这只是我们总是告诉JavaScript新手永远不要使用它(真的永远不要)的又一个例子。

尤其是如果他们之前一直在使用像C#这样固执且严格的语言编程。

乍一看,== 似乎没有任何问题:

图片图片

图片图片

但现在看看这里发生了什么:

图片图片

但看看在JavaScript中发生了什么:

图片图片

JavaScript自动将字符串转换成了数字!

这是人们对JavaScript的诸多不满之一,这也是TypeScript出现的原因。

图片图片

那么你认为在 [] == ![] 的背后,真正发生了什么?

首先,在JavaScript中空数组是真值,所以 ! 作用于它使其变成 false

图片图片

我们突然发现自己在比较一个 数组 和一个 布尔值。显然不会有好结果。

正如我们现在所知,JS并不在意,所以它就继续进行 — 这次将 布尔值 转换为等价的数字

图片图片

接下来,由于一些你永远不需要知道的垃圾规则,[] 变成了...一个空字符串?

图片图片

最后它将 "" 转换成...一个数字:

图片图片

那么,避免这种荒谬情况的解决方案是什么?

始终使用严格相等运算符 ===。

图片图片

没有任何可以想象的场景是 == 可以使用而 === 不能使用的

现在使用 ===,VS Code编辑器突然活跃起来,阻止我们做类似这样的事情:

图片图片

但之前它是沉睡的:

图片图片

但 [] == [] 呢?

好的,这说得通,但那么什么可以解释这个:

图片图片

肯定不能怪 == 了。它们有相同的类型,不是吗?

是的,它们确实有。

只是JavaScript通过引用比较数组。而不是通过值。

它们可能有完全相同的值,但只要它们不指向内存中的同一个对象,在 == 和 === 看来它们就永远不会相等。

图片图片

对于对象来说一般也是这样:

图片图片

当然,对于我们的核心原始值 — 字符串、数字和布尔值 — 情况并非如此

图片图片

那么,当你想按元素值比较数组时该怎么办?

如果是已排序的,你可以使用 JSON.stringify():

图片图片

否则,你可以使用更通用的 length 和 every() 组合:

图片图片

最后的思考

== 只是JavaScript松散性导致它做出在现实世界中毫无意义的事情的一个例子。

道德教训:始终使用严格相等,使用TypeScript,并优先使用现代特性。

责任编辑:武晓燕 来源: 大迁世界
相关推荐

2024-08-23 08:47:51

2024-08-23 09:14:18

2023-09-19 08:03:01

JavaScriptevery()

2022-12-22 14:32:37

JavaScript编程语言

2023-03-28 08:53:18

操作符数字字符串

2023-08-13 16:17:31

2016-12-22 18:38:49

JavaAndroid

2015-11-23 10:09:30

Java

2016-04-06 11:29:58

JavaScriptDOM操作

2019-08-30 14:58:47

JavaScript程序员编程语言

2022-09-14 09:37:17

JavaScript默认导出

2023-11-08 13:32:00

JavaScript浮点数计算

2021-04-16 17:37:28

数据智能照明物联网

2020-05-26 15:53:01

StraceDocker容器

2020-05-06 22:20:48

Kubernetes边缘计算

2020-08-11 11:51:47

标准物联网IOT

2021-05-30 09:25:48

HttpETag 网络协议

2023-09-20 00:06:30

Python代码函数

2022-07-15 13:43:40

网络安全黑客

2020-08-16 11:29:12

Python函数开发
点赞
收藏

51CTO技术栈公众号