首页 > web前端 > js教程 > 为什么 Set.has() 查找项目比 Array.includes() 更快

为什么 Set.has() 查找项目比 Array.includes() 更快

Susan Sarandon
发布: 2024-11-06 06:09:03
原创
476 人浏览过

Why Set.has() is Faster Than Array.includes() 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() 如果:

  • 您的数据集很小,性能差异可以忽略不计。
  • 您只需检查某个项目一次或几次,因此创建 Set 没有任何好处。
  • 您正在处理重复项,这是集合无法处理的。

示例用例

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

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 也有助于保持事情的高效性和可预测性。另外,如果阻止的单词列表增长,您就已经拥有了一个可扩展的解决方案。

要点

  • 性能:Set.has() 提供 O(1) 时间复杂度,对于较大的集合来说,它比 Array.includes() (O(n)) 快得多

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

  • 可扩展性:随着数据的增长,Set.has() 继续表现良好,而 Array.includes() 会变慢。

最后的想法

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

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

以上是为什么 Set.has() 查找项目比 Array.includes() 更快的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:dev.to
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板