se5中的set與map

在est5中開發(fā)者使用對象屬性來模擬。set多用于檢查鍵的存在，map多用于提取數(shù)據(jù)。

{let set = Object.create(null)set.foo = true;//檢查屬性是否存在if (set.foo) {//其他操作}let map = Object.create(null);map.foo = '一個值';let val = map.foo;console.log('map-->:', val); //map-->:一個值' }

在簡單情況下將對象作為map和set來使用都是可行的，但是一旦接觸到對象屬性的局限性，此方式就會遇到更多的麻煩。

{let map1 = Object.create(null),key1 = {},key2 = {};map1[key1] = 'foo';console.log('key2-->:', map1[key2]);let map2 = Object.create(null);map2.count = 1;//是想檢查count的存在，還是非零值？if (map2.count) {//...} }

map1[key1]和map1[key2]引用了同一個值。由于對象屬性只能是string，又因?yàn)閷ο竽J(rèn)的string表達(dá)形式是'[object object]'。導(dǎo)致key1和key2被轉(zhuǎn)換為同一個字符串。map2中count的用法存在歧義。該if語句內(nèi)的代碼都會被執(zhí)行因?yàn)?被隱式轉(zhuǎn)換為true。然而count的值為0則會被隱式轉(zhuǎn)為false。在大型應(yīng)用中這類問題都是難以確認(rèn)，難以調(diào)試的。這也是新增set和map類型的原因。set類型是一種無重復(fù)值的有序列表。set允許對它包含的數(shù)進(jìn)行快速訪問，從而更有效的追蹤各種離散值。

創(chuàng)建set類型

使用new set()來創(chuàng)建。調(diào)用add()方法向集合中添加元素，訪問集合的size屬性獲取集合數(shù)量。

{let set = new Set();set.add(5);set.add('5');console.log('typeof set-->:', typeof set)console.log('set-->:', set)console.log('size-->:', set.size) }

set不會使用強(qiáng)制類型轉(zhuǎn)換來判斷值是否重復(fù)，這意味著set可以同時包含number(5)和string(5)，唯一的例外-0和+0在set中被判定是相等的，如果向set集合中添加多個對象，則他們之間彼此獨(dú)立。

{let set = new Set();let key1 = {};let key2 = {};set.add(key1);set.add(key2);console.log('typeof setobject-->:', typeof set)console.log('setobject-->:', set)console.log('size-->:', set.size) }

由于key1和key2不會被轉(zhuǎn)換為字符串，所以在set內(nèi)部是不同的項(xiàng)，如果他們被轉(zhuǎn)化為字符串，那么都會等于"[object object]"，如果多次調(diào)用add()并傳入相同的值作為參數(shù)。那么后續(xù)的調(diào)用會被忽略。

{let set = new Set();set.add(5);set.add('5');set.add(5);console.log('typeof set-->:', typeof set)console.log('set-->:', set)console.log('size-->:', set.size) }

第二次重復(fù)傳入numner(5)并不會被添加到set集合中，那么size的屬性值還是為2。也可以使用數(shù)組來初始化set集合。集合同樣會過濾重復(fù)的值。

{let set = new Set([1, 2, 3, 4, 5, 5, 5, 5, 5, 5]);console.log('size-->:', set.size); }

通過has()可以檢測set集合中是否存在某個值。

{let set = new Set();set.add(5);set.add('6');console.log('set has-->:', set.has(6));console.log('set has-->:', set.has('6'))console.log('set has-->:', set.has(5))console.log('set has-->:', set.has('5')) }

set集合中相同的number和sting并不會返回true。調(diào)用delete()方法可以移除set中的某一個值，調(diào)用clear()方法可以移除所有值。

{let set = new Set();set.add(5);set.add('6');console.log('set has-->:', set.has('6'));set.delete('6')console.log('set has-->:', set.has('6'))console.log('size-->:', set.size)set.clear();console.log('size-->:', set.size) }

set集合簡單易用，可以有效的跟蹤多個獨(dú)立有序的值。

set的forEach

set集合和數(shù)組的forEach類似，運(yùn)行機(jī)制也比較類似。forEach()方法的回調(diào)接收3個參數(shù)：
1.集合中索引的位置。
2.被遍歷參數(shù)的值
3.集合本身

{let set = new Set(['a', 'b', 'c', 'd', 'e']);set.forEach((k, val, owner) => {console.log('set-forEach-k-->:', k);console.log('set-forEach-val-->:', val);console.log('set-forEach-owner-->:', owner);}) }

將set轉(zhuǎn)換為數(shù)組

將數(shù)組轉(zhuǎn)換為set集合的過程很簡單，需要給set集合傳入數(shù)組即可。將集合轉(zhuǎn)回?cái)?shù)組，只需要使用展開運(yùn)算符即可。

{let arr = [1, 2, 3, 4, 5, 5, 5, 5, 5, 5];let set = new Set(arr);let newArr = [...set];//ps: 代碼行數(shù)太多可以壓縮下let newArr2 = [...new Set([1, 2, 3, 4, 5, 5, 5, 5, 5, 5])];console.log(newArr, newArr2) }

創(chuàng)建map類型

map類型是鍵值對的有序列表，鍵和值都可以是任意類型，可以調(diào)用set()方法傳遞一個鍵和一個關(guān)聯(lián)的值，來給馬屁添加項(xiàng);此后使用鍵名來調(diào)用get()方法獲取對應(yīng)的值。

{let map = new Map();map.set('title', 'es6');map.set('year', 2016);console.log('map-title-->', map.get('title'))console.log('map-year-->', map.get('year')) }

map的方法

map和set共享了幾個方法。以下的方法和屬性map和set上都存在：
1.forEach(val, k, owner): 遍歷map
2.has(key)：判斷指定的鍵值是否存在
3.delete(key)：移除map中鍵以及對應(yīng)的值
4.clear()：移除map中所有的鍵和值
5.size：指明包含多個鍵值對。

{let map = new Map();map.set('title', 'es6');map.set('year', 2016);map.forEach((val, k, owner) => {console.log('map-forEach-k-->:', k);console.log('map-forEach-val-->:', val);console.log('map-forEach-owner-->:', owner);})console.log('map-size-->:', map.size);console.log('map-has-->:', map.has('title'));map.delete('title');console.log('map-->:', map);map.clear();console.log('map-->:', map); }

小結(jié)

es6正式將set與map引入。在此之前往往使用對象來模擬，但是由于與對象屬性有關(guān)的限制，這么做會經(jīng)常遇到問題。
這里并沒有弱引用weakset和weakmap，有這方面需要的可以自己去查閱

原文地址：https://segmentfault.com/a/1190000015057978

轉(zhuǎn)載于:https://www.cnblogs.com/lalalagq/articles/9909954.html

總結(jié)

以上是生活随笔為你收集整理的es6-Set与Map的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。