ES6提供了新的数据结构Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。Set本身是一个构造函数,用来生成Set数据结构。

  1. var s = new Set();
  2. [2, 3, 5, 4, 5, 2, 2].map(x => s.add(x));
  3. for (let i of s) {
  4. console.log(i);
  5. }
  6. // 2 3 5 4

上面代码通过add方法向Set结构加入成员,结果表明Set结构不会添加重复的值。

去除数组重复:

  1. var set = new Set([1, 2, 3, 4, 4]);
  2. [...set]
  1. // 去除数组的重复成员
  2. [...new Set(array)]
  3.  
  4. Set实例的属性和方法:

  Set结构的实例有以下属性。

  • Set.prototype.constructor:构造函数,默认就是Set函数。
  • Set.prototype.size:返回Set实例的成员总数。

Set实例的方法分为两大类:操作方法(用于操作数据)和遍历方法(用于遍历成员)。

四个操作方法:

  • add(value):添加某个值,返回Set结构本身。
  • delete(value):删除某个值,返回一个布尔值,表示删除是否成功。
  • has(value):返回一个布尔值,表示该值是否为Set的成员。
  • clear():清除所有成员,没有返回值。
  1. s.add(1).add(2).add(2);
  2. // 注意2被加入了两次
  3.  
  4. s.size //
  5.  
  6. s.has(1) // true
  7. s.has(2) // true
  8. s.has(3) // false
  9.  
  10. s.delete(2);
  11. s.has(2) // false

对比Object结构和Set结构的写法不同。

  1. // 对象的写法
  2. var properties = {
  3. 'width': 1,
  4. 'height': 1
  5. };
  6.  
  7. if (properties[someName]) {
  8. // do something
  9. }
  10.  
  11. // Set的写法
  12. var properties = new Set();
  13.  
  14. properties.add('width');
  15. properties.add('height');
  16.  
  17. if (properties.has(someName)) {
  18. // do something
  19. }

Array.from方法可以将Set结构转为数组

  1. var items = new Set([1, 2, 3, 4, 5]);
  2. var array = Array.from(items);

遍历操作

Set结构的实例有四个遍历方法,可以用于遍历成员。

  • keys():返回键名的遍历器
  • values():返回键值的遍历器
  • entries():返回键值对的遍历器
  • forEach():使用回调函数遍历每个成员

需要特别指出的是,Set的遍历顺序就是插入顺序。这个特性有时非常有用,比如使用Set保存一个回调函数列表,调用时就能保证按照添加顺序调用。

  1. let set = new Set(['red', 'green', 'blue']);
  2.  
  3. for (let item of set.keys()) {
  4. console.log(item);
  5. }
  6. // red
  7. // green
  8. // blue
  9.  
  10. for (let item of set.values()) {
  11. console.log(item);
  12. }
  13. // red
  14. // green
  15. // blue
  16.  
  17. for (let item of set.entries()) {
  18. console.log(item);
  19. }
  20. // ["red", "red"]
  21. // ["green", "green"]
  22. // ["blue", "blue"]

Set结构的实例的forEach方法,用于对每个成员执行某种操作,没有返回值。

  1. let set = new Set([1, 2, 3]);
  2. set.forEach((value, key) => console.log(value * 2) )
  3. //
  4. //
  5. //

