ES6中map和set用法
ES6中map和set用法
--转载自廖雪峰的官方网站
一、map
Map是一组键值对的结构,具有极快的查找速度。
举个例子,假设要根据同学的名字查找对应的成绩,如果用Array实现,需要两个Array:
var names = ['Michael', 'Bob', 'Tracy'];
var scores = [95, 75, 85];
给定一个名字,要查找对应的成绩,就先要在names中找到对应的位置,再从scores取出对应的成绩,Array越长,耗时越长。
或者通过object键值对的方式来实现存储和查找:
var names = Object.create({'Michael':95,'Bob':75,'Tracy':85});
但是如果这个表十分庞大的时候,查询速度也是很感人的。
所以ES6提供了map方法来提高查询的速度,如果用Map实现,只需要一个“名字”-“成绩”的对照表,直接根据名字查找成绩,无论这个表有多大,查找速度都不会变慢。如果用Map实现,只需要一个“名字”-“成绩”的对照表,直接根据名字查找成绩,无论这个表有多大,查找速度都不会变慢。
var m=new Map();
m.set('Adam', 67); // 添加新的key-value
m.set('Bob', 59);
console.log(m);//Map { 'Adam' => 67, 'Bob' => 59 }
console.log(m.has('Adam')); // 是否存在key 'Adam': true
console.log(m.get('Adam')); // 67
console.log(m.delete('Adam')); // 删除key 'Adam':true
console.log(m.get('Adam')); // undefined
ES6中Map相对于Object对象有几个区别:
Object对象有原型, 也就是说他有默认的key值在对象上面, 除非我们使用Object.create(null)创建一个没有原型的对象;
在Object对象中, 只能把String和Symbol作为key值, 但是在Map中,key值可以是任何基本类型(String, Number, Boolean, undefined, NaN….),或者对象(Map, Set, Object, Function , Symbol , null….);
通过Map中的size属性, 可以很方便地获取到Map长度, 要获取Object的长度, 你只能用别的方法了;
Map实例对象的key值可以为一个数组或者一个对象,或者一个函数,比较随意 ,而且Map对象实例中数据的排序是根据用户push的顺序进行排序的, 而Object实例中key,value的顺序就是有些规律了, (他们会先排数字开头的key值,然后才是字符串开头的key值);
二、set
Set和Map类似,也是一组key的集合,但不存储value。由于key不能重复,所以,在Set中,没有重复的key。
要创建一个Set,需要提供一个Array作为输入:
var arr=[1,2,3,3,'3'];
var s1=new Set(arr);
console.log(s1);//Set { 1, 2, 3, '3' }
s1.add(4);//重复添加无用
console.log(s1);//Set { 1, 2, 3, '3', 4 }
s1.delete(4);
console.log(s1);//Set { 1, 2, 3, '3' }
感觉set的用法可以有两个地方
因为key不能重复,所以可以用来去掉array中的重复元素。
'use strict';
// var set = new Set([1,2,1,2,2,1]);
var arr = [1,2,1,2,2,1];
//new Set 数组去重
function unique(arr){
return Array.from(new Set(arr));
};
//使用ES6的方法可以去重.
console.log(unique(arr));可以用来统计键(这个暂时还没想到应用场景)
小结
Map和Set是ES6标准新增的数据类型,请根据浏览器的支持情况决定是否要使用。
ES6中map和set用法的更多相关文章
- ES6中Map数据结构学习笔记
很多东西就是要细细的品读然后做点读书笔记,心理才会踏实- Javascript对象本质上就是键值对的集合(Hash结构),但是键只能是字符串,这有一定的限制. 1234 var d = {}var e ...
- [转] C++ STL中map.erase(it++)用法原理解析
总结一下map::erase的正确用法. 首先看一下在循环中使用vector::erase时我习惯的用法: for(vector<int>::iterator it = vecInt.be ...
- ES6中map数据结构学习
在项目中遇到一个很恶心的需求,然后发现ES6中的map可以解决,所以简单学习了一下map. Javascript的Object本身就是键值对的数据结构,但实际上属性和值构成的是“字符串-值”对,属性只 ...
- ES6中Arguments和Parameters用法解析
原文链接 译文 ECMAScript 6 (也称 ECMAScript 2015) 是ECMAScript 标准的最新版本,显著地完善了JS中参数的处理方式.除了其它新特性外,我们还可以使用rest参 ...
- C++中map的介绍用法以及Gym题目:Two Sequences
Map是STL的一个关联容器,它提供一对一(其中第一个可以称为关键字(key),每个关键字只能在map中出现一次,第二个可能称为该关键字的值(value))的数据 处理能力,由于这个特性,它完成有可能 ...
- python中map()函数的用法讲解
map函数的原型是map(function, iterable, -),它的返回结果是一个列表. 参数function传的是一个函数名,可以是python内置的,也可以是自定义的. 参数iterabl ...
- ES6中Map与其他数据结构的互相转换
最近在学习ES6的基础知识,整理了一下Map与其他数据结构相互转换的写法. Map转为数组的方法 let myMap = new Map([[true, 7], [{foo: 3}, ['abc']] ...
- Es6中Map对象和Set对象的介绍及应用
map和set的方法,工作中有使用到,所以学习一下: Map 对象 Map 对象保存键值对.任何值(对象或者原始值) 都可以作为一个键或一个值. var myMap = new Map(); myMa ...
- python中map函数的用法
map函数类似一个生成器 具体用例如下: def add(x): a =[,,] b = map(add,[,,]) print( list(map(add,[,,])) ) print(b,type ...
随机推荐
- css3如何实现圆角边框
圆角边框是css3新增属性,在圆角边框出现之前,前端开发有的采用整块的圆角图片作为背景,有的采用小的圆角图片分别放在元素的四角,非常麻烦,灵活性差,也达到降低了网站的整体性能,而圆角边的出现则降低了开 ...
- Spring学习之路
(一)搭建Spring.NET环境常见的DLL 1.spring.core --整个框架的基础,实现了依赖注入的功能 2.Spring.AOP--提供面向方面编程(aop)的支持 3.Spring.D ...
- 【转】分布式环境下5种session处理策略(大型网站技术架构:核心原理与案例分析 里面的方案)
前言 在搭建完集群环境后,不得不考虑的一个问题就是用户访问产生的session如何处理.如果不做任何处理的话,用户将出现频繁登录的现象,比如集群中存在A.B两台服务器,用户在第一次访问网站时,Ngin ...
- IT小鲜肉 Widgets Tree 单选、多选、相关回调函数、获取选中的节点功能
写一个树控件并没有想象中的那么容易,今天又花了我一个1个多小时,主要为IT小鲜肉 Widgets Tree控件添加了 单选.多选.选择前和选择后两个回调函数.获取选中节点的功能.后面会继续努力完善这个 ...
- $.extend 的相关用法
1.1 $.extend(result,item1,item2…..) 将所有的参数项都合并result中,返回result,会破坏result的结构. 1.2 $.extend({},item1,i ...
- 【Android】RxJava的使用(三)转换——map、flatMap
前两篇Android RxJava的使用(一)基本用法.Android RxJava的使用(二)Action介绍了RxJava的基本用法,对Rxjava还不了解的请先看以上两篇.这篇为大家讲解RxJa ...
- 分布式部署下的报表调用 API调用 权限问题以及性能方案
背景描述: 客户的实际情况是需要在具体系统构架前,通过与厂商讨论确定最终的系统架构方案. 需求是客户自己有管理系统,希望建立一个独立的报表服务器,该报表服务器可以对多个管理系统提供报表服务,不知 ...
- 【Python】Java程序员学习Python(二)— 开发环境搭建
巧妇难为无米之炊,我最爱的还是鸡蛋羹,因为我和鸡蛋羹有段不能说的秘密. 不管学啥,都要有环境,对于程序员来说搭建个开发环境应该不是什么难题.按顺序一步步来就可以,我也只是记录我的安装过程,你也可以滴. ...
- oracle常见的等待事件说明
转自 http://blog.itpub.net/29371470/viewspace-1063994/ 1. Buffer busy waits 从本质上讲,这个等待事件的产生仅说明了一个会话在等待 ...
- [翻译] 扩张卷积 (Dilated Convolution)
英文原文: Dilated Convolution 简单来说,扩张卷积只是运用卷积到一个指定间隔的输入.按照这个定义,给定我们的输入是一个2维图片,扩张率 k=1 是通常的卷积,k=2 的意思是每个输 ...