为什么 [NaN].includes(NaN) 在 JavaScript 中返回 true？

Question

我熟悉 NaN 在 JavaScript 中的“怪异”，即 NaN === NaN 总是返回 false，如 here 所述。所以不应该进行===比较来检查NaN，而是使用isNaN(..)。

所以我很惊讶地发现

> [NaN].includes(NaN)
true

这似乎不一致。为什么会有这种行为？

它是如何工作的？ includes 方法是否专门检查isNaN？

Answer 1

据MDN's document这么说

注意：从技术上讲，includes() 使用 sameValueZero 确定是否找到给定元素的算法。

const x = NaN, y = NaN;
console.log(x == y); // false                -> using ‘loose’ equality
console.log(x === y); // false               -> using ‘strict’ equality
console.log([x].indexOf(y)); // -1 (false)   -> using ‘strict’ equality
console.log(Object.is(x, y)); // true        -> using ‘Same-value’ equality
console.log([x].includes(y)); // true        -> using ‘Same-value-zero’ equality

---

更详细的解释：

1. Same-value-zero equality 类似于 same-value equality，但 +0 和 -0 被认为是相等的。
2. 相同值相等由 Object.is() 方法提供：Object.is() 和 === 之间的唯一区别在于它们对有符号零和 NaN 的处理。

---

其他资源：

• Which equals operator (== vs ===) should be used in JavaScript comparisons?
• Array.prototype.includes vs. Array.prototype.indexOf
• Are +0 and -0 the same?

Answer 2

.includes() 方法使用SameValueZero 算法来检查两个值是否相等，它认为NaN 值等于它自己。

SameValueZero 算法类似于SameValue，但唯一的区别是SameValueZero 算法认为+0 和-0 相等。

Object.is() 方法使用 SameValue，它为 NaN 返回 true。

console.log(Object.is(NaN, NaN));

.includes() 方法的行为与.indexOf() 方法略有不同； .indexOf() 方法使用严格相等比较来比较值，并且严格相等比较不认为NaN 与自身相等。

console.log([NaN].indexOf(NaN));

有关不同相等性检查算法的信息可以在 MDN 上找到：

MDN - Equality comparisons and sameness

Answer 3

规格

这似乎是Number::sameValueZero abstract operation 的一部分：

6.1.6.1.15 Number::sameValueZero (x, y)

1. 如果 x 是 NaN 并且 y 是 NaN，则返回 true。

[...]

此操作必须是Array#includes() 检查的一部分：

22.1.3.13 Array.prototype.includes (searchElement [ , fromIndex ] )

[...]

8. 重复，而 k len
   一种。让 elementK 成为 ?获取(O, !ToString(k))。
   湾。如果 SameValueZero(searchElement, elementK) 为 true，则返回 true。
   C。将 k 设置为 k + 1。
9. 返回 false。

[...]

SameValueZero operation 将在第 2 步委派给数字：

7.2.12 SameValueZero (x, y)

[...]

1. 如果 Type(x) 与 Type(y) 不同，则返回 false。
2. 如果 Type(x) 是 Number 或 BigInt，则
   一种。返回 ！类型(x)::sameValueZero(x, y)。
3. 返回！ SameValueNonNumeric(x, y).

为了比较，Array#indexOf() 将使用 Strict Equality Comparison，这就是它表现不同的原因：

const arr = [NaN];
console.log(arr.includes(NaN)); // true
console.log(arr.indexOf(NaN));  // -1

---

其他类似情况

其他使用SameValueZero进行比较的操作在集合和映射中：

const s = new Set();

s.add(NaN);
s.add(NaN);

console.log(s.size);     // 1
console.log(s.has(NaN)); // true

s.delete(NaN);

console.log(s.size);     // 0
console.log(s.has(NaN)); // false

const m = new Map();

m.set(NaN, "hello world");
m.set(NaN, "hello world");

console.log(m.size);     // 1
console.log(m.has(NaN)); // true

m.delete(NaN);

console.log(m.size);     // 0
console.log(m.has(NaN)); // false

---

历史

SameValueZero algorithm first appears in the ECMAScript 6 specifications 但它更冗长。它仍然具有相同的含义，并且仍然具有显式：

7.2.10 SameValueZero(x, y)

[...]

6. 如果 Type(x) 是数字，那么 一种。如果 x 是 NaN 并且 y 是 NaN，则返回 true。 [...]

ECMAScript 5.1 only has a SameValue algorithm 仍将NaN 视为等于NaN。与SameValueZero 的唯一区别在于+0 和-0 的处理方式：SameValue 为它们返回false，而SameValueZero 返回true。

SameValue主要用于内部对象操作，所以对于编写JavaScript代码几乎是无关紧要的。 SameValue 的很多用途是在使用对象键并且没有数值时。

SameValue 操作直接在 ECMAScript 6 中公开，因为这是 Object.is() 使用的：

console.log(Object.is(NaN, NaN)); // true
console.log(Object.is(+0, -0));   // false

比较有趣的是WeakMap 和WeakSet 也使用SameValue 而不是SameValueZero，Map 和Set 用于比较。但是，WeakMap 和 WeakSet 只允许对象作为唯一成员，因此尝试添加 NaN 或 +0 或 -0 或其他原语会导致错误。

Answer 4

在7.2.16 Strict Equality Comparison中，有如下注释：

注意

此算法与 SameValue 算法的不同之处在于它对有符号零和 NaN 的处理。

这意味着Array#includes 的比较函数与严格比较不同：

22.1.3.13 Array.prototype.includes下

注意 3

includes 方法有意在两个方面与类似的 indexOf 方法不同。首先，它使用SameValueZero 算法，而不是Strict Equality Comparison，允许它检测NaN 数组元素。其次，它不会跳过缺失的数组元素，而不是将它们视为undefined。

Answer 5

正如您在阅读 include documentation 时看到的那样，它确实使用 sameValueZero 算法来工作，因此正如它的 documentation 所说，它在比较 NaN 和 I 引用时给出了 True 值：

我们可以从下面的相同性比较表中看到，这是由于 Object.is 处理 NaN 的方式。请注意，如果 Object.is(NaN, NaN) 评估为假，我们可以说它适合松/严格谱，作为三等式的更严格形式，一种区分 -0 和 +0 的形式。然而，NaN 处理意味着这是不真实的。不幸的是，Object.is 必须根据其具体特征来考虑，而不是在相等运算符方面的松散或严格性。