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的一些基本特性,语法和使用场景。