ES6之Set集合(通俗易懂,含实践)

Set是什么?它的方法有哪些?它在实例开发中有什么作用?

让我为大家介绍一下吧!

ES6提供了新的数据结构 Set(集合) 。它类似于数组,但成员的值是唯一的,常用于数组去重。

创建方法:

javascript 复制代码
    let s = new Set()
    console.log(s)

它属于什么类型?

javascript 复制代码
    console.log(typeof s) //object

我们通常在set中写入数组

javascript 复制代码
    let s = new Set(["西游记","三国演义","水浒传","红楼梦","西游记"])
    console.log(s)

由此可见,set 可以自动帮我们去重

Set 对象的几个常用方法和属性

1.size

可以获取元素的个数

javascript 复制代码
    let s = new Set(["西游记","三国演义","水浒传","红楼梦","西游记"])
    console.log(s.size) //4 

2.add( )

向 Set 添加新元素

javascript 复制代码
    let s = new Set(["西游记","三国演义","水浒传","红楼梦","西游记"])
    s.add("四大名著")
    console.log(s) 


3.delete( )

删除由其值指定的元素

javascript 复制代码
    let s = new Set(["西游记","三国演义","水浒传","红楼梦","西游记"])
    s.add("四大名著")
    s.delete("四大名著")
    console.log(s) 


4.has( )

如果值存在则返回 true,否则false

javascript 复制代码
    let s = new Set(["西游记","三国演义","水浒传","红楼梦","西游记"])
    console.log(s.has("西游记")) //true
    console.log(s.has("四大名著")) //false

5.clear( )

清空

javascript 复制代码
    let s = new Set(["西游记","三国演义","水浒传","红楼梦","西游记"])
    s.clear()
    console.log(s)

6.我们可以使用for...of遍历

javascript 复制代码
    let s = new Set(["西游记","三国演义","水浒传","红楼梦","西游记"])
    for(let v of s) {
        console.log(v)
    }


7.keys( )

javascript 复制代码
    let s = new Set(["西游记","三国演义","水浒传","红楼梦","西游记"])
    console.log(s.keys())


8.forEach( )

为每个元素调用回调

javascript 复制代码
    let s = new Set(["西游记","三国演义","水浒传","红楼梦","西游记"])
    s.forEach(item=>{
        console.log(item)
    })

实践

1.数组去重

javascript 复制代码
    let arr = [1, 2, 3, 3, 2, 1, 4, 5, 1]
    let result = [...new Set(arr)]
    console.log(result)

2.交集

javascript 复制代码
    let result = [...new Set(arr1)].filter(item=>new Set(arr2).has(item)
    // {
    //     // 把arr2也变成一个集合
    //     let s2 = new Set(arr2)
    //     // 判断arr2里是否有arr1里的元素
    //     if(s2.has(item)){
    //         return true
    //     }else {
    //         return false
    //     }
    // }) 
    )
    console.log(result)

3.并集

javascript 复制代码
    let arr1 = [1, 2, 3, 3, 2, 1, 4, 5, 1]
    let arr2 = [1,2,3,3,2,4]
    let result = [...new Set([...arr1,...arr2])]
    console.log(result)

4.差集

javascript 复制代码
    let arr1 = [1, 2, 3, 3, 2, 1, 4, 5, 1]
    let arr2 = [1,2,3,3,2,4]
    // 取反
    let result = [...new Set(arr1)].filter(item=>!(new Set(arr2).has(item)))
    console.log(result);

感谢大家的阅读,如有不对的地方,可以向我指出,感谢大家!

相关推荐
SunTecTec4 分钟前
Flink Docker Application Mode 命令解析 - 修改命令以启用 Web UI
大数据·前端·docker·flink
Vaclee43 分钟前
JavaScript-基础语法
开发语言·javascript·ecmascript
拉不动的猪1 小时前
前端常见数组分析
前端·javascript·面试
小吕学编程1 小时前
ES练习册
java·前端·elasticsearch
Asthenia04121 小时前
Netty编解码器详解与实战
前端
袁煦丞2 小时前
每天省2小时!这个网盘神器让我告别云存储混乱(附内网穿透神操作)
前端·程序员·远程工作
一个专注写代码的程序媛3 小时前
vue组件间通信
前端·javascript·vue.js
一笑code3 小时前
美团社招一面
前端·javascript·vue.js
懒懒是个程序员3 小时前
layui时间范围
前端·javascript·layui
NoneCoder3 小时前
HTML响应式网页设计与跨平台适配
前端·html