前言
JavaScript中对象的本质是键值对的集合，ES5中的数据结构，主要是用Array和Object，但是键只能是字符串。为了弥补这种缺憾，ES6带来了一种新的数据结构Map。
Map也是键值对的集合，只是键不仅可以是字符串还可以是其他数据类型，比如：对象（是不是很神奇）。请看下面例子。。下面话不多说了，来一起看看详细的介绍吧。
Map 对象
Map结构提供了“值—值”的对应，任何值(对象或者原始值) 都可以作为一个键或一个值，是一种更完善的Hash结构实现。如果你需要“键值对”的数据结构，Map比Object更合适。它类似于对象，也是键值对的集合，但是“键”的范围不限于字符串，各种类型的值（包括对象）都可以当作键。
属性
Map属性
-
Map.length 属性length的值为0。
-
Map.prototype 表示Map构造器的原型。允许添加属性从而应用与所有的Map对象
Map实例 - 所有Map对象的实例都会继承Map.prototype。
-
Map.prototype.constructor 返回创建给map实例的构造函数，默认是Map函数。
-
Map.prototype.size 返回Map对象的键值对的数量。
var map = new Map([['one',1], ['two', 2], ['three', 3]]); console.log(map.constructor); //function Map() { [native code] } console.log(map.size); //3
方法
//Iterator对象：可以使用for..of进行迭代的对象
var map = new Map([[1, 'one'],[2, 'two'], [3, 'three']]);
1.Map.prototype.set(key, value) 设置Map对象中键的值，返回该Map对象。
console.log(map.has(4)); //false
map.set(4, 'four');
console.log(map.has(4)) //true2.Map.prototype.get(key) 返回键对应的值，如果不存在，则返回undefined。
map.get(1); //'one'3.Map.prototype.has(key) 返回一个布尔值，表示Map实例是否包含键对应的值。
map.has(1); // true
map.has(5); //false4.Map.prototype.delete(key) 移除任何与键相关联的值，并且返回该值，该值在之前会被Map.prototype.has(key)返回为true。之后再调用则返回false。
console.log(map.has(1)); //true
map.delete(1);
console.log(map.has(1)); //false5.Map.prototype.clear() 移除Map对象的所有键值对。
console.log(map.size); //3
map.clear();
console.log(map.size); //06.Map.prototype.entries() 返回一个新的Iterator对象，它按插入顺序包含了Map对象中每个元素的[key, value]数组。
console.log(map); //Map {1 => "one", 2 => "two", 3 => "three"}
map.entries();
console.log(map); //Map {1 => "one", 2 => "two", 3 => "three"}7.Map.prototype.forEach(callbackFn[, thisArg]) 按插入顺序，为Map对象里的每一键值对调用一次callbackFn函数。如果为forEach提供了thisArg，他将在每次回调函数中作为this值。
map.forEach(function(value, key, mapObj) {
console.log(value + '---' + key + '---' + mapObj);
//value - Map对象里每一个键值对的值
//key - Map对象里每一个键值对的键
//mapObj - Map对象本身
console.log(this); //this === window
});
map.forEach(function(value, key, mapObj) {
console.log(value + '---' + key + '---' + mapObj);
console.log(this); //this === map
}, map)8.Map.prototype.keys() 返回一个新的Iterator对象，它按插入顺序包含了Map对象中每个元素的键。
map.keys(); //MapIterator {1, 2, 3}9.Map.prototype.values() 返回一个新的Iterator对象，它按插入顺序包含了Map对象中每个元素的值。
map.values(); //使用for..of方法迭代映射
var map = new Map();
map.set(1, 'one');
map.set(2, 'two');
for (var [key, value] of map) {
console.log(key + '---' + value);
}
// 1 --- one 2 --- two
for (var key of map.keys()) {
console.log(key);
}
// 1 2
for (var value of map.values()) {
console.log(value);
}
// 'one' 'two'常规用法综合
var map = new Map(); //创建map对象 map.set('one', 1); map.set('two', 2); map.set('three', 3); //或者 var map = new Map([['one',1], ['two', 2], ['three', 3]]); m.set(ul,'content'); //为Map增加成员 m.get(ul);//获取键 ul对应的值 m.has(ul);//返回布尔值，判断是否含有键 ul m.delete(ul);//删除键 ul，成功返回true，失败返回false m.size //返回m长度 m.clear(); //清除m所有成员
Map VS Object
-
一个对象通常都有自己的原型，所以一个对象总有一个"prototype"键。不过，从ES5开始可以使用map = Object.create(null)来创建一个没有原型的对象。
-
一个对象的键只能是字符串或者Symbols，但一个Map的键可以是任意值。
-
你可以通过size属性很容易地得到一个Map的键值对个数，而对象的键值对个数只能手动确认。
数据类型转换
...扩展语句
扩展语法允许一个表达式在期望多个参数（用于函数调用）或多个元素（用于数组字面量）或多个变量（用于解构赋值）的位置扩展。
let arr1 = [0, 1, 2]; let arr2 = [3, 4, 5]; arr1 = [...arr2, ...arr1]; console.log(arr1) // [3, 4, 5, 0, 1, 2]
Map转数据的最简单方式是使用 ... 扩展运算符。例如：
var map = new Map([['one',1], ['two', 2], ['three', 3]]); console.log(...map); //["one", 1] ["two", 2] ["three", 3]
Map转对象时，必须所有键都是字符串，使用Object.create()函数。Map转JSON时，要求也要求所有键都是字符串，使用JSON.Stringify()函数。
需要注意的
1、转换时注意
2、当键是对象时，必须是引用相同，才认为键是相同的。只有对同一个对象的引用，Map结构才将其视为同一个键。这一点要非常小心。
var map = new Map(); map.set(['a'], 555); map.get(['a']) // undefined //上面代码的set和get方法，表面是针对同一个键，但实际上这是两个值，内存地址是不一样的，因此get方法无法读取该键，返回undefined。
3、如果Map的键是一个简单类型的值（数字、字符串、布尔值），则只要两个值严格相等，Map将其视为一个键，包括0和-0。另外，虽然NaN不严格相等于自身，但Map将其视为同一个键。
var map = new Map(); map.set(Number('aa111'), 'isNaN'); map.set(Number('bb222'), 'also is NaN'); map.get(NaN); //'also is NaN'
4、注意区分Map对象与JavaScript Array map() 方法
Array map() 语法 array.map(function(currentValue,index,arr), thisValue) 实例1 //返回一个数组，数组中元素为原始数组的平方根: var numbers = [4, 9, 16, 25]; function myFunction() { x = document.getElementById("demo") x.innerHTML = numbers.map(Math.sqrt); } //2,3,4,5 实例2 //数值项求平方： var data = [1, 2, 3, 4]; var arrayOfSquares = data.map(function (item) { return item * item; }); alert(arrayOfSquares); // 1, 4, 9, 16
Set 对象
简要
ES6提供了新的数据结构Set。它类似于数组，但是成员的值都是唯一的，没有重复的值。
Set函数可以接受一个数组（或类似数组的对象）作为参数，用来初始化。
Set对象允许你存储任意类型的唯一值（不能重复），无论它是原始值或者是对象引用。
Set本身是一个构造函数，用来生成Set数据结构。
Set结构有以下属性：
- Set.prototype.constructor: 构造函数，默认就是Set函数。
- set.prototype.size : 返回Set的成员总数。
Set结构有以下方法：
- add(value) : 添加某个值，返回Set结构本身。
- delete(value) : 删除某个值，返回一个布尔值，表示是否成功。
- has(value) : 返回一个布尔值，表示该值是否为Set的成员。
- clear() : 清除所有成员，没有返回值。
Set遍历操作：
- keys():返回键名的遍历器
- values(): 返回健值对的遍历器
- entries():返回键值对的遍历器
- forEach(): 每个成员
Set属性
-
Set.length 属性length的值为0。
-
Set.prototype 表示Set构造器的原型。允许向所有Set对象添加新的属性。
Set实例
所有Set对象的实例都会继承Set.prototype。
-
Set.prototype.constructor 返回创建给set实例的构造函数，默认是Set函数。
-
Set.prototype.size 返回Set对象的键值对的数量。
var sset = new Set(['one', 'two', 'three']);
console.log(sset.constructor); //function Set() { [native code] }
console.log(sset.size); //3Set方法
//创建Set实例
//1.
var sset = new Set();
sset.add('one');
sset.add('two');
sset.add('three');
//2.
var sset= new Set(['one', 'two', 'three']);1.Set.prototype.add(value) 在Set对象尾部添加一个元素。返回该Set对象。
sset.add('four');
console.log(sset); //Set {"one", "two", "three", "four"}2.Set.prototype.clear() 移除Set对象内的所有元素。
sset.clear();
console.log(sset.size); //03.Set.prototype.delete(value) 移除Set的中与这个值相等的元素，返回Set.prototype.has(value)在这个操作前会返回的值（即如果该元素存在，返回true，否则返回false）。Set.prototype.has(value)在此后会返回false。
console.log(sset.has('one')); //true
sset.delete('one');
console.log(sset.has('one')); //false4.Set.prototype.entries() 返回一个新的迭代器对象，该对象包含Set对象中的按插入顺序排列的所有元素的值的[value, value]数组。为了使这个方法和Map对象保持相似， 每个值的键和值相等。
5.Set.prototype.forEach(callbackFn[, thisArg]) 按照插入顺序，为Set对象中的每一个值调用一次callBackFn。如果提供了thisArg参数，回调中的this会是这个参数。
sset.forEach(function(value, key, setObj) {
console.log(value + '---' + key + '---' + setObj);
//value - Set对象里每一个键值对的值
//key - Set对象里每一个键值对的键 === 值
//mapObj - Set对象本身
console.log(this); //this === window
});
sset.forEach(function(value, key, setObj) {
console.log(value + '---' + key + '---' + setObj);
console.log(this); //this === sset
}, sset)6.Set.prototype.has(value) 返回一个布尔值，表示Map实例是否包含键对应的值。
sset.has('one'); // true
sset.has('fivr'); //false7.Set.prototype.keys() 与values()方法相同，返回一个新的迭代器对象，该对象包含Set对象中的按插入顺序排列的所有元素的值。
sset.keys(); //SetIterator {"one", "two", "three"}8.Set.prototype.values() 返回一个新的Iterator对象，它按插入顺序包含了Map对象中每个元素的值。
sset.values(); //SetIterator {"one", "two", "three"}使用for..of方法迭代映射
var sset = new Set();
sset.add(1);
sset.add(2);
for (var value of sset) {
console.log(value);
}
// 1 2
for (var key of sset.keys()) {
console.log(key);
}
// 1 2
for (var value of sset.values()) {
console.log(value);
}
// 1 2Set 与 Array
var myArray = ["value1", "value2", "value3"]; // 用Set构造器将Array转换为Set var mySet = new Set(myArray); mySet.has("value1"); // returns true // 用...(展开操作符)操作符将Set转换为Array console.log([...mySet]); // 与myArray完全一致
Array.from方法可以将Set结构转换为数组。
var items = new Set([1, 2, 3, 4, 5]); var array = Array.from( items );
这也提供了一种除去数组中重复元素的方法。
function dedupe( array ) { return Array.from( new Set(array) ); }
或者如下写也可以，比较简单的数组去重
[...new Set([1,3,4,5,1,2,3,3,4,8,90,3,0,5,4,0])]Set 注意
1、var sset = new Set('one', 'two', 'three'); //这样的错误的
2、值的相等规则：NaN 是与NaN是相同的（虽然NaN !== NaN）,除此之外所有的值都根据'==='判断。
var sset= new Set(); sset.add(Number('aa111')); sset.add(Number('bb222')); sset.add('cc333')); //Set {NaN, "cc333"}
3、向Set加入值的时候，不会发生类型转换。这意味着，在Set中5和”5”是两个不同的值。
weakset对象
WeakSet结构与Set类似，也是不重复的值的集合。
WeakSet和Set的区别：
- 1.WeakSet的成员只能是对象，而不能是其他类型的值
- 2.WeakSet中的对象都是弱引用，即垃圾回收机制不考虑WeakSet对该对象的引用，也就是说，如果其他对象都不再引用该对象，那么垃圾回收机制会自动回收该对象所占用的内存，不考虑该对象还存在于WeakSet之中。这个特点意味着，无法引用WeakSet的成员，因此WeakSet是不可遍历的。
WeakSet结构的三个方法
add
delete
has
WeakSet的一个用处是储存DOM节点，而不用担心这些节点会从文档中移除时，会引发内存泄露。