Why Sethas() is Faster Than Arrayincludes() for Finding Items

有时，在构建应用程序时，性能最终成为关键或至少是重要的驱动因素，特别是在处理大型数据集或实时要求时。 JavaScript 中最常见的任务之一是检查集合中是否存在某个值。最常用的两个替代方法是 Array.includes() 和 set.has()。两者都有效，但实际上，set.has() 比 array.includes 效果更好。让我们深入探讨其原因，并决定何时应该使用任一替代方案。

理解 array.includes() 与 set.has()

有两个方法看起来用法相当简单，但实现不同，即 array.includes() 和 set.has()。

array.includes()

includes() 方法检查给定值是否存在于数组中。
它利用了 o(n) 的时间复杂度，使得数组长度越大，检查值所需的时间就越长。
这是因为 array.includes() 从头到尾搜索数组（或直到找到值），数组越大，花费的时间越长。

set.has()

set 的 has() 方法也会检查给定值是否存在，但速度要快得多。
set.has() 依赖于基于哈希表的结构，该结构允许恒定时间查找，或 o(1) 时间复杂度。
与数组不同，集合是为处理唯一值而构建的，因此它内部不会有重复的值，并且具有更多的查找时间。

为什么 set.has() 对于大型数据集更快

当您使用 set.has() 时，javascript 可以通过一次直接操作找到该项目，无论集合中有多少项目。例如，在检查某个值是否在包含一百万的集合中时，set.has() 消耗的时间将与检查十完全相同。

另一方面，array.includes() 从左到右顺序检查每个元素，直到找到感兴趣的项目或到达其末尾。这意味着它的大小越长，检查时间就越长，特别是在项目接近尾部的情况下，而且肯定是当有问题的项目不存在时。

下面是一个详细的例子：

const bigarray = array.from({ length: 1000000 }, (_, i) => i); const bigset = new set(bigarray);  const valuetofind = 999999;  // array.includes (o(n)) - slower for large arrays console.time("array.includes"); bigarray.includes(valuetofind); console.timeend("array.includes");  // set.has (o(1)) - faster for large sets console.time("set.has"); bigset.has(valuetofind); console.timeend("set.has"); 

当您运行此命令时，您会发现 set.has() 在大型数组上的性能远远优于 array.includes()。实际上，这种差异很可能会转化为更流畅的动画、更快的加载时间，甚至更少的服务器资源使用。

何时使用 set.has() 和 array.includes()

这一切都取决于您想要实现的目标。简单总结如下：

• 使用 set.has() 如果： -您正在处理大数据并进行大量查找。

-您正在使用唯一值，例如一组唯一的用户 id，
标签或关键字。

-您不介意将数组转换为
的少量前期成本 设置为尽量减少以后的查找次数。

• 使用 array.includes() 如果： – 你的数据集很小，性能差异是 可以忽略不计。

-您只需检查某个项目一次或几次，因此没有
创建集合的好处。

-您正在处理重复项，这是集合无法处理的。

示例用例

假设您正在实现一个用户搜索功能，根据阻止的单词列表过滤姓名。如果您有数百个被阻止的单词并且经常搜索，则对被阻止的单词使用集合可以使每次搜索检查更快：

const blockedWords = new Set(["spam", "test", "fakeuser", "bot"]); // Small data, but scales well const username = "fakeuser42";  if (blockedWords.has(username)) {   console.log("Username is blocked"); } else {   console.log("Username is allowed"); } 

即使在较小的情况下，set 也有助于保持事情的高效性和可预测性。另外，如果阻止的单词列表增长，您就已经拥有了一个可扩展的解决方案。

要点

• 性能：set.has() 提供 o(1) 时间复杂度，对于较大的集合来说，它比 array.includes() (o(n)) 快得多

• 适用性：集合是为唯一值而设计的，因此它自然地针对查找进行了优化。数组对于重复值更灵活，但在检查是否存在时速度较慢。

• 可扩展性：随着数据的增长，set.has() 继续表现良好，而 array.includes() 会变慢。

最后的想法

在 set.has() 和 array.includes() 之间进行选择时，了解数据集的大小和性质始终很重要。 array.includes() 非常适合小型数据集，但 set.has() 在速度至关重要的情况下是一个宝贵的工具。正确的数据结构可以帮助优化您的 javascript 应用程序，使其更快、更高效，而无需对代码进行重大更改。

因此，每当你发现自己在检查某个东西是否存在时，你应该问自己：这是数组的工作，还是我可以使用集合的力量？正确处理很可能就是您的应用程序所需要的不同。