6、ES6的Set和Map

Set和Map主要的应用场景在于数组去重和数据存储。
Set是一种叫做集合的数据结构，Map是一种叫做字典的数据结构。

6.1 Set

• 集合是由一组无序且唯一(即不能重复)的项组成的，可以想象成集合是一个既没有重复元素，也没有顺序概念的数组
• ES6提供了新的数据结构Set。它类似于数组，但是成员的值都是唯一的，没有重复的值
• Set 本身是一个构造函数，用来生成 Set 数据结构

1. Set实例的属性和方法

Set的属性：

• size：返回集合所包含元素的数量

Set的方法：

操作方法

• add(value)：向集合添加一个新的项
• delete(value)：从集合中移除一个值
• has(value)：如果值在集合中存在，返回true,否则false
• clear(): 移除集合里所有的项

const mySet = new Set(['a', 'a', 'b', 1, 2, 1])
console.log(mySet)  // {'a', 'b', 1, 2}
myset.add('c').add({'a': 1})
console.log(mySet) // {'a', 'b', 1, 2, 'c', {a: 1}}
console.log(mySet.size) // 6
 
mySet.has(2) // true

遍历方法

• keys()：返回一个包含集合中所有键的数组
• values()：返回一个包含集合中所有值的数组
• entries：返回一个包含集合中所有键值对的数组
• forEach()：用于对集合成员执行某种操作，没有返回值

const set = new Set(['a', 'b', 'c'])
 
for (let item of set.keys()) {
  console.log(item)
}
// a
// b
// c
 
for (let item of set.values()) {
  console.log(item)
}
// a
// b
// c
 
for (let item of set.entries()) {
  console.log(item)
}
// ["a", "a"]
// ["b", "b"]
// ["c", "c"]
 
// 直接遍历set实例，等同于遍历set实例的values方法
for (let i of set) {
  console.log(i)
}
// a
// b
// c
 
set.forEach((value, key) => console.log(key + ' : ' + value))
// a: a
// b: b
// c: c

2. Set 对象作用

• 数组去重(利用扩展运算符)

const mySet = new Set([1, 2, 3, 4, 4])
[...mySet] // [1, 2, 3, 4]

• 合并两个set对象

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

// 并集  new Set去重
let union = [...new Set(a.concat(b))]
let union = [... new Set([...a], [...b])]

• 交集

let a = new Set([1, 2, 3])
let b = new Set([4, 3, 2])
let intersect = new Set([...a].filter(x => b.has(x)))  //{2, 3} 利用数组的filter方法

• 差集

let a = new Set([1, 2, 3])
let b = new Set([4, 3, 2])
let difference = new Set([...a].filter(x => !b.has(x))) //  {1}

6.2 Map

字典是实现基于ES6中的Map类的结构

集合和字典的区别：

• 共同点：集合、字典可以存储不重复的值
• 不同点：集合是以[值，值]的形式存储元素，字典是以[键，值]的形式存储

• Map其实的主要用途也是用于存储数据的，相比于Object只提供“字符串—值”的对应，Map提供了“值—值”的对应。也就是说如果你需要“键值对”的数据结构，Map比Object更合适

1. Map的属性和方法

Map的属性：

• size：返回字典所包含的元素个数

Map的方法：

操作方法：

• set(key, val): 向字典中添加新元素
• get(key):通过键值查找特定的数值并返回
• has(key):如果键存在字典中返回true,否则false
• delete(key): 通过键值从字典中移除对应的数据
• clear():将这个字典中的所有元素删除

const m1 = new Map([['a', 111], ['b', 222]])
console.log(m1) // {"a" => 111, "b" => 222}
m1.get('a')  // 111
 
const m2 = new Map([['c', 3]])
const m3 = new Map(m2)
m3.get('c') // 3
m3.has('c') // true
m3.set('d', 555)
m3.get('d') // 555

遍历方法：

• keys():将字典中包含的所有键名以数组形式返回
• values():将字典中包含的所有数值以数组形式返回
• forEach()：遍历字典的所有成员

const map = new Map([['a', 1], ['b',  2]])
 
for (let key of map.keys()) {
  console.log(key)
}
// "a"
// "b"
 
for (let value of map.values()) {
  console.log(value)
}
// 1
// 2
 
for (let item of map.entries()) {
  console.log(item)
}
// ["a", 1]
// ["b", 2]
 
// 或者
for (let [key, value] of map.entries()) {
  console.log(key, value)
}
// "a" 1
// "b" 2
 
// for...of...遍历map等同于使用map.entries()
for (let [key, value] of map) {
  console.log(key, value)
}
// "a" 1
// "b" 2