您好,登录后才能下订单哦!
这篇文章主要介绍es6中es6和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' }); }
WeakSet和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相同 }
1.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) {} }
WeakMap和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的区别 }
{ // 数据结构横向对比,增 查 改 删 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); // {} [] }
{ 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); // {} [] }
{ 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中es6和Map有什么区别”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注亿速云行业资讯频道!
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。