全文共3313字，预计学习时长10分钟
图源：Unsplash
Set(集合)对象类型于2015年在ECMAScript*规范中提出，可以在 Node.js和大部分浏览器中使用。
*ECMA是EuropeanComputer Manufacturers Association的缩写。
即欧洲计算机制造商协会，是制定信息传输与通讯的国际化标准组织。
ECMAScript是ECMA制定的标准化脚本语言。
集合和数组很像，但是还是存在一定差别。
本文旨在探讨这些差异，以及区别两者的不同用法。下面正式开始。
新概念，集合
集合是ES6中非常特殊的对象类型。创建一个如下的空集合：
const characters =new Set()
可以在集合的构造函数里传递iterable来填充它。iterable就是一种可以循环访问的对象，比如 Array(数组)或 String(字符串)。
const characters =new Set(['Rod', 'Todd', 'Sherri', 'Terri'])
值得信赖的主力，数组
数组是大多数JavaScript应用程序的主要板块，不论新旧。如果你以前编写过JavaScript，应该会对此比较熟悉。你可以写出类似的数组：
const characters =['Rod', 'Todd', 'Sherri', 'Terri']
所以重点是？
图源：Unsplash
这两种数据类型是相似的，但是要做的事情却略有不同。集合表示一组唯一的项，而数组的应用更为广泛。
有个很好的例子来表示集合，就像大学生的在一个学期的课程。他们可以修一门或多门课程，但是同一学期同一门课他们只能修一次。
const courses = newSet(['English', 'Science', 'Lego Robotics'])
const cards = [
'Machop',
'Diglett',
'Charmeleon',
'Machop',
'Squirtle'
]
另一方面，一组宝可梦卡牌就不是用于形容集合的好例子，因为这里面有重复。这种情况，用数组可以更好的表示数据。
const cards = [
'Machop',
'Diglett',
'Charmeleon',
'Machop',
'Squirtle'
]
重复的部分可以传输到集合中，但是他们不会被存入。将下面的代码复制到你的浏览器控制台，自己看看：
new Set([
'Machop',
'Diglett',
'Charmeleon',
'Machop',
'Squirtle'
])// Set(4) {"Machop", "Diglett", "Charmeleon","Squirtle"}
传递到集合的数组包括两个Machop，但是集合里只保留一份副本。这种行为非常微妙，但是很有用。
这有什么用？
假设你正在开发一个博客，想要添加一个功能，允许访问者搜索符合一个或多个类别匹配的文章。每个类别只使用一次。
如果你使用数组来代表活动类别列表，你就需要注意避免重复。这可以通过检查没添加类别的列表来实现。
类函数indexOf或includes可以应用于此：
// If our list doesnot include the category
if (!list.includes(category)) {
// Then add the new category to thelist
list.push(category)
}
我曾经发现自己一直在编写这类的代码，但是集合可以自动处理这些问题。你可以直接用类函数add，集合将始终独一无二。
// Just add thecategory to the list
// No need to perform any checks in advance!
list.add(category)
将集合转变回数组
我们已经知道，通过将数组传递到集合的构造函数中，数组可以转化为集合，但是集合是如何转化为数组的呢？
一种方法是静态地使用类函数from
const set = newSet(['Casablanca', 'The Wizard of Oz', 'Jaws'])
const arr = Array.from(set)
console.log(arr)// (3) ["Casablanca", "The Wizard of Oz","Jaws"]
ES6延展操作符是另一个选择：
const set = newSet(['Casablanca', 'The Wizard of Oz', 'Jaws'])
const arr = [...set]
console.log(arr)// (3) ["Casablanca", "The Wizard of Oz","Jaws"]
集合不支持诸如map,filter和reduce这些函数式编程方法，因此，将他们转换成数组更方便。
使用集合从数组中删除重复
即使更倾向于在数组中保存数据，集合依旧很有用。从数组中删除重复项的一个简便方法，就是将它转化为集合后再重新转化成数组。
const cards = [
'Machop',
'Diglett',
'Charmeleon',
'Machop',
'Squirtle'
]
const uniqueCards = [...new Set(cards)]
console.log(uniqueCards)// (4) ["Machop", "Diglett","Charmeleon", "Squirtle"]
如何辨别哪些值是唯一的？
图源：Unsplash
目前为止，已经知道集合如何只保留唯一的值，但这些唯一的值是怎么确定的呢？下面来讨论一下。
首先，让3这个值在集合里出现两次：
new Set([1, 2, 3, 4,3])// Set(4) {1, 2, 3, 4}
第二个3消失了。这和我们目前学到的内容是一致的，但是如果把3作为字符串添加会是什么样的呢？
new Set([1, 2, 3, 4,'3'])// Set(5) {1, 2, 3, 4, "3"}
有趣了。认为3和“3”是不同的。如果我们将匹配的数组加入集合会怎么样呢？
new Set([['JessePinkman'], ['Jesse Pinkman']])// Set(4) {['Jesse Pinkman'], ['Jesse Pinkman']}
在这种情况下，集合保留两个具有相同内容的数组。那么对象呢？
new Set([{name: 'RonBurgundy'}, {name: 'Ron Burgundy'}])// Set(2) {{name: 'Ron Burgundy'}, {name:'Ron Burgundy'}}
有匹配键和值的对象字面值，也被认为是不同的......
这该如何解释？
集合使用绝对相等strictequality (===)来确定哪些值是唯一的。这解释了为什么集合同时保留3(数字)和“3”(字符串)的副本。
这同样解释了，为什么数组和对象字面值相同，却被认为是唯一的。JavaScript通过他们的引用来比较对象，而不是他们的内容，而数组至少有特殊类型的对象。
总结
图源：Unsplash
集合为JavaScript开发者提供了新方法表示数据。数组仍然是JavaScript应用程序中通用的主力，集合则主要为了表示唯一的值的集合。
集合和数组之间的转换很容易。你可以使用集合来确保数据保持唯一，然后将其转化为数组，以便使用map、filter和reduce等函数。
集合使用绝对相等来比较值，并确定什么是唯一的。 因为JavaScript通过引用比较对象，数组和对象字面值即使内容相同，也会被认为是唯一的。
本文重点讨论有关集合的概念。现在你应该知道了什么时候该用集合，什么时候用数组更好了吧？
留言点赞关注
我们一起分享AI学习与发展的干货
如转载，请后台留言，遵守转载规范
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
