欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

ES6 新数据结构Set

程序员文章站 2022-07-13 09:13:59
...

Set

浏览器内置的构造函数 由ES6提供的一种新的储存数据的结构

关于特性:

只有属性值,类似于数组,所有的元素都是唯一不重复的。

	var myset = new Set();
	myset.add(1);
	myset.add(1);
	myset.add(2);
	console.log(myset); //Set(2) {1,2}

根据这个特性,首先想到的肯定是数组的去重,但是在使用它之前,我们详细熟悉一下它的特性。
Set对象储存的值总是唯一的,那么它是通过判断两个值是否恒等吗?

	var myset1 = new Set([+0,-0]);
	console.log(myset1); //Set(1) {0}

	var myset2 = new Set([undefined,undefined,undefined]);
	console.log(myset2); //Set(1) {undefined}

	var myset3 = new Set([NaN,NaN,NaN]);
	console.log(myset3); //Set(1) {NaN}

ES6 新数据结构Set
在js中 +0 === -0 和 undefined === undefined 返回的都是true
依据Set的特性只会存储一次,这很好理解
但是NaN并不恒等,却只能储存一次,这属于一种特殊情况

接下来就是数组去重了:

	var myset = new Set([1,2,3,1,2,3]);
	console.log(myset); // Set(3) {1,2,3}

可以用…操作符,将Set转化为Array

	var myarray = [...myset];
	console.log(myarray); //[1,2,3]

关于数据储存

存储数组时:

	var myset = new Set([1,2,3,[4,5,6],{game:'明日方舟'}]);

ES6 新数据结构Set
储存字符串时:

	var arr = ['123'];
	console.log(arr);
	var myset = new Set('123');
	console.log(myset);

ES6 新数据结构Set
对比数组可以发现,Set在存储字符串时会将字符串拆分为单个字符,按顺序进行储存,这是不同于数组的地方

关于操作

1.添加元素

	set.add(1)

2.删除元素

	set.delet(1)

3.判断元素是否存在

	set.has(1)

4.清除所有元素

	set.clear()

关于遍历

两种遍历方式
1.自身的forEach()方法
2.ES6提供的 for of

Set原型上面的方法
ES6 新数据结构Set

	var set = new Set([1, 2 ,3 , 'hello'])
	console.log('Set.keys()');
	for(let item of set.keys()) {
	  console.log(item);
	}

	console.log('Set.values()');
	for(let item of set.values()) {
	  console.log(item);
	}

	console.log('Set.entries()');
	for(let item of set.entries()) {
	  console.log(item);
	}

结果:
ES6 新数据结构Set
最后补充一些关于数学上的一些小东西:

并集

	var set1 = new Set([1, 2, 3]);
	var set2 = new Set([2, 3, 4]);
	var union = new Set([...set1, ...set2]); // {1, 2, 3, 4}

交集

	var set1 = new Set([1, 2, 3]);
	var set2 = new Set([2, 3, 4]);
	var intersect = new Set([...set1].filter(x => set2.has(x))); // {2, 3}

差集

	var set1 = new Set([1, 2, 3]);
	var set2 = new Set([2, 3, 4]);
	var difference = new Set([...set1].filter(x => !set2.has(x))); // {1}