本文摘自PHP中文网,作者青灯夜游,侵删。

我确信有很多开发人员坚持使用基本的全局对象:数字,字符串,对象,数组和布尔值。对于许多用例,这些都是需要的。 但是如果想让你的代码尽可能快速和可扩展,那么这些基本类型并不总是足够好。
在本文中,我们将讨论JS 中Set
对象如何让代码更快―?特别扩展性方便。 Array
和Set
工作方式存在大量的交叉。但是使用Set
会比Array
在代码运行速度更有优势。
Set 有何不同
最根本的区别是数组是一个索引集合,这说明数组中的数据值按索引排序。
1 2 3 |
|
相比之下,set
是一个键的集合。set
不使用索引,而是使用键对数据排序。set
中的元素按插入顺序是可迭代的,它不能包含任何重复的数据。换句话说,set
中的每一项都必须是惟一的。
主要的好处是什么
set
相对于数组有几个优势,特别是在运行时间方面:
- 查看元素:使用
indexOf()
或includes()
检查数组中的项是否存在是比较慢的。 - 删除元素:在
Set
中,可以根据每项的的value
来删除该项。在数组中,等价的方法是使用基于元素的索引的splice()
。与前一点一样,依赖于索引的速度很慢。 - 保存 NaN:不能使用
indexOf()
或includes()
来查找值NaN
,而Set
可以保存此值。 - 删除重复项:
Set
对象只存储惟一的值,如果不想有重复项存在,相对于数组的一个显著优势,因为数组需要额外的代码来处理重复。
时间复杂度?
数组用来搜索元素的方法时间复杂度为0(N)
。换句话说,运行时间的增长速度与数据大小的增长速度相同。
相比之下,Set
用于搜索、删除和插入元素的方法的时间复杂度都只有O(1)
,这意味着数据的大小实际上与这些方法的运行时间无关。
Set 究竟有多快?
虽然运行时间可能会有很大差异,具体取决于所使用的系统,所提供数据的大小以及其他变量,但我希望我的测试结果能够让你真实地了解Set
的速度。 我将分享三个简单的测试和我得到的结果。
准备测试
在运行任何测试之前,创建一个数组和一个 Set,每个数组和 Set 都有100万个元素。为了简单起见,我从0
开始,一直数到999999
。
1 2 3 4 5 |
|
测试1:查找元素
我们搜索数字123123
1 2 3 4 5 6 7 |
|
- Array: 0.173ms
- Set: 0.023ms
Set
速度快了7.54
倍
测试2:添加元素
1 2 3 4 5 6 |
|
- Array: 0.018ms
- Set: 0.003ms
Set
速度快了6.73
倍
测试3:删除元素
最后,删除一个元素,由于数组没有内置方法,首先先创建一个辅助函数:
1 2 3 4 |
|
这是测试的代码:
相关阅读 >>
javascript中var、let和const之间有什么区别?
更多相关阅读请进入《javascript》频道 >>

Vue.js 设计与实现 基于Vue.js 3 深入解析Vue.js 设计细节
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者