JavaScript 中的集合

这篇文章最初发表在attacomsian.com/blog上。

集合 (Set) 是 ES6 中的一种特殊对象类型，可用于创建包含唯一值的集合。每个值在集合中只出现一次。集合中存储的值可以是原始类型（字符串、数字、布尔值），也可以是对象（对象字面量、数组）。

初始化集合

您可以使用Set()构造函数来创建一个空集：

const birds = new Set();

或者，你可以将一个可迭代对象（例如数组）传递给构造函数来初始化集合。该可迭代对象中的所有元素都将添加到新集合中：

const birds = new Set(['🐦', '🦉', '🦆', '🦅']);

由于字符串是可迭代的，因此也可以传入它们来创建集合：

const fruits = new Set('🍒🍇🍉🍓🍑');

设置方法

您可以在对象上使用的一些方法Set包括add()、、和：has()sizedelete()clear()

const birds = new Set();

// add items
birds.add('🐦');
birds.add('🦉');
birds.add('🦆');
birds.add('🦅');

// check if item exists
birds.has('🦉'); // true
birds.has('🐥'); // false

// get items count
birds.size; // 4

// delete item
birds.delete('🦆'); // true
birds.delete('🦆'); // false - already deleted

// delete all items
birds.clear();

由于集合只能存储唯一值，因此add()多次使用相同的值调用不会添加新项目：

const birds = new Set();
birds.add('🐦');
birds.add('🐦');
birds.add('🐦');

birds.size; // 1

console.log(birds); // Set(1) {"🐦"}

集合中的对象

我们还可以将不同类型的对象（如对象文字、数组、日期等）放入集合中：

const set = new Set(['🦉', '🌹']);

set.add(['🦉', '🍌']);
set.add({ name: 'John Doe', planet: 'Earth' });
set.add(new Date());

set.forEach(value => {
    console.log(value);
});

// 🦉
// 🌹
// ["🦉", "🍌"]
// {name: "John Doe", planet: "Earth"}
// Thu May 16 2019 12:47:09 GMT+0100

迭代集合

您可以使用forEach()来迭代集合：

const flowers = new Set(['🌷', '🌹', '🌻', '🌸']);

flowers.forEach(flower => {
    console.log(`Hey ${flower}!`)
});

// Hey 🌷!
// Hey 🌹!
// Hey 🌻!
// Hey 🌸!

您还可以使用for...of循环来迭代集合：

for (const flower of flowers) {
    console.log(flower);
}

键和值

集合和Map一样，也具有keys()和方法。唯一的区别是方法是方法的别名。两者都返回一个新的迭代器对象，其值的顺序与添加到集合的顺序相同。我们也可以使用这些方法来迭代集合：values()keys()values()

const fruits = new Set('🍒🍇🍉🍓🍑');

for (const k of fruits.keys()) {
    console.log(k);
}

for (const v of fruits.values()) {
    console.log(v);
}

我们还可以使用迭代器逐个迭代设置值，如下所示：

const fruits = new Set('🍒🍇🍉');
const items = fruits.values();

console.log(items.next()); // {value: "🍒", done: false}
console.log(items.next()); // {value: "🍇", done: false}
console.log(items.next()); // {value: "🍉", done: true}

调用next()会将每个项目作为{value: <value>, done: <boolean>}对象返回，直到迭代器完成，此时doneis true。集合有另一个名为的方法，entries()它也返回一个迭代器，但值重复两次：

const fruits = new Set('🍒🍇🍉');
const items = fruits.entries();

console.log(items.next()); // {value: ["🍒", "🍒"], done: false}

结论

集合是 ES6 中引入的一种新对象类型，可用于创建值的集合。值可以是原始类型或对象，并且在集合中只能出现一次；它在集合中是唯一的。您可以按照值在集合中的插入顺序对其进行迭代。

如果您想了解更多信息，请查看我们关于JavaScript 地图的指南。

✌️ 我撰写有关现代 JavaScript、Node.js、Spring Boot以及所有Web 开发方面的文章。订阅我的新闻通讯，每周获取 Web 开发教程和专业技巧。

喜欢这篇文章吗？ 请在 Twitter 上关注 @attacomsian。你也可以在LinkedIn和DEV上关注我。

文章来源：https://dev.to/attacomsian/sets-in-javascript-2hk7