zoukankan      html  css  js  c++  java
  • Map的使用

      1     ES6新增的数据结构 Map 的用法;
      2     JavaScript的Object本身就是键值对的数据结构,但实际上属性和值构成的"字符串-值"对,属性只能是字符串
        ,如果传个对象字面量作为属性名,那么会默认把对象转换为字符串,结果这个属性名就编程了"[object Object]" 3 ES6提供了"值-值"对的数据结构,键名不仅可以是字符串,也可以是对象。它是一个更完善的Hash结构。 4 特性: 5 1,键值对,键可以是对象。 6 const map1 = new Map(); 7 const objkey = {p:"v1"}; 8 9 map1.set(objkey,"hello");//设置属性给map对象。 10 console.log(map1.get(objkey));//;利用Map的方法get()方法获取到键值。 11 结果: 12 console.log(map1.get(objkey));//hello 13 2,Map 可以接受数组作为参数,数组成员还是一个数组,其中有两个参数,一个表示键一个表示值。 14 const map2 = new Map(['name','aissen'],['age',12]); 15 console.log(map2.get('name'));//aissen 16 console.log(map2.get('age'));//12 17 18 操作: 19 1,size 20 获取map的大小。 21 const map3 = new Map(); 22 map3.set('k1',1); 23 map3.set('k2',2); 24 map3.set('k3',3); 25 console.log('%s',map3.size);//3 26 27 2,set 28 设置毽值对,毽可以是各种类型,包括undefined,function 29 const map4 = new Map(); 30 Map4.set('k1',6); //键是字符串 31 Map4.set(222,'哈哈哈');//键是数值 32 Map4.set(undefined,'gagaga');//键是undefined 33 const fun = function(){console.log('hello');}; 34 map4.set(fun,'fun');//键是function 35 36 console.log('map4 size:%s',map4.size); 37 console.log('undefined value :%s',map4.get(undefined)); 38 console.log('fun value:%s',map4.getfun(fun)); 39 40 结果: 41 map4.size:4; 42 undefined value: gagaga; 43 fun value:fun 44 也可对set进行链式调用。 45 map4.set('k2',2).set('k3',4).set('k4',5); 46 console.log('map4 size:%s',map4.size); 47 结果: 48 map4 size:7; 49 50 3,get 51 获取键对应的值。 52 const map5 = new Map(); 53 map5.set('k1',6); 54 console.log('map5 value:%s',map5.get('k1')); 55 结果: 56 map5 value:6; 57 4,has 58 判断指定的键值是否存在。 59 const map6 = new Map(); 60 map6.set(undefined,4); 61 console.log('map6 undefined:%s',map6.has(undefined)); 62 console.log('map6 k1:%s',map6.has('k1')); 63 结果: 64 map6 undefined:true; 65 map6 k1: false; 66 5,delete 67 删除键值对。 68 const map7 = new Map(); 69 map7.set(undefined,4); 70 map7.delete(undefined); 71 console.log('map7 undefined:%s',map7.has(undefined)); 72 结果: 73 map7 undefined:false; 74 6,clear 75 删除map所有的键值对。 76 const map8 = new Map(); 77 map8.set('k1',1); 78 map8.set('k2',2); 79 map8.set('k3',3); 80 console.log('map8,pre-clear size:%s',map8.size); 81 map.8clear(); 82 console.log('map8,post-clear size:%s',map8.size); 83 结果: 84 map.8,pre-clear size:3; 85 map.8,post-clear size:0; 86 87 遍历 88 1,key() 89 遍历map的所有key。 90 const map9 = new Map(); 91 map9.set('k1',1); 92 map9.set('k2',2); 93 map9.set('k3',3); 94 for(let key of map9.keys()){ 95 console.log(key); 96 } 97 结果: 98 k1,k2,k3 99 2,values 100 遍历map所有的值。 101 for(let value of map9.values()){ 102 console.log(value); 103 } 104 结果: 105 1,2,3 106 3,entries() 107 遍历map的所有的键值对。 108 方法1: 109 for(let item of map9.entries()){ 110 console.log(item[0],item[1]); 111 } 112 结果: 113 k1 1 114 k2 2 115 k3 3 116 方法2: 117 for(let [key,value] of map9.entries()){ 118 console.log(key,value); 119 } 120 结果不变。 121 4,forEach() 122 遍历map的所有的键值对。 123 map9.forEach(function(value,key,map){ 124 console.log("key:%s,value:%s"key,value); 125 }); 126 key:k1,value:1; 127 key:k2,value:2; 128 key:k3,value:3; 129 forEach有第二个参数,可以用来绑定this。 130 这样有个好处,map的存储的数据和业务处理对象可以分离,业务处理对象可以尽可能的按职责分割的明确符合SRP原则。 131 const output = { 132 log:function(key,value){ 133 console.log("key:%s,value:",key,value); 134 } 135 }; 136 map9.forEach(function(value,key,map){ 137 this.log(key,value); 138 },output); 139 和其他结构的互转 140 1 Map To Array 141 使用扩展运算符三个点(...)可将map内的元素都展开的数组。 142 const map10 = new Map(); 143 map10.set('k1',1); 144 map10.set('k2',2); 145 map10.set('k3',3); 146 console.log([...map10]); 147 结果: 148 [['k1',1]['k2',2]['k3',3]] 149 2,Array To Map; 150 使用数组构造Map。 151 const map11 = new Map([ 152 ['name','aissen'], 153 ['age',12] 154 ]); 155 console.log(map11); 156 结果: 157 Map{'name'=>'aissen','age'=>12} 158 3,Map To Object 159 写一个转换函数,遍历map的所有元素,将元素的键和值作为对象属性名和值写入Object中。 160 function mapToObj(map){ 161 let obj = Object.create(null); 162 for(let [k,v] of map){ 163 obj[k] = v; 164 } 165 return obj; 166 } 167 const map12 = new Map().set('k1',1).set({pa:1},2); 168 console.log(mapToObj(map12)); 169 结果: 170 { k1: 1, '[object Object]': 2 } 171 4,Object To Map 172 同理,再写一个转换函数便利Object,将属性名和值作为键值对写入Map。 173 function objToMap(obj){ 174 let map = new Map(); 175 for(let k of Object.keys(obj)){ 176 map.set(k,obj[k]); 177 } 178 return map; 179 } 180 console.log(objToMap({yes:true,no:false})) 181 结果: 182 Map { 'yes' => true, 'no' => false } 183 5,Set To Map 184 const set= new Set([['foo',1],['bar',2]]); 185 const map13 = new Map(set); 186 console.log(map13); 187 结果: 188 Map{'foo'=> 1,'bar'=>2} 189 6,Map To Set 190 function mapToSet(map){ 191 let set = new Set(); 192 for(let [k,v] of map){ 193 set.add([k,v]); 194 } 195 return set; 196 } 197 const map14 = new Map().set('k1',1).set('k2',2); 198 console.log(mapToSet(map14)); 199 结果: 200 Set{ [ 'k1' , 1 ],[ { pa : 1 } , 2] }
  • 相关阅读:
    adb shell am pm 用法
    HTML的属性和css基础
    HTML的实际演练2
    HTML的实际演练1
    HTML的标签简介
    HTML的基础知识
    Python之 ---成员修饰符
    Python基础之-----------函数
    Python之-------基础数据类型
    Python之内置函数
  • 原文地址:https://www.cnblogs.com/l8l8/p/8835877.html
Copyright © 2011-2022 走看看