新网创想网站建设,新征程启航
为企业提供网站建设、域名注册、服务器等服务
本篇文章给大家分享的是有关怎样使用JavaScript Set集合更快地编写代码,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。
创新互联是专业的海州网站建设公司,海州接单;提供网站设计制作、网站建设,网页设计,网站设计,建网站,PHP网站建设等专业做网站服务;采用PHP框架,可快速的进行海州网站开发网页制作和功能扩展;专业做搜索引擎喜爱的网站,专业的做网站团队,希望更多企业前来合作!
我敢肯定,有很多开发人员坚持使用基本的全局对象:number,string,object,array和boolean值。
对于许多用例,这些都是你所需要的。但是,如果你想使代码尽可能快和可扩展,那么这些基本类型并不总是足够好。
数组可以执行的操作与Set可以执行的操作之间存在大量的交叉。使用Set往往会带来数组无法实现的运行时优势。在这篇文章中,我们将探讨如何做到这一点。
Set有何不同?
最根本的区别是数组是索引集合,这意味着数组中的数据值由索引排序。
const arr = [A, B, C, D]; console.log(arr.indexOf(A)); // Result: 0 console.log(arr.indexOf(C)); // Result: 2
相比之下,Set是一个键控集合。 Set使用键对数据进行排序,而不是使用索引。Set的元素可以按插入顺序进行迭代,并且不能包含任何重复数据。换句话说,集合中的每个项目都必须是唯一的。
主要好处是什么?
直接比较,Set集合比数组具有多个优点,特别是在运行时间上更快:
搜索项目:使用 indexOf() 或 includes() 检查数组中是否存在某项比较慢。
删除项目:在Set集合中,可以按项目的值删除项目。在数组中,等效项是根据元素的索引使用 splice()。与上一点一样,依赖索引的速度很慢。
插入项目:与使用 push(),unshift() 或等效方法将项目添加到数组相比,将项目添加到Set更快。
储存NaN:你不能使用 indexOf() 或 include() 来查找值 NaN,而Set可以存储该值。
删除重复项:Set对象仅存储唯一值。如果要避免存储重复项,则这是优于数组的显着优势,在数组中,需要附加代码来处理重复项。
时间的复杂度是多少?
数组用于搜索项目的方法的线性时间复杂度为O(N)。换句话说,运行时间以与数据大小增加相同的速率增加。
相比之下,Set用于搜索,删除和插入项目的方法的时间复杂度仅为O(1)——这意味着数据的大小实际上与这些方法的运行时间无关!
Set集合的速度究竟快多少?
尽管运行时间可能会因所使用的系统,所提供数据的大小和其他变量而有很大不同,但我希望我的测试结果能使你对Set的运行速度有实际的了解。我将分享我做的三个简单测试和获得的结果。
1. 准备测试
在运行任何测试之前,让我们创建一个数组和一个Set,每个数组具有一百万个条目。为简单起见,我将从0开始,一直到999,999。
let arr = [], set = new Set(), n = 1000000; for (let i = 0; i < n; i++) { arr.push(i); set.add(i); }
2. 测试一:搜索项目
首先,让我们搜索数字 123123,我们知道它将返回true。
let result; console.time('Array'); result = arr.indexOf(123123) !== -1; console.timeEnd('Array'); console.time('Set'); result = set.has(123123); console.timeEnd('Set');
结果:Array: 0.173ms,set: 0.023ms,set的速度快了7.54倍。
3. 测试二:添加项目
现在,让我们向每个集合中添加一个新项目。
console.time('Array'); arr.push(n); console.timeEnd('Array'); console.time('Set'); set.add(n); console.timeEnd('Set');
结果:Array: 0.018ms,set: 0.003ms,set速度提高了6.73倍。
4. 测试三:删除项目
最后,让我们从每个集合中删除一个项目(我们可以使用刚刚添加的项目)。没有内置的数组方法,因此我们将创建一个辅助函数以保持所有内容的整洁:
const deleteFromArr = (arr, item) => { let index = arr.indexOf(item); return index !== -1 && arr.splice(index, 1); };
这是测试的代码:
console.time('Array'); deleteFromArr(arr, n); console.timeEnd('Array'); console.time('Set'); set.delete(n); console.timeEnd('Set');
结果:Array: 1.122ms,set: 0.015ms,在这个例子中,Set的速度是惊人的74.13倍!
总的来说,我们可以看到,使用Set而不是数组可以极大地改善运行时。现在让我们来看看一些实际的例子,在这些例子中,Set集合是有用的。
案例1:从数组中删除重复的值
如果要快速从数组中删除重复的值,可以将其转换为Set。到目前为止,这是过滤唯一值的最简洁的方法:
const duplicateCollection = ['A', 'B', 'B', 'C', 'D', 'B', 'C']; // 如果要将数组变成Set集合 let uniqueCollection = new Set(duplicateCollection); console.log(uniqueCollection) // Result: Set(4) {"A", "B", "C", "D"} // 如果你想将值保留在数组中 let uniqueCollection = [...new Set(duplicateCollection)]; console.log(uniqueCollection) // Result: ["A", "B", "C", "D"]
案例2:一个Google面试问题
给定一个无序的整数数组和一个值 sum,如果可以相加任何两个项目以使它们等于 sum 的值,则返回 true。否则,返回false。
因此,如果给定数组 [3,5,1,4] 和值 9,则我们的函数应返回 true,因为 4 + 5 = 9。
解决这个问题的一种很好的方法是遍历数组,同时创建一组Set。
让我们将这种想法应用于上面的示例。当我们遇到 3 时,可以将 6 加到我们的Set中,因为我们知道我们需要找到一个 9 的和。然后,每次我们接触数组中的新值时,我们都可以检查它是否在我们的Set中。当我们到了 5 ,我们就会把 4 加入到我们的Set中。然后,当我们最终遇到 4 时,我们也会在我们的Set中找到它,所以我们可以返回 true。
该解决方案可能如下所示:
const findSum = (arr, val) => { let searchValues = new Set(); searchValues.add(val - arr[0]); for (let i = 1, length = arr.length; i < length; i++) { let searchVal = val - arr[i]; if (searchValues.has(arr[i])) { return true; } else { searchValues.add(searchVal); } }; return false; };
这是一个更简洁的版本:
const findSum = (arr, sum) => arr.some((set => n => set.has(n) || !set.add(sum - n))(new Set));
因为Set.prototype.has() 的时间复杂度仅为O(1),所以使用Set来存储而不是数组可以帮助我们整体解决方案获得线性运行时间O(N)。
如果我们改为依赖 Array.prototype.indexOf() 或 Array.prototype.includes() ,它们的时间复杂度均为O(N),则总运行时间将为O(N²),慢得多!
如果你以前从未接触过JavaScript Set,希望我已经展示了它们的实用性!
以上就是怎样使用JavaScript Set集合更快地编写代码,小编相信有部分知识点可能是我们日常工作会见到或用到的。希望你能通过这篇文章学到更多知识。更多详情敬请关注创新互联行业资讯频道。