SE5的时候我们经常用数组或者类数组对象来操作数据,而对于一些使用惯了java之类语言的集合的开发人员来说,总有少了点什么的感觉,SE6提供Set和Map这两个集合。不仅从根本上为一些问题提供了解决方案(如数据不重复),还大大提升了性能。

要想理解Set和Map,就要从它的根本问题说起,在进行详细的API概览之前,我觉得有必要先说明两点:

  • 遍历Set和Map的顺序就是元素插入的顺序。这是与其它语言最不一样的地方,之所以这样定是因为负责实现ES6集合模块的作者经过实验验证,在javaScript中确定顺序遍历比不确定遍历效率要高。
  • Set和Map没有hash码。在其他语言,都能够自行实现一个哈希函数并暴露出系统默认的哈希函数,但在javaScript委员会选择了不暴露 。
关于第二点可能有些难理解,我们通过一个例子来说明:
var a = {name:"Jhon"};
var b = {name:"Jhon"};
var set = new Set();
set.add(a).add(b);
console.log(set.size); //2
//这两个对象应该按相同处理,毕竟它们有完全一样的属性。但在JavaScript中,它们是各自独立、互不相同的。

读万卷书不如操作一下,下面我就会对操作集合的这些API进行逐一的尝试验证,并且你会发现官方说明可能和浏览器实现是有差异的。

Set集合,没有重复元素的集合

var a = {name:"Jhon"};
var b = {name:"Jhon"};
var set = new Set(); // 创建一个新的,空的Set
set.add(a).add(6); //添加两个元素,add返回集合自身,可以链式调用
console.log(set[0]); //undefined,不支持索引遍历
console.log(set.size); //打印元素个数 2
set.forEach(function(value){ //遍历Set
console.log(value); //Object { name: "Jhon" },6
});
if(set.has(a)){ //判断是否存在某个元素
console.log("a"); //a
}
if(set.has(b)){ //false
console.log("b");
}
if(set.has({name:"Jhon"})){ //false
console.log("other");
}
var c = [1,2,2,3,4];
var setc = new Set(c); //new Set(iterable) :从任何可遍历数据中提取元素,构造出一个新的集合。
console.log(setc.size); //4,元素去重
console.log(setc.delete(4));//true,官方说delete会返回集合自身,但是在最新版火狐中如果元素存在,则返回true,反之返回false,链式调用会报出错
console.log(setc.size); //3
setc.clear(); //清空Set
console.log(setc.size); //0

//set.keys() 、 set.values() 和 set.entries() 返回各种迭代器,它们是为了兼容 Map 而提供的,所以我们待会儿再来看。

Map集合,由若干键-值对组成

var map = new Map(); //创建一个新的,空的Map
map.set("one",1); //增加列表项
map.set("two",2);
console.log(map.size); //2,获取元素个数
if(map.has("one")){ //true,判断元素存在
console.log("one");
}
console.log(map.get("one")); //1,根据key获取元素
map.forEach(function(value, key, map){ //遍历map
console.log(key + ":" + value); //one:1,two:2
});
for(var key of map.keys()){ //返回key的迭代器
console.log(key); //one,two
}
for(var value of map.values()){ //返回值的迭代器
console.log(value); //1,2
}
for(var [key,value] of map.entries()){ //返回项的迭代器
console.log(value); //1,2
}
console.log(map.delete("one")); //true,根据key删除项
map.clear(); //清空map
console.log(map.size); //0 var a = [["one",1],["two",2]];
var map1 = new Map(a); //new Map(pairs),通过数组或者已存在的map创建Map
map1.forEach(function(value, key, map){
console.log(key + ":" + value); //one:1,two:2
});

弱引用集合WeakSet和WeakMap

Map和Set都为内部的每个键或值保持了强引用,也就是说,如果一个对象被移除了,回收机制无法取回它占用的内存 ,除非在Map或者Set中删除它。

WeakSet并不对其中对象保持强引用。当WeakSet中的一个对象被回收时,它会简单地被从WeakSet中移除。WeakMap也类似地不为它的键保持强引用。如果一个键仍被使用,相应的值也就仍被使用 。
下面是弱引用集合的一些限制:
  • WeakMap只支持new、has、get、set 和delete。
  • WeakSet只支持new、has、add和delete 。
  • WeakSet的值和WeakMap的键必须是对象。
  • 都不可迭代,除非专门查询或给出你感兴趣的键,否则不能获得一个弱集合中的项 。
以上就是ES6集合的操作以及注意事项。



