WeakMap的学习与应用场景

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 的语法

1. 通过 new WeakMap 可创建 WeakMap 实例
2. 没有clear()方法，只有四个方法：get(), set(), has(), delete()