Map、Set和Object的区别

Set

ES6提供了新的数据结构Set，类似于数组，但成员值是唯一的，没有重复的值

Set本身是一个构造函数(要 new)，用来生成Set数据结构

Set对象允许你储存任何类型的唯一值，无论是原始值或者是对象引用

每个值在 Set 中只能出现一次，因此常用做数组去重

可以接受一个数组作为参数，进行初始化

javascript 复制代码

const s = new Set([1,2,3,4,4,3])
console.log([...s]) // [1,2,3,4]

Set对象的几个常用方法和属性

add() 向 Set 添加新元素
clear() 从 Set 中删除所有元素
delete() 删除由其值指定的元素
has() 如果值存在则返回 true
forEach() 为每个元素调用回调
keys() 返回 Set 对象中值的数组
size 返回元素个数

javascript 复制代码

const s1 = new Set(["a","b","c","d"]);
s1.add("f");//添加f
s1.delete("a");//删除a
console.log(s1.has("b"));//是否含有b，返回布尔值
s1.clear();//全部清除
const ary = [...s1];
console.log(ary);

Set对象的作用

去重

javascript 复制代码

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

求并集(合并两个Set对象)

javascript 复制代码

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

求交集

javascript 复制代码

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

求差集

javascript 复制代码

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}

Map

Map对象保存键值对

Map本身是一个构造函数(要 new)，用来生成Map数据结构

Map对象允许你储存任何类型的作为一个键或一个值

可以接受一个数组作为参数，进行初始化

javascript 复制代码

const map = new Map([['key1','value1'],['key2','value2']])
console.log(map) // {'key1' => 'value1', 'key2' => 'value2'}

// 把对象做为key
const myKey = {dec:'本对象做为map键'};
map.set(myKey, 'myKey的键值'); //  {'key1' => 'value1', 'key2' => 'value2', {...} => 'myKey的键值'}
map.get(myKey); // 'myKey的键值'

Map的几个常用方法

set(key, val) 向Map中添加新元素

get(key) 通过键值查找特定的数值并返回

has(key) 判断Map对象中是否有Key所对应的值，有返回true,否则返回false

delete(key) 通过键值从Map中移除对应的数据

clear() 将这个Map中的所有元素删除

javascript 复制代码

const map = new Map([['key1','value1'],['key2','value2']]);

map.set('myKey', 'myKey的键值'); // {'key1' => 'value1', 'key2' => 'value2', 'mykey' => 'myKey的键值'}
map.get('myKey'); // 'myKey的键值'
map.has('myKey'); // true
map.delete('myKey'); // true
map.clear(); // undefined

keys() 返回键名的遍历器

values() 返回键值的遍历器

entries() 返回键值对的遍历器

forEach() 使用回调函数遍历每个成员

javascript 复制代码

const map = new Map([['a', 11], ['b',  22]])

for (let key of map.keys()) {
  console.log(key)
}
// "a"
// "b"

for (let value of map.values()) {
  console.log(value)
}
// 11
// 22

for (let item of map.entries()) {
  console.log(item)
}
// ["a", 11]
// ["b", 22]

console.log(map.entries===map[Symbol.iterator]);//true
for (let item of map[Symbol.iterator]()) {
    console.log(item)
}
// ["a", 11]
// ["b", 22]

// 或者
for (let [key, value] of map.entries()) {
  console.log(key, value)
}
// "a" 11
// "b" 22

// for...of...遍历map等同于使用map.entries()

for (let [key, value] of map) {
  console.log(key, value)
}
// "a" 11
// "b" 22

map.forEach(item=>{
    console.log(item);
})//11 22

Map与对象的互换

javascript 复制代码

const obj = {}
const map = new Map()
map.set('a', 11)
map.set('b', 22)
for(let [key,value] of map) {
  obj[key] = value
}
console.log(obj) // {a:11, b: 22}

Map和Object的区别

1.Object的key 必须是简单数据类型（整数、字符串、symbol），map的key可以是任何类型

2.Map元素插入顺序是FIFO，object没有

3.Map继承Object

4.Map在存储大量元素的时候性能表现更好

5.写入删除密集的情况应该使用 Map

Map和Set的区别

1.一个Object 的键只能是字符串或者 Symbols，但一个Map 的键可以是任意值

2.Map中的键值是有序的（FIFO 原则），而添加到对象中的键则不是

3.Map的键值对个数可以从 size 属性获取，而 Object 的键值对个数只能手动计算

4.Object 都有自己的原型，原型链上的键名有可能和你自己在对象上的设置的键名产生冲突