09-内置对象扩展:Set数据结构
千古壹号
# Set 数据结构
# Set 数据结构的介绍
ES6 提供了 新的数据结构 Set。Set 类似于数组,但成员的值都是唯一的,没有重复的值。
Set 的应用有很多。比如,在 H5 页面的搜索功能里,用户可能会多次搜索重复的关键字;但是在数据存储上,不需要存储重复的关键字。此时,我们就可以用 Set 来存储用户的搜索记录,Set 内部会自动判断值是否重复,如果重复,则不会进行存储,十分方便。
# 生成 Set 数据结构
Set 本身就是一个构造函数,可通过 new Set()
生成一个 Set 的实例。
举例 1:
const set1 = new Set();
console.log(set1.size); // 打印结果:0
1
2
2
举例 2、可以接收一个数组作为参数,实现数组去重:
const set2 = new Set(['张三', '李四', '王五', '张三']); // 注意,这个数组里有重复的值
// 注意,这里的 set2 并不是数组,而是一个单纯的 Set 数据结构
console.log(set2); // {"张三", "李四", "王五"}
// 通过扩展运算符,拿到 set 中的元素(用逗号分隔的序列)
// ...set2 // "张三", "李四", "王五"
// 注意,到这一步,才获取到了真正的数组
console.log([...set2]); // ["张三", "李四", "王五"]
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
注意上方的第一行代码,虽然参数里传递的是数组结构,但拿到的 set2
不是数组结构,而是 Set 结构,而且里面元素是去重了的。通过 [...set2]
就可以拿到set2
对应的数组。