es6的 set 学习总结

简介: es6的 set 学习总结
 ================set 集合=======================
        一直以来,JS只能使用数组和对象来保持多个数据,缺乏像其他语言那样拥有丰富的结合类型
        。因此,ES6 新增了两种结合类型(set 和 map), 用于不同场景发挥作用。
        1. set 用于存放不能重复的数据
        如何创建一个set: 
          如 const sets = new Set(); // 创建一个没有任何内容的set集合
             const contentSet = new Set(iterable); // 创建一个具有初始化内容的set集合,
            内容来自迭代对象每一次迭代的结果,并且自动去重
        2. 如何对set 集合进行后续操作
         add(数据): 添加一个数据到set集合末尾,如果数据已经存在,不存在任何操作
           set 使用Object.js 的方式来判断两个数据是否相同, 但是set任务 +0 和 -0 是相等的
         has(数据): 判断set中是否存在两个相等的数据
         delete(数据): 删除匹配的数据,返回是否删除成功
         clear(): 清空整个set集合
         3. 如何和数组相互转化
         // 数组使用set来去重
         const s = new Set([1,2,3,4,5,6,7,8]);
         const arr = [...s];
         // 字符串去重
         const str = "fsjfsjsjfifas";
         const s = [...new Set(str)].join("");
         4. 如何遍历
          1. 由于set是迭代对象的属性, 可以使用 for of 来遍历
          2. 使用set内部提供的实例方法, forEach()
          const s = new Set([1,2,3,4,5,6,7,8]);
          s.forEach((item, index, obj) => {
              item: // set中的每一项
              index: // set 不存在下标,为了保持forEach()的一致, 这个参数和第一个参数一样
              obj: set 对象
          })
        注意: set中的index 不是下标
        求两个数组的交集,并集, 差级:
        例如:
            const arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0];
            const arr2 = [1, 3, 4, 5, 6, 3, 6, 7, 9];
            // 求并集
            const s = [...new Set(arr1.concat(arr2))];
            const s1 = [...new Set([...arr1, ...arr2])];
            console.log(s, s1, '并集');
            // 求交集
            const s3 = [...new Set(arr1)].filter(item => {
                return new Set(arr2).has(item);
            })
            const s4 = [...new Set(arr1)].filter(item => arr2.indexOf(item) !== -1)
            console.log(s3, s4, '交集');
            // 求差值
            const s5 = [...new Set([...arr1, ...arr2])].filter(item => (arr1.indexOf(item) !== -1 && arr2.indexOf(item) === -1) || (arr2.indexOf(item) !== -1 && arr1.indexOf(item) === -1));
            const s6 = [...new Set([...arr1, ...arr2])].filter(item => s3.indexOf(item) !== -1);
            console.log(s5, s6, "差值")
目录
打赏
0
0
0
0
15
分享
相关文章
js开发:请解释什么是ES6的Map和Set,以及它们与普通对象和数组的区别。
ES6引入了Map和Set数据结构。Map的键可以是任意类型且有序,与对象的字符串或符号键不同;Set存储唯一值,无重复。两者皆可迭代,支持for...of循环。Map有get、set、has、delete等方法,Set有add、delete、has方法。示例展示了Map和Set的基本操作。
128 3
|
12月前
|
JAVA零基础小白学习免费教程day14-Set&HashMap(一)
JAVA零基础小白学习免费教程day14-Set&HashMap
142 0
|
12月前
|
数仓学习-----named_struct和collect_set函数
数仓学习-----named_struct和collect_set函数
246 5
ES6的Set和Map你都知道吗?一文了解集合和字典在前端中的应用
该文章详细介绍了ES6中Set和Map数据结构的特性和使用方法,并探讨了它们在前端开发中的具体应用,包括如何利用这些数据结构来解决常见的编程问题。
ES6的Set和Map你都知道吗?一文了解集合和字典在前端中的应用
|
7月前
|
【用Java学习数据结构系列】HashMap与TreeMap的区别,以及Map与Set的关系
【用Java学习数据结构系列】HashMap与TreeMap的区别,以及Map与Set的关系
97 1
ES6中的Set数据结构的常用方法和使用场景
ES6中的Set数据结构的常用方法和使用场景
JavaScript编码之路【ES6新特性之 Symbol 、Set 、Map、迭代器、生成器】(二)
JavaScript编码之路【ES6新特性之 Symbol 、Set 、Map、迭代器、生成器】(二)
91 1
JavaScript编码之路【ES6新特性之 Symbol 、Set 、Map、迭代器、生成器】(一)
JavaScript编码之路【ES6新特性之 Symbol 、Set 、Map、迭代器、生成器】(一)
64 0
AI助理

你好,我是AI助理

可以解答问题、推荐解决方案等