SE6新特性之集合Set、Map、WeakSet和WeakMap详解的更多相关文章

  1. Java 8新特性探究(八)精简的JRE详解

    http://www.importnew.com/14926.html     首页 所有文章 资讯 Web 架构 基础技术 书籍 教程 Java小组 工具资源 - 导航条 - 首页 所有文章 资讯 ...

  2. [转帖]Java 8新特性探究(八)精简的JRE详解

    Java 8新特性探究(八)精简的JRE详解 https://my.oschina.net/benhaile/blog/211804 精简版的api   撸了今年阿里.网易和美团的面试,我有一个重要发 ...

  3. Java8 新特性之集合操作Stream

    Java8 新特性之集合操作Stream Stream简介 Java 8引入了全新的Stream API.这里的Stream和I/O流不同,它更像具有Iterable的集合类,但行为和集合类又有所不同 ...

  4. [Java8教程]Java8新特性进阶集合

    Java8新特性进阶集合 基于 AOP 抽离方法的重复代码 Java8:当 Lambda 遇上受检异常 Java8:对字符串连接的改进 Java8:Java8 中 Map 接口的新方法 Java8:当 ...

  5. Android中实现java与PHP服务器(基于新浪云免费云平台)http通信详解

    Android中实现java与PHP服务器(基于新浪云免费云平台)http通信详解 (本文转自: http://blog.csdn.net/yinhaide/article/details/44756 ...

  6. 基于集合成工控机Ubuntu系统安装分区详解

    基于集合成工控机Ubuntu系统安装分区详解 硬件描述:双核的CPU,128G的固态硬盘 软件描述:使用Ubuntu12.04系统,内核3.8.0-29版本,QT4.8.1版本 1.新建分区表 /de ...

  7. Python操作redis学习系列之(集合)set,redis set详解 (六)

    # -*- coding: utf-8 -*- import redis r = redis.Redis(host=") 1. Sadd 命令将一个或多个成员元素加入到集合中,已经存在于集合 ...

  8. java集合HashMap、HashTable、HashSet详解

    一.Set和Map关系 Set代表集合元素无序,集合元素不可重复的集合,Map代表一种由多个key-value组成的集合,map集合是set集合的扩展只是名称不同,对应如下 二.HashMap的工作原 ...

  9. 2-4、nginx特性及基础概念-nginx web服务配置详解

    Nginx Nginx:engine X 调用了libevent:高性能的网络库 epoll():基于事件驱动event的网络库文件 Nginx的特性: 模块化设计.较好扩展性(不支持模块动态装卸载, ...

随机推荐

  1. oracle安装时,条件检查不通过解决办法

    1.开始菜单→ 运行:输入regedit,打开注册表 2.依次点开HKEY_LOCAL_MACHINE>>SYSTEM>>CurrenControlSet>>ser ...

  2. Glide 这样用,更省内存!!!

    一.前言 Glide 是 Google 官方推荐的一款图片加载库,使用起来也非常的简单便利,Glide 它帮我们完成了很多很重要,但是却通用的功能,例如:图片的加载压缩.展示.加载图片的内存管理等等. ...

  3. nodejs+express+mongoose无法获取数据库数据问题解决

    通过mongoose与mongodb进行操作.而mongoose是通过model来创建mongodb中对应的collection的,这样你通过如下的代码: mongoose.model('User', ...

  4. RabbitMQ高可用集群配置

    1.安装RabbitMQ 1)下载和安装erlang 下载erlang wget http://www.rabbitmq.com/releases/erlang/erlang-18.1-1.el6.x ...

  5. javascript-OOP基础详解

      前  言 S     N 今天给大家详解一下面向对象编程(简称OOP)基础,OOP 语言使我们有能力定义自己的对象和变量类型 .对象拥有属性和方法 . 所以今天就给大家详解对象和类 . 1-1简介 ...

  6. 【特效】页面滚动到相应位置运行css3动画

    请到我的个人博客网站上浏览此文章,欢迎评论和建议. 文章链接:http://www.xiaoxianworld.com/archives/87 现在css3动画很常见了,实际项目中经常应用,特别是那种 ...

  7. mysql登录出现1045错误修改方法

    在cmd中输入mysql -uroot -p出现1045错误如下: ERROR 1045(28000): Access denied for user 'root'@'localhost'(using ...

  8. [译]ASP.NET Core 2.0 中间件

    问题 如何创建一个最简单的ASP.NET Core中间件? 答案 使用VS创建一个ASP.NET Core 2.0的空项目,注意Startup.cs中的Configure()方法: public vo ...

  9. 【计算机网络】应用层(一) HTTP

      HTTP报文 HTTP报文是HTTP应用程序间发送的数据块,它由三部分组成:起始行(start line),首部(header)和主体(body),如下图所示:   从分类上,报文又可以分为请求报 ...

  10. .NET采集数据,放入数据库总结

    第一次做采集Json的还简单一些但是XML的简直了......... JSON //采集数据 public string GetBetRecordToRepository()//随便你返回什么 { t ...