基本概念
ES6新增的Set类型是一种有序列表,其中含有一些相互独立的非重复值。
*成员之间是否重复,Set集合内部是通过Object.is()
方法进行判断。
创建Set集合并添加成员
1、使用add() 方法向 Set 集合加入成员。
例子:
const set = new Set();
set.add(1).add(1).add("1");
set.add({}).add({});
//Set集合里 (NaN===NaN) 为true
set.add(NaN).add(NaN);
console.log(set);
//输出:{1, "1", {}, {}, NaN}
2、用数组初始化Set 集合。
例子:
const set = new Set([1, 1, 2, 2, 3, 3]);
console.log(set);
//输出:{1, 2, 3}
3、也可以使用类数组对象作为参数创建Set集合。
例子:
(function() {
console.log(new Set(arguments));
})(1, 1, 2, 2, 3, 3);
//输出:{1, 2, 3}
注意:
1、Set 集合不会添加重复的成员。
2、Set 构造函数可以接受所有可迭代对象作为参数。
Set集合常用属性和方法
size属性:返回Set 集合的成员总数。
add(value) 方法:添加某个值,返回 Set 集合本身。
delete(value) 方法:删除某个值,返回一个布尔值,表示删除是否成功。
has(value) 方法:返回一个布尔值,表示该值是否为Set的成员。
clear() 方法:清除所有成员,没有返回值。
例子:
const set = new Set([1, 2]);
set.add(3);
console.log(set.size); //输出:3
console.log(set.has(3)); //输出:true
console.log(set.delete(3)); //输出:true
console.log(set.size); //输出:2
set.clear();
console.log(set.size); //输出:0
遍历方法
for…of 循环
Set 集合默认可遍历,因此可以直接用for…of循环遍历 Set 集合,会依次返回集合的成员。
例子:
for (let item of new Set(["A", "B"])) {
console.log(item);
}
//输出:A B
forEach() 方法
forEach() 方法对集合中的每一个成员运行给定函数。这个方法没有返回值,可以替代for…of循环使用。该方法的回调函数中一共有三个参数,依次为成员、索引值和集合本身。但由于Set 集合没有索引值的概念,因此第一个参数与第二个参数的值永远都是一样的。
例子:
new Set([1, 2, 3]).forEach((v, i, s) => console.log(v + ":" + i));
//输出:1:1 2:2 3:3
*Set 集合的遍历顺序就是插入顺序。
Set 集合与数组
Set集合与数组类似,但Set集合成员的值都是唯一的,没有重复的值。Set 集合可以通过遍历方法操作集合中的每一个成员,但不能像数组那样通过索引访问集合中的成员。
Set 集合与数组的相互转换
只要把数组作为Set 构造函数的参数传入,即可完成数组到Set 集合的转换。
例子:
console.log(Object.prototype.toString.call(new Set([1, 2, 3])));
//输出:[object Set]
使用展开运算符(…)或者Array.from()方法也可以很方便的把Set 集合转换为数组。
例子:
console.log(Object.prototype.toString.call([...new Set([1, 2, 3])]));
//输出:[object Array]
console.log(Object.prototype.toString.call(Array.from(new Set([1, 2, 3]))));
//输出:[object Array]
实际应用
展开运算符和 Set 集合相结合,轻松去除数组的重复元素。
例子:
const arr = [1, 1, "A", "A"];
console.log([...new Set(arr)]);
//输出:[1, "A"]
Set 集合和filter() 方法相结合可以很容易地实现数组的并集、交集和差集。
例子:
const arr1 = [1, 2, 3],
arr2 = [3, 4, 5];
//数组并集
console.log([...new Set([...arr1, ...arr2])]);
//输出:[1, 2, 3, 4, 5]
//数组交集
console.log(arr1.filter((v) => new Set(arr2).has(v)));
//输出:[3]
//数组差集
console.log(arr1.filter((v) => !new Set(arr2).has(v)));
//输出:[1, 2]
console.log(arr2.filter((v) => !new Set(arr1).has(v)));
//输出:[4, 5]
如有错误,欢迎指正,本人不胜感激。