這篇文章主要介紹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有什么區別”這篇文章的所有內容,感謝各位的閱讀!希望分享的內容對大家有幫助,更多相關知識,歡迎關注創新互聯行業資訊頻道!
另外有需要云服務器可以了解下創新互聯scvps.cn,海內外云服務器15元起步,三天無理由+7*72小時售后在線,公司持有idc許可證,提供“云服務器、裸金屬服務器、高防服務器、香港服務器、美國服務器、虛擬主機、免備案服務器”等云主機租用服務以及企業上云的綜合解決方案,具有“安全穩定、簡單易用、服務可用性高、性價比高”等特點與優勢,專為企業上云打造定制,能夠滿足用戶豐富、多元化的應用場景需求。