8. 新增Set

1. Set

Set是 ES6 新增的引用数据类型，类似于数组，但是项（对于对象来说是指针喔~）都是唯一的，可用于数组去重

new Set([1,2,3,2])

// 结构如下
Set(3){
  [[Entries]]:{'0': 1, '1': 2, '2': 3},
  size: 3
}

1. 属性

size: 返回 Set 实例的项数

2. 方法

add(item): 向Set添加某项，并返回自身（意味可以链式调用）
delete(item): 删除某项，返回boolean表示是否删除成功
has(item): 检查是否含有某项，返回boolean
clear(): 清除所有项
[Symbol.iterator](): Set类型预置了迭代器，可以进行迭代操作`for...of`、`...`

示例如下:

let s = new Set([1, 2]).add(3).add(4) // [1,2,3,4]
s.add(5) // [1,2,3,4,5]
s.delete(5) // true,删除成功:[1,2,3,4]
for (let item of s) alert(item) // 1,2,3,4
s.has(1) // true
s.clear() // s.size === 0, true

遍历操作

for...of: 遍历集合每一项
keys(): 返回键名数组
values(): 返回键值数组
entries(): 返回键值对数组
forEach(item=>{ ... }): 使用回调函数遍历每一项

示例如下

const { log } = console

const s = new Set()[(1, 2, 2, 3)].forEach((item) => s.add(item)) // Set(3){1,2,3} 唯一性

for (let item of s) log(item) // 1,2,3
for (let key of s.keys()) log(key) // 1,2,3
for (let val of s.values()) log(val) // 1,2,3
for (let entry of s.entries()) log(entry) // [1,1],[2,2],[3,3]
s.forEach((item) => log(item)) // 1,2,3

3. Set 函数可以接收iterable作为初始化参数

const set = new Set([1, 2, 2, 3])

const set1 = new Set(document.querySelectorAll('div'))
// 等价于
const set1 = new Set()
let divs = document.querySelectorAll('div')
for (let item of divs) set1.add(item)

用 set 来实现数组去重和字符串去重

[...new Set([1,2,2,3])]
[...new Set('abbc')].join('')

☆4. Set 实现交集、并集、差集

let arr1 = [1, 1, 2, 3]
let arr2 = [2, 3, 4]

// 并集
function union(arr1, arr2) {
	return [...new Set([...arr1, ...arr2])]
}
// 交集
function intersect(arr1, arr2) {
	return [...new Set(arr1)].filter((item) => arr2.includes(item))
}
// 差集
function difference(arr1, arr2) {
	return [...new Set(arr1)].filter((item) => !arr2.includes(item))
}