Set 是我在JavaScript中最喜欢的内置对象类型之一。今天我将介绍 对象并讨论它的一些使用情况。Set
集合对象
Set 对象是一个值的集合,你可以在其中存储唯一的原始值或对象引用。唯一性是这里的关键--没有原始值或对象引用会被多次添加。
如何使用集合
要使用集合,你要创建一个新的实例。
const mySet = new Set();
我们现在有一个空集合。我们可以通过使用add 方法向这个集合添加数字1 。
mySet.add(1);
我们怎么知道我们已经添加了1 ?我们可以使用has 方法来检查。
console.log(mySet.has(1));
// true
现在让我们添加一个对象引用,然后检查我们的Set 中是否有这个对象。
const obj = { name: 'Daffodil' };
mySet.add(obj);
console.log(mySet.has(obj));
// true
记住,比较的是对象引用,而不是对象键本身。换句话说。
console.log(mySet.has({ name: 'Daffodil' }));
// false
我们可以通过size 属性看到Set 中有多少个元素。
console.log(mySet.size);
// 2
接下来,让我们使用delete 方法删除一个值。
mySet.delete(1);
console.log(mySet.has(1));
// false
最后,我们将使用clear 方法来清除Set 。
mySet.clear();
console.log(mySet.size);
// 0
遍历一个集合
遍历一个Set 的最简单方法是使用forEach 方法。
new Set([1, 2, 3]).forEach((el) => {
console.log(el * 2);
});
// 2 4 6
Set 对象也有 、 和 方法,它们都返回entries keys values 迭代器。这些都超出了本教程的范围。
在野外使用集合
我发现Set 对象对于跟踪与一个对象相关的二进制状态来说真的很不错。一个很好的例子是一个手风琴菜单:菜单中的每个项目要么是打开的,要么是关闭的。我们可以创建一个名为isOpen 的Set ,跟踪手风琴项目的打开状态,并创建一个toggle 函数来切换打开状态。
const isOpen = new Set();
function toggle(menuItem) {
if (isOpen.has(menuItem)) {
isOpen.delete(menuItem);
} else {
isOpen.add(menuItem);
}
}
效率的说明
你可能在想,Set 对象似乎与数组非常相似。然而,有一个很大的区别,可能会对你的应用程序产生性能影响。Set 对象被要求使用哈希表(或具有类似哈希表效率的方法)来实现[1]。
当你在一个数组中存储东西时,你可能需要遍历整个数组来找到这个项目。然而,使用Set ,查找是瞬间的。实际上,在大多数情况下,其性能可以忽略不计,但如果你发现自己必须跟踪大量的项目,那么你就应该记住这一点。
结语
我希望这能帮助你理解Set 对象,而且你现在在你的JavaScript工具箱里有了一个新的工具