ES6之Set

Set
ES6 提供了新的数据结构 Set（集合）。它类似于数组，但成员的值都是唯一的，集合实现了 iterator 接口，所以可以使用『扩展运算符』和『for…of…』进
行遍历，集合的属性和方法：
1) size
返回集合的元素个数
2) add
增加一个新元素，返回当前集合
3) delete 删除元素，返回 boolean 值
4) has
检测集合中是否包含某个元素，返回 boolean 值
5) clear
清空集合，返回 undefined
复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>集合</title>
</head>
<body>
    <script>
        //声明一个 set
        let s = new Set();
        let s2 = new Set(['大事儿','小事儿','好事儿','坏事儿','小事儿']);

        //元素个数
         console.log(s2.size);
        //添加新的元素
          s2.add('喜事儿');
        //删除元素
          s2.delete('坏事儿');
        //检测
          console.log(s2.has('糟心事'));
        //清空
         s2.clear();
         console.log(s2);

        for(let v of s2){
            console.log(v);
        }
        
    </script>
</body>
</html>
复制代码

 

示例：

复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Set 实践</title>
</head>
<body>
    <script>
        let arr = [1,2,3,4,5,4,3,2,1];
        //1. 数组去重
        let result = [...new Set(arr)];
        console.log(result);
        //2. 交集  
        let arr2 = [4,5,6,5,6];
        // 先去重，数据少，性能就会高
        let result1 = [...new Set(arr)].filter(item => {
            let s2 = new Set(arr2);// 4 5 6
            if(s2.has(item)){
                return true;
            }else{
                return false;
            }
        });
        let result2 = [...new Set(arr)].filter(item => new Set(arr2).has(item));
        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);

    </script>
</body>

</html>
复制代码

 

posted @   安静点--  阅读(46)  评论(0)  编辑  收藏  举报
相关博文：
· ES6之Map
· ES6使用let实现变量的解构赋值
· ES6_13、Set集合
· ES6-Set()集合
· ES6的Set使用
阅读排行：
· 被坑几百块钱后，我竟然真的恢复了删除的微信聊天记录！
· 没有Manus邀请码？试试免邀请码的MGX或者开源的OpenManus吧
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· Docker 太简单，K8s 太复杂？w7panel 让容器管理更轻松！
历史上的今天：
2021-11-20 jQuery增删表格数据
2021-11-20 jQuery文档增删
2021-11-20 jQuery爱好选择器
点击右上角即可分享
微信分享提示