Set
基本用法
ES6提供了新的数据结构---Set。它类似于数组，但是它的成员值都是唯一的，没有重复。Set本身是一个构造函数，用来生成Set数据结构。
const s = new Set([1,1,2,2,3,3])
for (let i of s) {
console.log(i)
}
// 1 2 3
Set函数可以接受一个数组（或者具有iterable接口的其他数据结构）作为参数，用来初始化，可以实现iterable接口数据去重。
const set = new Set([1,2,3,4,4,5,5])
[...set] // [1,2,3,4,5]
const items = new Set()
[1,2,3,4,5,5,4].forEach(item => {
items.add(item)
})
items.size // 5
注意：NaN是不等于NaN的，但是在set也只能添加一个NaN值
Set实例的属性和方法
Set实例的方法分为两大类：操作方法（用于操作数据）和遍历方法（用于遍历成员）。下面先介绍4个操作方法：
- add(value)：添加某个值，返回Set结构本身
- delete(value)：删除某个值，返回一个布尔值，表示删除是否成功
- has(vlaue)：返回一个布尔值，表示参数是否为Set成员
- clear()：清除所有成员，没有返回值
const s = new Set()
s.add(1).add(2).add(2)
s.size // 2
s.has(1) // true
s.has(2) // true
s.has(3) // false
s.delete(2)
s.has(2) // false
Array.from方法可以将Set结构转为数组，还可以提供数组去重的方法
const items = new Set([1,2,3,4,5,5,4,3])
const arr = Array.from(items)
或者
console.log([...items])
遍历操作
Set结构实例有5个遍历方法
- keys()：返回键名的遍历器
- values()：返回键值的遍历器
- entries()：返回键值对的遍历器
- forEach()：使用回调函数遍历每个成员
- for of：返回键值的遍历器
let set = new Set(['red', 'green', 'blue'])
for (let item of set.keys()) {
console.log(item)
}
// red green blue
for (let item of set.values()) {
console.log(item)
}
// red green blue
for (let item of set.entries()) {
console.log(item)
}
// ['red', 'red']
// ['green', 'green']
// ['blue', 'blue']
set.forEach((item, index) => {
console.log(item)
})
// red green blue
for (let item of set) {
console.log(item)
}
// red green blue
从上面代码我们可以看出，由于Set结构没有键名，只有键值（或者说键名和键值是同一个值），所以keys、values方法的行为完全一致。
遍历的应用
使用Set可以很容易的实现并集、交集和差集。
let a = new Set([1, 2, 3])
let b = new Set([4, 3, 2])
// 并集
let union = new Set([...a, ...b])
union // Set {1, 2, 3, 4}
// 交集
let intersect = new Set([...a].filter(x => b.has(x)))
intersect // Set {2, 3}
// 差集
let difference = new Set([...a].filter(x => !b.has(x)))
difference // Set {1}
WeakSet
WeakSet结构与Set类似，也是不重复的值的集合。但是它与Set有两个区别。
第一、WeakSet的成员只能是对象，而不能是其他类型的值。
第二、WeakSet中的对象都是弱引用，即垃圾回收机制不考虑WeakSet对该对象的引用，如果其他对象都不再引用该对象，那么垃圾回收机制就会自动回收。
语法
WeakSet是一个构造函数，可以接受一个具有iterable接口的对象做为参数，该对象的所有成员都会自动成为WeakSet实例对象的成员。
const a = [[1, 2], [3, 4]]
const ws = new WeakSet(a)
ws // WeakSet {[1, 2], [3, 4]}
const b = [3, 4]
const ws2 = new WeakSet(b)
// 报错
成为WeakSet成员的是a的数组成员，而不是a数组本身，所以a数组的成员必须是对象，不是对象就会报错。
WeakSet结构有以下3个方法
- add(value)：向WeakSet实例添加一个新成员
- delete(value)：清除WeakSet实例的指定成员
- has(value)：返回一个布尔值，表示某个值是否存在WeakSet的实例中
const ws = new WeakSet()
const obj = {}
ws.add(obj)
ws.has(obj) // true
ws.has(foo) // false
ws.delete(obj)
ws.has(obj) // false
WeakSet的一个用处是存储Dom节点，而不用担心这些节点从文档移除时会引发内存泄漏。因为WeakSet对象不被引用时，垃圾回收机制会自动回收，而不需要释放对象，避免了内存泄漏。
WeakSet成员是不适合引用的，因为它会随时消失。另外WeakSet的成员取决于垃圾回收机制有没有运行，而垃圾回收机制何时运行是不可预测的，所以ES6规定WeakSet不可遍历，只能用来存储对象，WeakSet对象不被引用时，垃圾回收机制会自动回收，而不需要释放对象，避免了内存泄漏
Map
含义和基本用法
javascript的对象本质上是键值对的集合（Hash）结构，但是只能用字符串作为键，为了解决这个问题，ES6提供了Map数据结构。它类似于对象，也是键值对集合，但是键的范围不限于字符串，任何数据类型都可以当作键。
const map = new Map()
map.set(['a'], 555)
map.get(['a']) // undefined
const a = new Map()
const k1 = ['a']
a.set(k1, 111)
a.get(k1) // 111
注意：只有对同一个对象的引用，Map结构才将其是为同一个键，这一点要非常小心
实例的属性和操作方法
size属性
- size属性返回Map结构的成员总数
- set(key, value)：set方法设置key所对应的键值，然后返回整个Map结构。如果key已经有值，则键值会被奉新，否则就新生成该键
- get(key, value)：get方法读取key对应的键值，如果找不到则返回undefined
- has(key)：has方法返回一个布尔值，表示某个键是否在Map数据结构中
- delete(key)：delete方法删除某个键
- clear()：clear方法清除所有成员，没有返回值
遍历方法
- keys()：返回键名的遍历器
- values()：返回键值的遍历器
- entries()：返回所有成员的遍历器
- forEach()：遍历Map的所有成员
- for of：遍历Map的所有成员
const map = new Map([
[1, 'one'],
[2, 'two'],
[3, 'three']
])
for (let key of map.key()) {
console.log(key)
}
等同于
[...map.keys()]
// 1 2 3
for (let value of map.values()) {
console.log(value)
}
等同于
[...map.values()]
// one two three
for (let item of map.entries()) {
console.log(item)
}
等同于
for (let [key, value] of map) {
console.log(key, value)
}
等同于
[...map]
// [1, 'one'] [2, 'two'] [3, 'three']
虽然Map是类对象数据结构，但是Map的遍历是有顺序的，就是插入顺序，扩展运算符可以遍历具有iterable接口的数据结构，相当于用for of，当数据结构是一个大数组里面是小数组时，可以使用[key, value]
与其他数据结构的互相转换
Map转为数组
const map = new Map([[true, 7], [foo: 3]])
[...map] // [[true, 7], [foo: 3]]
数组转Map
const arr = [[true, 7], [foo: 3]]
const map = new Map(arr)
Map转为对象
const map = new Map([[true, 7], [foo: 3]])
strMapToObj (map)
function strMapToObj(map) {
let obj = {}
for (let [key, val] of map) {
obj[key] =val
}
}
对象转为Map
function objToMap (obj) {
let map = new Map()
for (let k of Object.keys(obj)) {
map.set(k, obj[k])
}
return map
}
objToMap({yes: true, no: false})
WeakMap
WeakMap结构与Map结构类似，也用于生成键值对的集合。
// WeakMap可以使用set方法添加成员，get获取成员的值
const wm = new WeakMap()
wm.set(foo, 2)
wm.get(foo) // 2
WeakMap与Map的区别有以下两点
第一WeakMap只接受对象作为键名（null除外），不接受其他类型的值作为键名。
第二WeakMap的键名所指向的对象不计入垃圾回收机制
WeakMap设计的目的在于，有时我们想在某个对象上面存放一些数据，但是这会形成对这个对象的引用。
const e1 = document.getElementById('foo')
const arr = {
[e1, 'foo元素']
}
如果不需要这个对象就必须手动删除这个引用，否则垃圾回收机制就不会释放，WeakMap就是为了解决这个问题而诞生的，只要所引用的对象的其他引用都被清除，垃圾回收机制就会释放该对象所占用的内存，不需要手动删除引用，防止内存泄漏。
WeakMap的语法
- set()：向WeakMap设置一个键名
- get()：WeakMap获取对应的键值
- has()：返回一个布尔值，表示某个值是否存在WeakMap的实例中
- delete()：清除WeakMap实例的指定成员
网友评论