ECMAScript6--12.Set—Map与数组和对象的比较 ECMAScript6--12.Set—Map与数组和对

通过对比：
- 在这个数据开发中涉及数据结构，能使用Map不使用数组，尤其是复杂的数据结构；
- 如果对数据结构要求存储的唯一性，考虑使用Set，（优先使用Map，如果对数据要求比较高，保证每个数据的唯一性，用Set）放弃使用object；
  --Map删除的成本最低；
  --Set和Map的语义上最优；

1. 数据结构：
ES5:涉及的数据结构主要使用数组（Array）和对象（Object）来存储；
ES6中新增加Set和Map；

Map与Array的对比

Set与Array的对比

为了理解什么情况下用Set、什么情况下用Map，需要和数组Array和Object做一个横向的对比；通过对比可以更清楚怎么选择；
数据结构主要围绕四个点，增、查、改、删；
数据结构横向对比:增、查、改、删

{let map = new Map(); let array = []; //增; //通过set给数据结构增加内容； //增加k等于t，value等于1 map.set('t',1); //数组的增加通过push或者unshift； array.push({t:1}); console.info('map-array',map,array); //map-array Map{"t"=>1}[Object] [{0:Object{t:1},length:1}]//查; //这个数据结构中有没有这个值；返回的是boolean； //对于map，提供has方法表明这个数据结构当前有没有这个数据项； let map_exist = map.has('t'); //array：通过find作为查；数组的查询是存在就返回当前的对象； //箭头函数：遍历每一个数组的元素,如果元素中存在t这个key值，说明这个就是存在的； let array_exist = array.find(item=>item.t); console.info('map-array',map_exist,array_exist); //map-arraytrueObject{t:1}//改: //通过set改变 map.set('t',2); //数组通过forEach的遍历，先要判断这个值是不是存在，存在才能修改 array.forEach(item=>item.t?item.t=2:''); console.info('map-array=-modify',map,array); //map-array-modifyMap{"t"=>2}[Object] [{0:Object{t:2},length:1}]//删： map.delete('t'); //在数组这个数据结构中把某一项删除的效果； //数组中提供一个方法splice做删除，这个方法要查到要删除元素所在的位置（索引） //对索引的查询数组中，findIndex； //箭头函数：查找每一个元素中包含带t的值的； //找到这个值的索引之后； let index =array.findIndex(item=>item.t); //通过splice方法，删除当前的元素； array.splice(index,1); console.info('map-array-empty',map,array); //map-array-empty Map{} [] }

Set和数组Array的对比：

{ let set = new Set(0; let array = []; //增： set.add({t:1}); array.push({t:1}); console.info('set-array', set, array); //set-arraySet{Object{t:1}}[Object][{0:Object{t:1},length:1}]//查： //返回是false{t:1}是新生产的一个对象; //这个地方想要返回true，{t:1}这个对象一定是保存过，查那个地址通过has就能查到了； let set_exist = set.has({t:1}); let array_exist = array.find(item=>item.t); console.info('set-array',set_exist,array_exist); //set-arrayfalseObject{t:1}//改： //如果用add那个元素的值是一个新的对象，不会把原来的值修改，是新增的； set.forEach(item =>item.t?item.t=2:''); array.forEach(item =>item.t?item.t=2:''); console.info('set-array-modify',set,array); //set-array-modifySet{Object{t:2}}[Object][{0:Object{t:2},length1}]//删 //set需要先找到哪个值在删除； set.forEach(item=>item.t?set.delete(item):''); //数组先找到那个值的索引在删除； let index =array.findIndex(item=>item.t); array.splice(index,1); console.info('set-array-empty',set,array); //set-array-empty Set{} [] }

【ECMAScript6--12.Set—Map与数组和对象的比较】2.数据结构

Map与Object的对比：

Set与Object的对比：

{ let item ={t:1}; let map = new Map(); let set = new Set(); let obj ={}; //增： map.set('t',1); set.add(item); obj['t'] =1; console.info('map-set-obj',obj, map, set); //map-set-objObject{t:1} Map{"t"=>1} Set{Object{t:1}}//查 let map_exist = map.has('t'); let set_exist = set.has(item); let obj_exist = 't' in obj; console.info('set-map-obj_exist',map_exist,set_exist,obj_exist); //set-map-obj_existtrue true true//改 map.set('t',2); item.t=2; obj['t']=2; console.info('map-set-obj-modify',obj, map, set); //map-set-obj-modifyObject{t:2}Map{"t"=>2} Set{Object{t:2}} //删 map.delete('t'); set.delete(item); delete obj['t']; console.info('map-set-obj-empty',obj, map, set); //map-set-obj-empty Object{} Map{} Set{} }