這篇文章主要介紹es6中es6和Map有什么區(qū)別，文中介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們一定要看完！
Set
1、add()方法和size屬性
重慶分公司
重慶分公司
{
let list = new Set();
// add()方法向Set數(shù)據(jù)添加元素
list.add(5);
list.add(7);
// size屬性返回?cái)?shù)據(jù)的長度
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); // 重復(fù)元素不會添加進(jìn)去
console.log(list); // Set(2) {1, 2}
// 數(shù)組去重
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結(jié)構(gòu)的數(shù)據(jù)，key和value是同一個(gè)值
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的不同點(diǎn)：
WeakSet的元素只能是對象，不能是數(shù)值、字符串、布爾值...
WeakSet中的對象都是弱引用，垃圾回收機(jī)制不考慮WeakSet對該對象的引用。WeakSet里面的引用，都不計(jì)入垃圾回收機(jī)制，所以不會引發(fā)內(nèi)存泄漏的問題。所以，WeakSet適合臨時(shí)存放一組對象，以及存放跟對象綁定的信息。只要這些對象在外部消失，它在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可以是任意數(shù)據(jù)類型
map.set(arr, 456); // map.set(key, value)，這里用數(shù)組作為key,添加一個(gè)值為456的元素
console.log(map.get(arr)); // 456
}2.Map的另一種定義方式
{
let map = new Map([['a', 123], ['b', 456]]); // 接收一個(gè)數(shù)組作為參數(shù)，數(shù)組的每一項(xiàng)為：[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的不同點(diǎn)：
WeakMap的key只能是對象
WeakMap的鍵名所引用的對象都是弱引用，垃圾回收機(jī)制不考慮對此對象的引用。（注意，WeakMap弱引用的只是鍵名，而不是鍵值。鍵值依然是正常引用。）基本上，如果你要往對象上添加數(shù)據(jù)，又不想干擾垃圾回收機(jī)制，就可以使用WeakMap。
{
let weakmap = new WeakMap();
let o = {};
weakmap.set(o, 123);
console.log(weakmap.get(o)); // 123
// 注意：WeakMap沒有size屬性，沒有clear方法，不能遍歷。類似于Set與WeakSet的區(qū)別
}{
// 數(shù)據(jù)結(jié)構(gòu)橫向?qū)Ρ?，?nbsp;查 改 刪
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) {}
}建議：
優(yōu)先使用map，不使用array，特別是復(fù)雜的數(shù)據(jù)結(jié)構(gòu)
考慮數(shù)據(jù)唯一性，使用set，放棄array和obj
以上是“es6中es6和Map有什么區(qū)別”這篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對大家有幫助，更多相關(guān)知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！
另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務(wù)器15元起步，三天無理由+7*72小時(shí)售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場景需求。
