• 技术文章 >web前端 >前端问答

    Set是ES6的吗

    青灯夜游青灯夜游2022-05-05 14:37:02原创126

    Set是ES6的新特性。Set是ES6新增的数据结构,是一种有序列表集合,类似于数组,但是其成员的值都是唯一的,没有重复的值;set的遍历顺序就是插入顺序,set保存的一个函数列表调用时,就是按照指定的顺序进行调用,因此set类型是有序的。

    本教程操作环境:windows7系统、ECMAScript 6版、Dell G3电脑。

    Set是ES6的新特性。

    Set 是 ES6 提供的新的数据结构,类似于数组,但是成员的值都是唯一的,没有重复的值。

    Set本身是一个构造函数,用来生成Set数据结构。

    // 创建Set实例
    let set1 = new Set();                           // {}
    let set2 = new Set([1,2,{name:'杰克'}]);        // {1,2,{name:'杰克'}}

    set类型是es6中新增的有序列表集合,其中包含了一些相互独立的非重复值;set的遍历顺序就是插入顺序,set保存的一个函数列表调用时,就是按照指定的顺序进行调用,因此set类型是有序的。

    Set的增删改查

    Set的实例关于增删改查的方法:

    add()

    添加某个值,返回 Set 结构本身

    当添加实例中已经存在的元素,set不会进行处理添加

    s.add(1).add(2).add(2); // 2只被添加了一次

    delete()

    删除某个值,返回一个布尔值,表示删除是否成功

    s.delete(1)

    has()

    返回一个布尔值,判断该值是否为Set的成员

    s.has(2)

    clear()

    清除所有成员,没有返回值

    s.clear()

    Set的遍历

    Set实例遍历的方法有如下:

    关于遍历的方法,有如下:

    Set的遍历顺序就是插入顺序

    keys方法、values方法、entries方法返回的都是遍历器对象

    let set = new Set(['red', 'green', 'blue']);
    
    for (let item of set.keys()) {
      console.log(item);
    }
    // red
    // green
    // blue
    
    for (let item of set.values()) {
      console.log(item);
    }
    // red
    // green
    // blue
    
    for (let item of set.entries()) {
      console.log(item);
    }
    // ["red", "red"]
    // ["green", "green"]
    // ["blue", "blue"]

    forEach()用于对每个成员执行某种操作,没有返回值,键值、键名都相等,同样的forEach方法有第二个参数,用于绑定处理函数的this

    let set = new Set([1, 4, 9]);
    set.forEach((value, key) => console.log(key + ' : ' + value))
    // 1 : 1
    // 4 : 4
    // 9 : 9

    扩展运算符和Set 结构相结合实现数组或字符串去重

    // 数组
    let arr = [3, 5, 2, 2, 5, 5];
    let unique = [...new Set(arr)]; // [3, 5, 2]
    // 字符串
    let str = "352255";
    let unique = [...new Set(str)].join(""); // ""

    实现并集、交集、和差集

    let a = new Set([1, 2, 3]);
    let b = new Set([4, 3, 2]);
    
    // 并集
    let union = new Set([...a, ...b]);
    // Set {1, 2, 3, 4}
    
    // 交集
    let intersect = new Set([...a].filter(x => b.has(x)));
    // set {2, 3}
    
    // (a 相对于 b 的)差集
    let difference = new Set([...a].filter(x => !b.has(x)));
    // Set {1}

    扩展知识:

    1.数组转为Set实例

    let arr = [1,2,3];
    let set = new Set(arr);// {1,2,3}

    2.Set实例转为数组

    let set = new Set([1,2,3]);// {1,2,3}
    
    // 方式一 扩展运算符
    let arr = [...set];// [1,2,3]
    
    // 方式二 Array.from方法
    let arr = Array.from(set);// [1,2,3]

    【相关推荐:javascript视频教程web前端

    以上就是Set是ES6的吗的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:Set ES6
    上一篇:es6中assign的用法是什么 下一篇:es6的promise是什么意思
    VIP课程(WEB全栈开发)

    相关文章推荐

    • 【腾讯云】年中优惠,「专享618元」优惠券!• es6装饰器有几种• es6怎么改变数组数据• es6里面has()的用法是什么• es6遍历器是什么• es6怎么去掉字符串的空格• 为什么要将es6转为es5
    1/1

    PHP中文网