WeakMap 是什么?
WeakMap 與 Map 類似,也是生成 鍵值對的組合,但是有區別:
1.WeakMap 只能接受對象作為鍵名(不包括null)
2.WeakMap 的鍵名所指向的對象是弱引用,不計入垃圾回收機制
所以如果想向 對象添加數據又不想干擾垃圾回收機制,就可以用 WeakMap WeakMap 可用在它的鍵對應的對象可能在將來消息的場景,
WeakMap 有助于防止內存泄露
注:WeakMap 弱引用是鍵名,而不是鍵值,鍵值依然是正常引用的
=> 3. 沒有size屬性,沒有遍歷操作(即沒有key(), values(), entries() )
原因:沒有辦法列出所有鍵名,某個鍵名是否存在完成不可預測,這和垃圾回收機制是否允許相關:就算這一刻可以取到鍵名,下一刻垃圾回收機制突然運行的話這個鍵名就可能消失,為了防止這種不確定性,所以統一規定不能取到鍵名)
WeakMap 的應用場景
1.WeakMap的典型應用:以 DOM節點作為鍵名的場景
這種場景下可能是
(1)想要給網頁的dom元素上添加數據時可用 WeakMap:
用 WeakMap 好處是當該 DOM 元素被清除,對應的 WeakMap記錄就會自動被移除
例1:
const wm = new WeakMap();
const ele = document.getElementById('example');
wm.set(el, 'some information');
wm.get(el) //"some information"
例2:
let myEle = document.getElementbById('logo');
let myWeakMap = new WeakMap();
myWeakMap.set(myEle, {timesClicked: 0});
myEle.addEventListener('click', function() {
let logoData = myWeakMap.get(myEle);
logoData.timesClicked++;
},false);
這段代碼功能是計數對某個節點的點擊
myEle是一個dom節點,每次點擊時更新一下timesClicked進行加一,則可將這個狀態timesClicked 作為鍵值 放在 WeakMap 里,對應的鍵名就是meEle 。而一旦myEle這個dom節點刪除,則 timesClicked這個狀態就會自動消失,則不會有內存泄露的風險
(2)進一步說,注冊監聽事件的listener對象很適合用WeakMap來實現
// 代碼1
ele1.addEventListener('click', handler1, false);
ele2.addEventListener('click', handler2, false);
// 代碼2
const listener = new WeakMap();
listener.set(ele1, handler1);
listener.set(ele2, handler2);
ele1.addEventListener('click', listener.get(ele1), false);
ele2.addEventListener('click', listener.get(ele2), false);
代碼2比起代碼1的好處是:由于監聽函數是放在 WeakMap 里面,
則一旦dom對象ele1,ele2消失,與它綁定的監聽函數handler1和handler2 也會自動消失
2. WeakMap 可用來部署類中的私有屬性
WeakMap 的語法
- 通過
new WeakMap
可創建 WeakMap 實例 - 沒有clear()方法,只有四個方法:
get()
,set()
,has()
,delete()