前端基础之《ECMAScript 6（9）—集合介绍与API》

一、Set集合

1、ES6提供了新的数据结构Set（集合）

它类似于数组，但成员的值都是唯一的，集合实现了Iterator接口，所以可以使用【扩展运算符...】展开和【for...of】进行遍历。
Set本质上也是一个对象。

2、集合的属性和方法

（1）size：返回集合的元素个数
（2）add：增加一个新元素，返回当前集合
（3）delete：删除元素，返回boolean值
（4）has：检测集合中是否包含某个元素，返回boolean值

3、Set例子

    //声明一个Set
	let s = new Set();
    console.log(s, typeof s);
 
    //传入一个数组
    let s2 = new Set(['大事儿','小事儿','好事儿','坏事儿','小事儿']);
    console.log(s2);

Set会自动去除重复的项。

4、Set属性和方法例子

    //传入一个数组
    let s2 = new Set(['大事儿','小事儿','好事儿','坏事儿','小事儿']);
    console.log(s2);
 
    //元素个数
    console.log(s2.size);
 
    //添加新元素
    s2.add('喜事儿');
    console.log(s2);
 
    //删除元素
    s2.delete('坏事儿');
    console.log(s2);
 
    //检测
    console.log(s2.has('好事儿'));  //有返回true，没有返回false
 
    //for...of遍历Set集合
    for(let v of s2){
        console.log(v);
    }
 
    //清空
    s2.clear();
    console.log(s2);

二、Set实践

1、数组去重

先将数组变为Set集合，在用扩展运算符变为数组。

2、交集

先去重，在比对。

3、并集

两个直接合并，转换成Set去重，在转换成数组。

4、差集

差集是交集的取反。

    let arr = [1,2,3,4,5,4,3,2,1];
 
    //1. 数组去重
    let result = [...new Set(arr)];  //先将数组变为Set集合，在用扩展运算符变为数组
    console.log(result);
 
    //2. 交集
    let arr2 = [4,5,6,5,6];
    //arr去重
    let result2 = [...new Set(arr)].filter(item => {
        //把arr2也变成一个集合
        let s2 = new Set(arr2);
        if(s2.has(item)){
            return true;
        }else{
            return false;
        }
    });
    console.log(result2);
 
    //3. 并集
    let union = [...new Set([...arr, ...arr2])];
    console.log(union);
 
    //4. 差集
    let diff = [...new Set(arr)].filter(item => !(new Set(arr2).has(item)));
    console.log(diff);

三、Map集合

1、ES6提供了Map数据结构

它类似于对象，也是键值对的集合，但是“键”的范围不限于字符串，各种类型的值（包括对象）都可以当做键。Map也实现了Iterator接口，所以可以使用【扩展运算符】和【for...of】进行遍历。

2、Map的属性和方法

（1）size：返回Map的元素个数
（2）set：增加一个新元素，返回当前Map
（3）get：返回键名对象的键值
（4）has：检测Map中是否包含某个元素，返回boolean值
（5）clear：清空集合，返回undefined
（6）delete：删除一个元素

四、Map例子

1、声明Map

    //声明Map
    let m = new Map();
    m.set('name','张三');
    m.set('say', function(){
        console.log("发言了！");
    })
 
    //声明一个对象
    let key = {
        school : 'xxx三中'
    }
    m.set(key, ['北京','上海','深圳']);
 
    //打印Map对象
    console.log(m);

Map的键可以是字符串，方法，对象等。

2、size

    //size
    console.log(m.size);

3、delete

    //delete
    m.delete('name');
    console.log(m);

4、get

    //get
    console.log(m.get('say'));

5、遍历Map

v的每个元素，是一个数组。数组第一个元素是键，第二个元素是值。

    //遍历
    for(let v of m){
        console.log(v);
    }

五、小结

Map是升级版的对象，原来对象key只能是字符串。现在Map可以把对象作为一个key。