在前端开发中，我们经常需要对数组进行处理，其中包括查找某个元素是否在数组中存在。在 ES7 中，新增了一个方法 Array.includes()，可以方便地判断元素是否在数组中存在，但是在处理大规模数据时，该方法的效率并不高。本文将介绍一些高效实现方式，以提高处理大规模数据时的效率。
一、Array.includes() 方法的使用
Array.includes() 方法用于判断一个数组中是否包含某个指定的元素，返回一个布尔值。
const arr = [1, 2, 3, 4, 5]; console.log(arr.includes(3)); // true console.log(arr.includes(6)); // false
二、Array.indexOf() 方法的效率问题
在 ES6 之前，我们通常使用 Array.indexOf() 方法来判断元素是否在数组中存在，该方法返回元素在数组中的索引位置，不存在则返回 -1。
const arr = [1, 2, 3, 4, 5]; console.log(arr.indexOf(3) !== -1); // true console.log(arr.indexOf(6) !== -1); // false
但是在处理大规模数据时，Array.indexOf() 方法的效率并不高，因为该方法需要遍历整个数组，直到找到指定元素或遍历完整个数组才停止。
三、Array.includes() 方法的效率问题
在 ES7 中，新增了 Array.includes() 方法来判断元素是否在数组中存在，该方法的效率相对于 Array.indexOf() 方法有所提高，但是在处理大规模数据时，仍然存在效率问题。
const arr = [1, 2, 3, 4, 5]; console.log(arr.includes(3)); // true console.log(arr.includes(6)); // false
四、高效实现方式
1. 使用 for 循环
使用 for 循环遍历数组，判断元素是否在数组中存在。
-- -------------------- ---- -------
-------- ------------- ----- -
--- ---- - - -- - - ----------- ---- -
-- ------- --- ----- -
------ -----
-
-
------ ------
-
----- --- - --- -- -- -- ---
------------------------- ---- -- ----
------------------------- ---- -- -----该方法的效率比 Array.indexOf() 和 Array.includes() 方法都高，因为在找到指定元素后立即返回。
2. 使用 Set
使用 Set 数据结构，将数组转换为 Set，然后使用 Set.has() 方法来判断元素是否在 Set 中存在。
function includes(arr, item) {
const set = new Set(arr);
return set.has(item);
}
const arr = [1, 2, 3, 4, 5];
console.log(includes(arr, 3)); // true
console.log(includes(arr, 6)); // false该方法的效率比 for 循环方式高，因为 Set.has() 方法的查找效率比 for 循环方式高。
五、总结
在处理大规模数据时，Array.indexOf() 和 Array.includes() 方法的效率都不高，我们可以使用 for 循环或者 Set 数据结构来实现高效的元素查找。其中，使用 Set 数据结构的方式效率更高，建议在处理大规模数据时使用。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65c8717dadd4f0e0ff24396a