ES6 3000字详解Map与Set用法

Map与Set是存储数据的两种结构。

1、Map结构。

1-1、Map存储方式。

Map采用(key,value)的方式存储数据，Object对象也是（key,value），两者不同的是Object的key只能是字符串或者Symbol对象,而Map更高级一点，它的key可以是任何类型的值。

1-2、创建一个Map对象。

Map的key类型可以是：Number，String，Boolean，Null，Undefined，Symbol,Array，Function，Object。

let map = new Map(); map.set(1, "number"); map.set("1", "string"); map.set(false, "Boolean"); map.set(null, "null"); map.set(undefined, "Undefined"); map.set(Symbol(), "Symbol"); map.set([1], "数组"); map.set(() => {}, "函数"); map.set({ key: "value" }, "对象");

1-3、Map的特点。

① key值唯一。

map.set(1, "number"); map.set(1, "number"); console.log(map); // Map(1) { 1 => '2' }

② 相同key值会覆盖value。

map.set(1, "1"); map.set(1, "2"); console.log(map); // Map(1) { 1 => '2' }

1-4、Map遍历。

① for …of …

let map = new Map([[1, "one"]]); for (let [key, value] of map) { // 注意：key,value是使用[]包括，不是（） console.log(`key:${key},value:${value}`); // key:1,value:one }

② forEach。

let map = new Map([[1, "one"]]); map.forEach((value, key) => { // 注意这里是(value,key)，不是(key,value) console.log(`key:${key},value:${value}`); // key:1,value:one });

获取key的方法：

for (var key of myMap.keys()) { console.log(key); }

获取value的方法：

for (var value of myMap.values()) { console.log(value); }

获取Map长度的方法：

console.log(map.size);

1-5、Map与数组的互相转换。

// 数组转Map let map = new Map([[1, "one"]]); // Map(1) { 1 => 'one' } // Map转数组 // ① 使用Array.from Array.from(map); // [ [ 1, 'one' ] ] // ② 使用Rest [...map]; // [ [ 1, 'one' ] ]

2、Set结构。

Set采用数组结构存储数据，可以存储所有类型的值,并且其中值唯一。 Set 对象存储的值总是唯一的，所以需要判断两个值是否存储恒等。 有几个特殊值需要特殊对待：

+0 与 -0 判断存储恒等，所以不重复； undefined 与 undefined判断存储恒等，所以不重复； NaN 与 NaN 判断存储恒等，所以不重复。

其中存储恒等有一点还需注意：引用不恒等。

let arr1 = [[1]]; let set = new Set(arr1); set.add([1]); // Set(2) { [ 1 ], [ 1 ] } 虽然arr1值与[1]恒等，但是引用不恒等，所以可重复。

1-1、创建一个Set对象。

let set = new Set(); set.add(2); // Set(1) { 2 } set.add(2); // Set(1) { 2 }：值唯一 set.size // 获取Set的长度:1

1-2、Set与数组、String转换。

// Array 转 Set let arr2 = [[1], ["one"]]; let set = new Set(arr2); // Set(2) { [ 1 ], [ 'one' ] } // 用...操作符，将 Set 转 Array var myArray = [...mySet]; // String 转 Set let set = new Set("string"); // Set(6) { 's', 't', 'r', 'i', 'n', 'g' }

1-3、Set妙用。

① 数组去重

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

② 并集

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

③ 交集

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

④ 差集

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