ES6中的Set集合

在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);
});
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 第2章 基本语法 2.1 概述 基本句法和变量 语句 JavaScript程序的执行单位为行(line),也就是一...
    悟名先生阅读 9,714评论 0 13
  • Set集合是一种无重复元素大的列表,开发者一般不会逐一读取数组中的元素,也不太可能逐一访问Set集合的每一个元素,...
    厂厂哥阅读 3,816评论 0 1
  • 第一章:块级作用域绑定 块级声明 1.var声明及变量提升机制:在函数作用域或者全局作用域中通过关键字var声明的...
    BeADre_wang阅读 4,392评论 0 0
  • 我在寻找人生意义的路上逐渐认清自我 朋友总说我显得老成,不光是外表还有思想。相比起来,我确实比同龄人成熟不少,倒不...
    重约三十吨阅读 1,864评论 1 1
  • 1..谈谈行动营之前的我? 凡事想的多,总是在脑海里一遍一遍的计划着,与其说是计划,又不如说是想像,还未有什么开始...
    SofiaSu阅读 1,162评论 0 0

友情链接更多精彩内容