ES6之前,数组是javaScript里面的唯一一个集合对象。如果你接触过其他编程语言,可能会知道用来表示集合的数据结构往往还有两种:Set和Map。
Set没有重复的元素的列表。而Map的元素是一个个的键值对。这一篇我们只说Set,Map会另起一篇文章。接下来我们就来看看Set的相关知识:
一:创建Set
1: 通过new Set()创建一个空列表

let set = new Set();

以上我们就成功地创建好了一个Set列表,只是它暂时没有任何元素。在后面的内容,我们可以看到怎样为它添加元素。

2: 以一个可迭代对象初始化列表

let array = [1, 2];
let map = new Map([['name', 'mike'],['age', 25]]);
let setOfArray = new Set(array);
let setOfMap = new Set(map);

setOfArray.forEach(function (value, key, set) {
    console.log(`${key}: ${value}`);
});

setOfMap.forEach(function (value, key, set) {
    console.log(`${key}: ${value}`);
});

以上例子里面的setOfArray.forEach()我们得到的打印结果是:

1: 1
2: 2

从这个打印结果,我们也可以看得出来,Set元素的key和value是同一个值。

以上例子里面的setOfMap.forEach()我们得到的打印结果是:

name,mike: name,mike
age,25: age,25

虽然我们可以用Map初始化一个Set,但是显然这么做没什么意义。通常我们还是更多会使用Array。
二:Set的增
当我们通过给new Set()不传递任何参数而创建一个空Set之后,一般还需要通过add()方法来添加元素:

let set = new Set();
set.add(1);
set.add('1');
console.log(set.size); // 2

在上面的例子里,我们分别添加了数字型的和字符串形的1,最终我们得到两个元素。这是Set区别于普通对象的地方:一般的对象,数值型的属性名会被强制转换为字符串型;但是Set不会。

三:Set的删
想要删除Set里面的所有元素,只需要调用clear()方法:

let set = new Set([1, 2, 3]);
set.clear();
console.log(set.size); // 0

四:Set的查
我们可以通过has()方法来查询某个元素是否在Set集合里面:

let set = new Set([1, 2, 3]);
console.log(set.has(1)); //true
console.log(set.has('1'));//false

五:Set的减
delete()方法可用于从Set集合里面除去某个元素:

let set = new Set([1, 2, 3]);
set.delete(1);
console.log(set.has(1)); //fasle
console.log(set.size); // 2

七:Set的使用场景
从前面的文章中我们陆陆续续了解到了Set集合的一些重要特性,比如:

1: Set没有重复元素
2: Set元素的key和value为同一值
3: 我们可以使用可迭代对象初始化Set 

根据这些特性,我们可以实现Array的去重。基本的思路就是:

1: 要处理的Array集合作为参数来初始化Set集合,这时我们得到一个没有重复元素的Set
2: 通过展开运算符(...), 把第一步得到的Set集合转换为一个数组

代码示例:

let originalArray = [1, 1, 2, 2, 3, 4];
let set = new Set(originalArray);
let newArray = [...set];
console.log(newArray); // [1, 2, 3, 4]

以上,就是Set的一些基本特性,语法和使用场景。


nanaistaken
583 声望43 粉丝