数组 indexOf() 与 includes() 的性能取决于浏览器和查找元素位置。

Question

在不同浏览器（Chrome、Firefox）和 needle item 位置（在数组开头、中间、结尾）上，Array.prototype.includes() 和 Array.prototype.indexOf() 是否有任何优势？没有特定于浏览器的信息，也没有特定于数组位置的信息，我不询问 NaN 值。 Array.prototype.includes vs. Array.prototype.indexOf。

- Luther Lisle

---

这个答案中有一个 jsperf，链接在这里。 - Karl Reid

两个函数返回不同的值并且行为略有不同。 - Felix Kling

如果你需要支持旧浏览器（包括任何版本的IE），不要使用 includes。否则，在使代码更清晰且不需要特定索引时可以使用它。这不是一种你期望有任何有意义差别的情况，includes只是避免了显式检查返回值的需要。在算法上，两个选项都没有任何优劣之分（浏览器对其中任何一个的优化随时可能改变），因此应该选择清晰易懂的方式。 - ShadowRanger

可能是Array.prototype.includes vs. Array.prototype.indexOf的重复问题。 - ibrahim mahrir

StackOverflow永远无法为您提供可靠的性能比较信息，因为它随着时间和实现更新而变化。主要的性能差异可能在于.indexOf()操作需要检查每个索引的存在（检测空洞），而.includes()则不需要。但即使如此，也没有任何保证。 - user8897421

Answer 1

我用包含10,000个数字值的数组进行了测试，以下是结果:

Chrome:

- 开头

- includes (22,043,904 ops/sec) - indexOf (136,512,737 ops/sec)

- 中间

- includes (8,361 ops/sec) - indexOf (31,296 ops/sec)

- 结尾

- includes (4,018 ops/sec) - indexOf (95,221 ops/sec)

Firefox:

- 开头

- includes (34,087,623 ops/sec) - indexOf (33,196,839 ops/sec)

- 中间

- includes (84,880 ops/sec) - indexOf (86,612 ops/sec)

- 结尾

- includes (25,253 ops/sec) - indexOf (14,994 ops/sec)

所以，在Chrome中，`indexOf()`在所有位置上的工作速度比`includes()`快得多。

在Firefox中，`indexOf()`和`includes()`的工作方式几乎相似。

- Carl Schultz

---

由于这个答案似乎仍然被阅读并被视为参考，我认为有必要说一下，Chrome 实现的 includes 方法现在已经和 indexOf 方法一样快了。 - Seblor

Answer 2

如果您关心性能，这里有一个JSperf测试，它倾向于表明随着时间的推移，includes()比indexOf更快。 JSperf 在我看来，我更喜欢写if (arr.includes(el)) {} ，因为它比if (arr.indexOf(el) !== -1) {}更清晰易懂且更易维护。

- Johnny Gibby

Answer 3

由于jsperf已经关闭，这里是使用chrome从jsben.ch获取的结果

随机10k字符串 几乎相同

• indexOf: 3,632,773 (100%)
• includes: 3,625,316 (99.79%)

随机10k数组 差异巨大

• indexOf: 3,441,975 (100%)
• includes: 197,796 (5.75%)

- uingtea

Answer 4

这里有一个JSperf用于比较includes和indexOf方法，它们非常接近，但在最新的Chrome浏览器中，includes()方法将比indexOf更快。

我的理解是，并非所有浏览器都支持includes()方法，尽管这个API更易于理解和维护。

- Jim