ES6笔记03-Set和Map数据结构的更多相关文章

  1. es6笔记(5)Map数据结构

    概要 字典是用来存储不重复key的Hash结构.不同于集合(Set)的一点,字典使用的是[key,value]的形式来存储数据. JavaScript的对象(Object:{})只能用字符串当做key ...

  2. ES6学习笔记(10)----Set和Map数据结构

    参考书<ECMAScript 6入门>http://es6.ruanyifeng.com/ Set和Map数据结构 1.Set  基本用法    Set是一种新的数据结构,它的成员都是唯一 ...

  3. ES6中的Set与Map数据结构

    本文实例讲述了ES6学习笔记之Set和Map数据结构.分享给大家供大家参考,具体如下: 一.Set ES6提供了新的数据结构Set.类似于数组,只不过其成员值都是唯一的,没有重复的值. Set本身是一 ...

  4. ES6中的Set、Map数据结构

    Map.Set都是ES6新的数据结构,他们都是新的内置构造函数.也就是说typeof的结果,多了两个. 他们是什么:  Set是不能重复的数组.    Map是可以任何东西当做键的对象: ES6 提供 ...

  5. es6 学习7 Set 和 Map 数据结构

     Set 和 Map 数据结构 一.Set ES6 提供了新的数据结构 Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. const set = new Set([1, 2, 3, 4, ...

  6. es6(三set和map数据结构)

    es6中提供了一个新的数据结构Set,他有点类似数组,但和数组不同的是,在里面你如果写入重复的值的话,他不会显示重复值. const s =new Set(); [2,3,4,5,6,6,6,7,8, ...

  7. es6笔记(4) Set数据结构

    概要 介绍: 集合是由一组无序且唯一的项组成的,这个数据结构使用了与有限集合相同的数学概念,应用在计算机的数据结构中. ES6提供了数据结构Set.它类似于数组,但是没有重复的值. 特点: key与v ...

  8. js ES6 Set和Map数据结构详解

    这篇文章主要介绍了ES6学习笔记之Set和Map数据结构,结合实例形式详细分析了ECMAScript中基本数据结构Set和Map的常用属性与方法的功能.用法及相关注意事项,需要的朋友可以参考下   本 ...

  9. ES6中Map数据结构学习笔记

    很多东西就是要细细的品读然后做点读书笔记,心理才会踏实- Javascript对象本质上就是键值对的集合(Hash结构),但是键只能是字符串,这有一定的限制. 1234 var d = {}var e ...

  10. es6学习笔记-set和map数据结构

    ES6 提供了新的数据结构 Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set 本身是一个构造函数,用来生成 Set 数据结构. const s = new Set(); [2, 3 ...

随机推荐

  1. C# 使用消息队列,包括远程访问

    转:https://www.cnblogs.com/80X86/p/5557801.html 功能需求,用到了队列,用的时候出了很多问题,现在总结一下,希望能对有需要的人提供帮助. 我的需求很简单,就 ...

  2. IOS如何打越狱包xcode无证书打包ios应用

    本文要介绍的是在无证书的情况下如何将自己应用打包出去在越狱设备上使用或发给第三方使用企业签名进行应用分发. 前提条件:拥有appleId账号,并且该账号已经注册开发者中心(无需花钱) 教程开始: 1. ...

  3. 定时备份oracle数据库脚本文件

    @echo off REM ########################################################### REM # Windows Server 2003下 ...

  4. Hibernate课程 初探一对多映射4-1 inverse属性

    1 <Set>节点的inverse属性默认由one方来维护(默认值为false).将inverse属性修改为true则由多方来维护.

  5. 将Spring源码转换为工程 + 导入Eclipse时缺失jar包

    将源码转换为工程: 比如查看Spring事务部分的源码. 打开cmd窗口,切换到Spring-tx文件夹下,执行命令 “gradle cleanidea eclipse” . 缺失jar包: 第一步: ...

  6. 内表转WORD

    组合HTML字符串的方法来导出WORD文件 DATA: BEGIN OF wa_html, zhtml(), END OF wa_html, gt_html LIKE TABLE OF wa_html ...

  7. css3 animatehue属性

    -webkit-perspective(-moz,-o,perspective下同)表示透视范围大小: -webkit-transform-style很好理解了,表示变换类型,preserve-3d看 ...

  8. Android Vmp加固实现流程图

    0x00: 目前各种加固都说是VMP了,简单分析市面上的加固,然后自己实现了一个类似原理的加固,大致流程图如下: 加固端: 解释器:

  9. URL地址中中文乱码详解(javascript中encodeURI和decodeURI方法、java.net.URLDecoder.encode、java.net.URLDecoder.decode)

    引言: 在Restful类的服务设计中,经常会碰到需要在URL地址中使用中文作为的参数的情况,这种情况下,一般都需要正确的设置和编码中文字符信息.乱码问题就此产生了,该如何解决呢?且听本文详细道来. ...

  10. 屏蔽各类弹窗广告(WPS、智能云输入法)

    托盘中的广告“领取双11红包,最高1111元”的罪魁祸首是“智能云输入法” 广告在托盘中闪动: 结束SCSkinInst.exe后,托盘中的广告消失: 智能云输入法的安装路径可参考: C:\Progr ...