当前位置:首页 > Es6 Map数据结构 (读阮老师Es6基础笔记)

Es6 Map数据结构 (读阮老师Es6基础笔记)

发布于 2018-04-28 阅读 497 次 Javascript ES6
####首先简单解释一下什么是Map,为毛有它 javascript有Object来表示键值对的数据结构,大家都知道,但是这种结构只能用字符串来定义键名,偏偏我们就是傲娇, 看我傲娇的小眼神![]( http://image.w2le.com/6d6c642385d629187ae3cb8b23849343)我就想用其他的数据类型来定义键值,所以es6就给了我们这个蛋糕Map来响应广大需求者的号召,没错Map就是这么任性,想用什么类型来表示键名,都是阔以的,对象,数组,bool统统都木有问题,只要你喜欢,随便用 ####首先说说如何定义一个Map *构造函数定义,add一个个的添加* ```javascript var map = new Map(); map.set('a', 123); map.set('b', 456); map.set({},123); map.get('a'); //123 map.get('b'); //456 ``` ![](http://image.w2le.com/7f48e07cf3bcb65d1c5484bd04ed67fb) *太麻烦,一个个的添加不是我懒人的风格,来个简单的* ####数组生成大法,Set生成 Map生成 *其实只要是具有Iterator接口,且每个成员都是具有双元素数组的数据结构都可以生成Map* ```javascript const mapFromArr = new Map([ ['name', 'Xiaoyaoji'], ['age', '18'] ]); var set = new Set([ ['name', 'Xiaoyaoji'], ['age', '18'] ]) const mapFromSet = new Map(set); const mapFromMap = new Map(mapFromArr); ``` ####Map的方法和属性 `属性` ——Map.prototypeof.size //获取Map数据结构的成员数量 ——Map.prototypeofconstructor //获取构造函数,默认是Map `方法` has()//判断是否有某个成员,返回bool delete() //删除某个成员 返回bool get() //获取某个成员的值 set() //设置某个成员的值 返回整个Map结构 clear() //清空Map,没有返回值 ```javascript var set = new Set([ ['name', 'Xiaoyaoji'], ['age', '18'] ]) const map = new Map(set); map.has('a'); //false map.has('name'); //true map.delete('name'); map.get('name') //undefined map.set('name','Doubibi'); //true map.get('name');//Doubibi ``` ####get()取值注意 *Map的键值适合键的内存地址绑定的,所以要得到相同的值,必须键值是两个绝对相等的值,所以下面的代码会返回undefined,因为{}和{}是不同的地址引用,所以下面代码的最后一行返回的是undefined,虽然NaN和NaN不严格相等但是,Map数据结构认为是取同一个值* ```javascript var map = new Map(); map.set('a', 123); map.set('b', 456); map.set({},123); map.get('a'); //123 map.get('b'); //456 map.get({}); //undefined ``` 由下图可以看出Map的Iterator接口是entries方法,其遍历方法类似Set ![](http://image.w2le.com/a2765b3c5b018542e91a78f09e7bdaab) ####所以可以用for of遍历Map ```javascript for(let [key,value] of map){ console.log(key,value) } ``` Map 还有一个forEach方法,与数组的forEach方法类似,也可以实现遍历。 ```javascript map.forEach(function(value, key, map) { console.log("Key: %s, Value: %s", key, value); }); ``` ####Map和其他类型的相互转换 ```javascript //Map转成数组 var arr = [...map]; var arr2 = Array.From(map); ```