ES6中的Set集合

2018-04-08  本文已影响24人  IsaacHHH

在ES6中,出现了新的概念:Set集合和Map集合。在ES6之前,数组是JS中唯一的集合类型。如果对数组有深入理解,就会知道,数组所接受的索引类型是数值,如果为非数值则会自动转换成数值类型的索引,我之前的一篇文章中有专门写到这个概念。
我们知道了数组的限制后,就很容易理解Set集合的作用了。

什么是Set集合

Set集合是一种没有重复元素、有序列表,一般的我们不会像访问数组一样逐一的访问每个元素,通常的做法是检测给定的值在某个集合中是否存在;通过Set集合可以快速访问其中的数据,更有效的追踪各种离散值。

这段话简单的介绍了什么是Set,其中有这么一句话: 没有重复元素,也就是说Set集合中每个元素都是唯一的,不会重复。
相信到这里,我们心中应该会有一个想法💡:利用Set集合实现去重操作。具体可不可行,我们慢慢来看。

没有Set集合的时候

在ES5中,是没有Set集合的,一般的我们通过下面方式来模拟Set集合。

var set = Object.create(null);
set.foo = true;

// 检查属性是否存在
if (set.foo) {
  // todo...
}

我们发现,通过Object.create(null)的方法来创建一个原型为null的对象,从而实现不继承任何属性。

ES6中的Set集合使用

基本操作

创建Set:
let set = new Set();
添加元素:
set.add(5);
set.add('5');
删除元素:
set.delete(5); // 删除5这个元素
set.clear(); // 删除所有元素
检测set中是否存在某个这值:
set.has(5); //true
set长度:
console.log(set.size);

我们发现,我们可以同时设置一个String类型的5和Number类型的5,并不会像数组一样强制转换。(唯一例外的是,+0-0会被认为是相等的。

同样的,我们也可以添加对象, 并且也不会被强制转换,如果添加的值重复,则直接忽略:

let set = new Set();
let obj1 = {};
let obj2 = {};
set.add(obj1);
set.add(obj2);
set.add(obj2); // 本次重复,该操作直接忽略
console.log(set.size); //2

回到前面我们的猜想,利用set集合来实现数组去重操作:

let arr = [1,2,2,3,4,5,6,6];
let set = new Set(arr);
console.log(set.size) //6;

Set集合与forEach()方法

forEach方法相信大家已经很熟悉了,其回调函数接收三个参数:set集合中下一次索引位置、与第一个参数一样的值、被遍历的Set集合本身。

注意区分Array.prototype.forEach()

let set = new Set([1,2,3]);
set.forEach(function(val, key, ownerSet){
    console.log(val, key, ownerSet);
});
上一篇 下一篇

猜你喜欢

热点阅读