ES6新特性——集合介绍与API

Set（集合）

　　ES6 提供了新的数据解构 set（集合）。它类似于数组，但成员的值都是唯一的，集合实现了 iterator 接口，所以可以使用【扩展运算符】和【for...of...】进行遍历，集合的属性方法：

　　1）size 返回集合的元素个数

　　2）add 增加一个元素，返回当前集合

　　3）delete 删除元素，返回 boolean 值

　　4）has 检测集合中是否包含某个元素，返回 boolean 值

<script>
    // 声明一个 set
    let s = new Set();
    let s2 = new Set(['']);
    console.log(s, typeof s);    // 输出 object
    
    let s2 = new Set(['大事儿','小事儿','好事儿','坏事儿','小事儿']);
    console.log(s2);    // 输出 {"大事儿","小事儿","好事儿","坏事儿"}
    
    //输出元素个数
    console.log(s2.size);    // 输出 4 个
    
    //添加新的元素
    s2.add('喜事儿');
    console.log(s2);    // 输出 {"大事儿","小事儿","好事儿","坏事儿","喜事儿"}
    
    //删除元素
    s2.delete('坏事儿');
    console.log(s2);    // 输出 {"大事儿","小事儿","好事儿","喜事儿"}
    
    //检测元素
    console.logs2.has(('好事儿'));    // 输出 true 没有的话返回 false
    
    //清空
    s2.clear();
    console.log(s2);    // 输出 {}
    
    for(let v of s2){
        console.log(v)        // 依次输出 集合中的元素
    }
</script>

 Set 实践

<script>
    let arr = [1,2,3,4,5,4,3,2,1];
    //1.数组去重
    let result = [...new Set(arr)];            // new Set(arr); 创建集合(对象)，通过扩展运算符 [...] 将集合变成数组 并展开去重
    console.log(result);                    // 输出 [1,2,3,4,5]
    //2.交集
    let arr2 = [4,5,6,5,6];
    let result = [...new Set(arr)].filter(item=>{
        let s2 = new Set(arr2);                // 4 5 6
        if(s2.has(item)){
            return true;
        }else{
            return false;
        }
    })
        //简化
    let result = [...new Set(arr)].filter(item=>new Set(arr2).has(item));
    console.log(result);                    // 输出 [4,5]
    
    //3.并集
    let union = [...new Set([...arr,...arr2])];        // [...arr,...arr2] 先合并 ； new Set([...arr,...arr2]) 在去重； [...new Set([...arr,...arr2])] 再转化为数组
    console.log(union);                        // 输出 [1,2,3,4,5,6]
    
    //4.差集
    let diff = [...new Set(arr)].filter(item=>!(new Set(arr2).has(item)));
    console.log(diff);                        // 输出 1 2 3 （注：主体不同，差集结果也不同，本例主体为 arr 差集为 123，若主体为 arr2 差集为 6）  
</script>