Set, WeakSet, Map, WeakMap

[luichooy]

Set

Set 是类数组结构，和数组的区别是，Set 中的元素都是唯一的，不能出现重复元素。

Set 的创建

const s = new Set()

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

Set 构造函数可以接收一个参数，这个参数可以是数组，字符串等一切具有 iterable 接口的其他数据结构

Set 的实例属性

// size
const s = new Set([1,2,3,4,3,2,1])

s.size    // 4

Set 的实例方法

Set 的示例方法有两大类：操作方法和遍历方法

• 操作方法：
  • add
  • delete
  • has
  • clear

const s = new Set()
s.add(1).add(2).add(2)  // Set {1, 2}

s.delete(2) // Set {1}

s.has(2) // false

s.clear()  // Set {}

• 遍历方法
  • keys
  • values
  • entries
  • forEach

keys, values, entries 方法返回的都是遍历器对象

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

for(let key of s.keys()){
  console.log(key)
}
// 1
// 2
// 3

for(let value of s.values()){
  console.log(value)
}
// 1
// 2
// 3

for(let item of s.entries()){
  console.log(item)
}
// [1, 1]
// [2, 2]
// [3, 3]

s.forEach((key,value) => {
  console.log(key + ':' + value)
})
// 1 : 1
// 2 : 2
// 3 : 3

Set 结构的实例默认可遍历，它的默认遍历器生成函数就是它的 values 方法。这意味着，可以省略 values 方法，直接用 for...of 循环遍历 Set

for(let v of s) {
  console.log(v)
}
// 1
// 2
// 3

数组去重

const arr = [1, 2, 3, 4, 3, 2, 1];

// 使用扩展运算符
[...new Set(arr)] // [1, 2, 3, 4]

// 使用Array.from
Array.from(new Set(arr)) // [1, 2, 3, 4]

并集（Union）、交集（Intersect）和差集（Difference）

let a = new Set([1, 2, 3])
let b = new Set([4, 3, 2])

const union = new Set([...a, ...b]) // Set {1, 2, 3, 4}

const  intersect = new Set([...a].filter(x => b.has(x))) // Set {2, 3}

const difference = new Set([...a].filter(x => !b.has(x))) // Set {1}

WeakSet

WeakSet 结构与 Set 类似，也是不重复的值的集合。但是，它与 Set 有两个区别:

• WeakSet 的成员只能是对象，而不能是其他类型的值
• WeakSet 中的对象都是弱引用，即垃圾回收机制不考虑 WeakSet 对该对象的引用，也就是说，如果其他对象都不再引用该对象，那么垃圾回收机制会自动回收该对象所占用的内存，不考虑该对象还存在于 WeakSet 之中

Set 的创建

const ws = new WeakSet()

// WeakSet 可以接受一个数组或类似数组的对象作为参数
const ws = new WeakSet([[1, 2], [3, 4]])
// WeakSet { [1, 2], [3, 4] }

WeakSet 的实例方法

• add
• delete
• has

WeakSet 没有 size 属性，也不可便利

Map

类似于对象，也是键值对的集合，但是“键”的范围不限于字符串，各种类型的值（包括对象）都可以当作键

Map 语法

const m = new Map()
const p = {name: '张三', age: 18}

m.set(p, 'master')
m.get(p) // 'master'

m.has(p) // true
m.delete(p)
m.has(p) // false

任何具有 Iterator 接口、且每个成员都是一个双元素的数组的数据结构都可以当作 Map 构造函数的参数

const m = new Map([
  ['name', '张三'],
  ['title', 'Author']
])

m.size // 2
m.get('name') // '张三'

如果对同一个键多次赋值，后面的值将覆盖前面的值。

如果读取一个未知的键，则返回 undefined。

如果 Map 的键是一个简单类型的值，则只要两个值严格相等，Map 将其视为一个键。NaN 不严格相等于自身，但 Map 将其视为同一个键。

实例属性和方法

• size
• set
• get
• delete
• has
• clear

遍历方法

• keys
• values
• entries
• forEach

const m = new Map([
  ['y', 'yes'],
  ['n', 'no']
])

for(let key of m.keys()) {
  console.log(key)
}
// 'y'
// 'n'

for(let value of m.values()) {
  console.log(value)
}
// 'yes'
// 'no'

for(let item of m.entries()){
  console.log(item)
}

// ['y', 'yes']
// ['n', 'no']

for(let [key, value] of m.entries()) {
  console.log(key + ':' + value)
}
// 'y' : 'yes'
// 'n' : 'no'


//  Map 结构的默认遍历器接口（Symbol.iterator属性），就是entries方法。
for(let [key, value] of m) {
  console.log(key + ':' + value)
}
// 'y' : 'yes'
// 'n' : 'no'

m.forEach((value, key, map) => {
  console.log(value + ' ---> ' + key)
})
// 'yes' ---> 'y'
// 'no' ---> 'n'

使用扩展运算符将 Map 转数组

const m = new Map([
  ['y', 'yes'],
  ['n', 'no']
])

[...m.keys()] // ['y', 'n']

[...m.values()] // ['yes', 'no']

[...m.entries()] // [['y', 'yes'], ['n', 'no']]

[...m] // [['y', 'yes'], ['n', 'no']]

WeakMap

WeakMap 结构与 Map 结构类似，也是用于生成键值对的集合。

WeakMap 与 Map 的区别：

• WeakMap 只接受对象作为键名（null 除外），不接受其他类型的值作为键名

• WeakMap 的键名所指向的对象，不计入垃圾回收机制

• WeakMap 没有遍历操作（即没有 keys()、values()和 entries()方法），也没有 size 属性

• WeakMap 无法清空，即不支持 clear 方法

WeakMap 弱引用的只是键名，而不是键值。键值依然是正常引用

语法

const wm = new WeakMap()
const root = document.getElementById('root')

wm.set(root, 'root Element')

wm.get(root) // 'root Element'

实例方法

• set
• get
• has
• delete