本篇文章给大家带来的内容是关于es6中set和map的对比介绍(附代码),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。
set
1、add()方法和size属性
{ let list = new set(); // add()方法向set数据添加元素 list.add(5); list.add(7); // size属性返回数据的长度 console.log(list.size); // 2 let arr = [1, 2, 3, 4, 5]; let set = new set(arr); console.log(set, set.size); // set(5) {1, 2, 3, 4, 5} 5}
2.set的元素必须是唯一的
{ let list = new set(); list.add(1); list.add(2); list.add(1); // 重复元素不会添加进去 console.log(list); // set(2) {1, 2} // 数组去重 let arr = [1, 2, 3, 1, '2']; let list2 = new set(arr); console.log(list2); // set(4) {1, 2, 3, 2}}
3.has(),delete(),clear()
{ let arr = ['add', 'delete', 'clear', 'has']; let list = new set(arr); console.log(list.has('add')); // true list.delete('add'); console.log(list); // set(3) {delete, clear, has} list.clear(); console.log(list); // set(0) {}}
4.set的遍历
{ let arr = ['add', 'delete', 'clear', 'has']; let list = new set(arr); // set结构的数据,key和value是同一个值 for (let value of list) { console.log('value', value); // 'add' 'delete' 'clear' 'has' } for (let key of list.keys()) { console.log('keys', key); // 'add' 'delete' 'clear' 'has' } for (let value of list.values()) { console.log('values', value); // 'add' 'delete' 'clear' 'has' } for (let [key, value] of list.entries()) { console.log('entries', key, value); } list.foreach(function (item) { console.log(item); // 'add' 'delete' 'clear' 'has' });}
weaksetweakset和set的不同点:
weakset的元素只能是对象,不能是数值、字符串、布尔值...
weakset中的对象都是弱引用,垃圾回收机制不考虑weakset对该对象的引用。weakset里面的引用,都不计入垃圾回收机制,所以不会引发内存泄漏的问题。所以,weakset适合临时存放一组对象,以及存放跟对象绑定的信息。只要这些对象在外部消失,它在weakset里面的引用就会自动消失。
{ let weaklist = new weakset(); let arg = {name: 'hhh'}; weaklist.add(arg); // weakset的元素只能是对象 // weaklist.add(2); // uncaught typeerror: invalid value used in weak set console.log(weaklist); // weakset {{name: 'hhh'}} // 注意:weakset没有size属性,没有clear方法,不能遍历。其他的用法和set相同}
map1.set()方法和get()方法
{ let map = new map(); let arr = ['123']; // map的key可以是任意数据类型 map.set(arr, 456); // map.set(key, value),这里用数组作为key,添加一个值为456的元素 console.log(map.get(arr)); // 456}
2.map的另一种定义方式
{ let map = new map([['a', 123], ['b', 456]]); // 接收一个数组作为参数,数组的每一项为:[key,value] console.log(map); // map(2) {a => 123, b => 456} console.log(map.size); // 2 console.log(map.has('b')); // true map.delete('a'); console.log(map); // map(1) {b => 456} map.clear(); console.log(map); // map(0) {}}
weakmapweakmap和map的不同点:
weakmap的key只能是对象
weakmap的键名所引用的对象都是弱引用,垃圾回收机制不考虑对此对象的引用。(注意,weakmap弱引用的只是键名,而不是键值。键值依然是正常引用。)基本上,如果你要往对象上添加数据,又不想干扰垃圾回收机制,就可以使用weakmap。
{ let weakmap = new weakmap(); let o = {}; weakmap.set(o, 123); console.log(weakmap.get(o)); // 123 // 注意:weakmap没有size属性,没有clear方法,不能遍历。类似于set与weakset的区别}
set,map和array,object的对比map与array对比{ // 数据结构横向对比,增 查 改 删 let map = new map(); let array = []; // 增 map.set('t', 1); array.push({'t': 1}); console.log(map, array); // {t => 1} [{'t': 1}] // 查 let map_exist = map.has('t'); let array_exist = array.find(item => item.t); console.log(map_exist, array_exist); // true {t: 1} // 改 map.set('t', 2); array.foreach(item => item.t ? item.t = 2 : ''); console.log(map, array); // {t => 2} [{'t': 2}] // 删 map.delete('t'); let index = array.findindex(item => item.t); array.splice(index, 1); console.log(map, array); // {} []}
set与array对比{ let set = new set(); let array = []; let item = {'t': 1}; // 增 set.add(item); array.push(item); console.log(set, array); // {{'t': 1}} [{'t': 1}] // 查 let set_exist = set.has(item); let array_exist = array.find(item => item.t); console.log(set_exist, array_exist); // true {t: 1} // 改 set.foreach(item => item.t ? item.t = 2 : ''); array.foreach(item => item.t ? item.t = 2 : ''); console.log(set, array); // {{'t': 2}} [{'t': 2}] // 删 set.foreach(item => item.t ? set.delete(item) : ''); let index = array.findindex(item => item.t); array.splice(index, 1); console.log(set, array); // {} []}
map,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.log(obj, map, set); // {t: 1} map(1) {t => 1} set(1) {{t: 1}} // 查 console.log(map.has('t'), set.has(item), 't' in obj); // true true true // 改 map.set('t', 2); item.t = 2; obj['t'] = 2; console.log(obj, map, set); // {t: 2} map(1) {t => 2} set(1) {{t: 2}} // 删 map.delete('t'); set.delete(item); delete obj['t']; console.log(obj, map, set); // {} map(0) {} set(0) {}}
建议:
优先使用map,不使用array,特别是复杂的数据结构
考虑数据唯一性,使用set,放弃array和obj
以上就是es6中set和map的对比介绍(附代码)的详细内容。