Map、Set、Array、Obj数据结构对比

ES5中 都是用对象Object和数组做存储 Array,es6 新增了Set和Map,那我们什么情况下用map 什么情况下用Set呢，接下来我们需要和数组和对象做对比

数据结构主要对应四个点 增、删 、改、查、

Map和Array做对比

let map = new Map()
let array = [];

//增
map.set('t',1)
array.push({t:1})
console.info('map-array',map,array)

//查询
let map_exist = map.has('t')
let arr_exist = array.find(item=>item.t)
console.info('map-array',map_exist,arr_exist)
// true 1(如果值存在就把值反回来)

//改
map.set('t',2)
array.forEach(item =>item.t?item.t=2:'')
//通过遍历然后判断这个值是否存在才能修改
console.info('map-array-modify',map,array)

//删除
map.delete('t');
let index = array.findIndex(item => item.t)
array.splice(index,1)
console.info('map-array-delect',map,array)

Set 和 array对比

let set = new Set()
let array = []

//增
set.add({t:1})
array.push({t:1})
console.log('set-array',set,array)

//查询
let set_exist = set.has({t:1})//false 数据先存储过才能查 只是说明方法
let arr_exist = array.find(item=>item.t)
console.info('set-array',set_exist,arr_exist)

//改
//set的add新增的值不会检测到 不是修改而是新增一个 所以要遍历
set.forEach(item =>item.t?item.t=2:'')
//array通过遍历然后判断这个值是否存在才能修改
array.forEach(item =>item.t?item.t=2:'')
console.info('set-array-modify',set,array)

//删
set.forEach(item=>item.t?set.delete(item):'')
let index = array.findIndex(item => item.t)
array.splice(index,1)
console.info('set-array-delete',set,array)

Map、Set、Obj数据结构对比

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',map,set,obj)

//查询
console.info({
    map_exist:map.has('t'),//true
    set_exist:set.has(item),//true
    obj_exist:'t' in obj  //true
})

//改
map.set('t',2)
item.t= 2 //set如果存储数据就更改数据本身 没有就forEach循环
obj['t'] = 2
console.info('map-set-obj-modify',map,set,obj)

//删
map.delete('t')
set.delete(item)
delete obj['t']
console.info('map-set-obj-delete',map,set,obj)

个人总结：在整个项目开发中，尤其是复杂的数据结构，能使用Map不使用数组，如果对数据存储的唯一性使用Set

优先使用Map，对数据要求比较高唯一性的使用set，放弃传统的obj和array

赏

谢谢你请我吃糖果

支付宝

微信