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

有时，在构建应用程序时，性能最终成为关键或至少是重要的驱动因素，特别是在处理大型数据集或实时要求时。 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中文网其他相关文章！