JavaScript学习笔记——ES6之Map与Set

构造函数 > 用它的话就需要new一下
Babel编译不会降级，非要用在很老的版本就用插件（一般用不到）
ES6修复了NaN不等于NaN的问题

Set( ) 构造函数

1. 特点：

类似于数组

1. 成员是唯一的数组（里头有的东西你再添加是没用的，他不会给你执行）

2. 支持传参的方式 （参数是具备iterator的接口的数据结构：[ ]、类数组）

    var set = new Set([5,7]);
    console.log(set);
    set.add(5); // 已经有5了就不会添加了
    set.add(7);

2. 方法可分为两类：

一类用来遍历：entries、forEach、keys
一类用来操作数据结构：add、delete、has、clear、size

2.1 操作数据结构的方法

1. add( )

返回值是构造函数本身（所以添加的时候可以采用链式调用哦）

2. delete( )

返回值是布尔值（你要删除的内容，如果“数组”里有，给你删且返回true。没有的话返回false）是实时的操作
3. clear( )
清空所有 是实时的操作

在这里插入代码片

4. size类似于长度

2.2 遍历数据结构的方法

set 当中并不存在键名

1. entries( )
返回的是数组形式的 key 与 value

例子：

        let set = new Set(['a','b','v','f','d','g']);

        console.log(set);

        console.log(set.keys());
        console.log(set.values());
        console.log(set.entries());

        for(let i of set.keys()){
            console.log(i); // 返回一个键名的迭代器
        }

        for(let i of set.values()){
            console.log(i); // 返回一个键值的迭代器
        }

        for(let i of set.entries()){
            console.log(i); // 返回一个键值对的迭代器
        }

        // 实例化对象本身具有迭代器接口，所以实例化对象也能够遍历
        for(let i of set){
            console.log(i); // 实际上遍历的是values的内容
        }

 // 映射出一个新的结构
 let set = new Set([1,2,3]);

 let set1 = new Set(Array.from(set,value => value * 2));

 console.log(set1);

3. 利用Set最简单的数组去重方法

先将数组作为参数放到Set()中，
然后将返回来的值通过扩展运算符的方式把它收集到数组当中

        let set = new Set(['a','a','b','a','a','f','f','v','f','d','g']);

        console.log([...set]);

一些案例

//将数组翻2倍，且是set数据结构
        let set = new Set([1,2,3,4,5,6,7]);

        let set1 = new Set([...set].map(value => value * 2));

        console.log(set1)
// set 与 数组的map方法
        var  arr = [1,2,3,4];
        var arr1 = arr.map(parseInt); // 这个还是有一点神奇的，就是这样居然能自动调用方法填参数

        console.log(arr1); //  [1, NaN, NaN, NaN]

        // 解析：
        //  var arr1 = arr.map(parseInt(1,0,2,1,3,2,4,3));

		let set2 = new Set([...set].filter(value => (value % 2) == 0));

// set 与 数组的filter方法 结合起来用

---

Map( ) 构造函数

类似于对象

1. 特点：

1. 让键名不止为字符串，还能是一个对象

传统的对象：当键名为对象的时候，会调用自身的toString方法转成字符串

var m = {};
var x = {id: 1},
    y = {id: 2};

m[x] = "foo";
m[y] = 'bar';

console.log(m);  // {[object Object]: "bar"}

console.log(m[x]); // bar
console.log(m[y]);  // bar

虽然是两个对象，但是因为它们转成字符串后名称是一样的，所以后头的内容会覆盖前面的内容

2. 支持传参的方式 （参数是具备iterator的接口的数据结构：[ ]、类数组）

赋值的两种方式：传参、set

const map = new Map([['name','zhangsan'],['age',18]]);
map.set('name','zhaosi');
map.set('age',24);

console.log(map); // 覆盖了之前的zhangsan 18

+0 === -0

const map = new Map();
map.set(-0,123);
console.log(map.get(+0)); // 123

console.log(+0 === -0); // true
console.log(Object.is(+0,-0)); // false

真真正正实现键和值一一对应的关系：

const map = new Map();
map.set(undefined,1);
map.set(null,2);
console.log(map.get(undefined)); // 1 真真正正实现键和值一一对应的关系

NaN问题：

2. 方法

和 Set 差不多，不一样的是有set( )和get( )

set( )

返回值是当前的Map实例，同样也是可以通过链式调用的方式来执行当前操作

delete( )

也是实时操作的