首页 > 网络编程 > JavaScript > javascript技巧 > js中Set使用

JavaScript中Set基本使用方法实例

2022-11-14 09:16:38 作者：RayShyy

因为Set中存放的数据都是不会重复的数据,我们在编写JS代码的时候,因此我们可以利用Set来帮助我们更便捷地完成许多的事,下面这篇文章主要给大家介绍了关于JavaScript中Set基本使用方法的相关资料,需要的朋友可以参考下

介绍

ECMAScript 6 新增的 Set 是一种新集合类型，为这门语言带来集合数据结构。Set 在很多方面都像是加强的 Map，这是因为它们的大多数 API 和行为都是共有的。

基本API

1. 创建Set实例

使用 new 关键字和 Set 构造函数可以创建一个空集合：

const s = new Set();

如果想在创建的同时初始化实例，则可以给 Set 构造函数传入一个可迭代对象，其中需要包含插入到新集合实例中的元素(Set 可以包含任何 JavaScript 数据类型作为值)：

const s = new Set(["val1", 1, true, {}, undefined, function fun() {}]);

注意:Set结构不会添加重复的值

const s = new Set([1, 1, 2, 3, 4, 4, 5, 6, 7, 4, 2, 1]);
Array.from(s); //  [1, 2, 3, 4, 5, 6, 7]

经常用Set解决数组去重问题

const arr = [1, 2, 3, 3, 4, 5, 4, 4, 2, 1, 3];
Array.from(new Set(arr)); // [1, 2, 3, 4, 5]

2. Set实例转数组

const s = new Set([1, 2, 3]);
Array.from(s); // [1, 2, 3]

3. size属性

size: 获取Set实例的元素个数：

const s = new Set([1, 2, 3]);
s.size; // 3

4. add()

add(): 添加元素：

const s = new Set();
s.add(1).add(2).add(3);
Array.from(s); // [1, 2, 3]

5. has()

has(): 查询Set实例是否存在某元素(返回布尔值)：

const s = new Set();
s.add(1).add(2).add(3);
s.has(1); // true

6. delete()

delete(): 删除Set实例中某个元素(返回布尔值)：

const s = new Set();
s.add(1).add(2);
s.delete(1);
Array.from(s); // [2]

7. clear()

clear(): 清空Set实例：

const s = new Set();
s.add(1).add(2).add(3);
Array.from(s); // [1, 2, 3]
s.clear();
Array.from(s); // []

8. 迭代

keys():返回键名;

values(): 返回键值；

entries(): 返回键值对;

键名=键值

const s = new Set();
s.add(1).add(2).add(3);
Array.from(s.keys()); // [1, 2, 3]
Array.from(s.values()); // [1, 2, 3]
Array.from(s.entries()); // [[1, 1], [2, 2], [3, 3]]

for-of:

const s = new Set();
s.add(1).add(2).add(3);
for (const i of s) {
	console.log(i);
}
// 1
// 2
// 3

forEach

const s = new Set();
s.add(1).add(2).add(3);
s.forEach((value, key) => console.log(key + ' : ' + value));
// 1 : 1
// 2 : 2
// 3 : 3

补充：JS中Set的操作方法

(1)：数组与Set之间的转换：

一：数组转Set：

     var arr = ["1","2","1","2","3","1"];
     var set = new Set(arr);
     //得到一个新的Set：{"1","2","3"};

二：Set转数组：

     var arr1= Array.from(set );
     //得到一个新的数组：["1","2","3"];

(2)：使用Set给数组去重：

            //定义一个新的数组：
            var arr = ["1","2","1","2","3","1"];

方法一：

         var arr1 = Array.from(new Set(arr));
         //得到一个新的数组：["1","2","3"];

方法二：

         var arr1 = [...new Set(arr)];
         //得到一个新的数组：["1","2","3"];

(3)：求两个Set的并集，交集，差集：

            var arr1 = ["1","2","3"];
            var arr2 = ["1","2"];
            var set1= new Set(arr1);
            var set2= new Set(arr2);
            
            //并集后：
            var newSet1 = new Set([...set1,...set2]);
            //得到一个新的Set：{"1","2","3"};
            
            //交集后：
            var newSet2 = new Set([...set1].filter(x => set2.has(x)));
            //得到一个新的Set：{"1", "2"};
            
            //差集后：
            var newSet3 = new Set([...set1].filter(x => !set2.has(x)));
            //得到一个新的Set：{"3"};

至此，在JS中使用Set的使用方法暂时写到这儿，以后想起来再更新。

总结

到此这篇关于JavaScript中Set基本使用方法的文章就介绍到这了,更多相关js中Set使用内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！