Map与 WeakMap 及WeakMap的主要作用

概念

1. ES6 提供了 Map 数据结构. 它类似与对象,也是键值对的集合. 但是 ‘键’ 的范围不限于字符串,各种类型的值(包括对象) 都可以当作键. Map 也实现了 Iterator接口, 所以可以使用 扩展运算符 和 for...of... 进行遍历.
2. Map 键值对的集合是 对 键去重. 值可以是重复的.
3. Map 的属性和方法
4. 如果存在相同的键，则会按照FIFO（First in First Out,先进先出）原则，后面的键值信息会覆盖前面的键值信息。

1.  size属性: 返回Map的元素的个数
2.  set方法: 增加一个新元素,返回当前Map
3.  get方法: 返回键名对象的键值
4.  has方法: 检测Map中是否包含某个元素, 返回Boolean 值
5.  clear方法: 清空集合, 返回 undefined

  const m = new Map();
  m.set('man', '钟是志');
  m.set('woman', '郑常秀');
  m.set('son', '钟卓廷');
  console.log(m);
    

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Vllq56Tn-1636554883740)(https://note.youdao.com/yws/public/resource/2c99dc423023971bf072cbbe88557d96/xmlnote/4C3BDFD728404BA59AB0A6B232A160E5/24668)]

  遍历 Map
 for(let item of m){
     console.log(m);
 }

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-hHwuFGc6-1636554883741)(https://note.youdao.com/yws/public/resource/2c99dc423023971bf072cbbe88557d96/xmlnote/8B5AFF025CE348CE8B691BF3E83D05F8/24676)]

Map类型的转换

let m = new Map([[1, 2], [2, 4], [4, 8]]);
Array.from(m); // [[1, 2], [2, 4], [4, 8]]

WeakMap

• WeakMap的键会检查变量的引用，只要其中任意一个引用被释放，该键值对就会被删除。

与Map的主要区别

1. Map对象的键可以是任何类型，但WeakMap对象中的键只能是对象引用,如果设置其他类型的数据作为key，会报错。
2. WeakMap的key所引用的对象都是弱引用，只要对象的其他引用被删除，垃圾回收机制就会释放该对象占用的内存，从而避免内存泄漏。
3. 由于WeakMap的成员随时可能被垃圾回收机制回收，成员的数量不稳定，所以没有size属性。
4. WeakMap是不可枚举(遍历)的，无法获取大小。
5. 没有clear()方法

WeakMap实战

1. 弱引用 防止内存泄漏

let button = document.getElementById('button');
let wm = new WeakMap();

wm.set(button, { count: 0 });
function buttonClick(){
  let data = wm.get(button);
  data.count += 1;
  console.log(data.count);
}

button.addEventListener('click', buttonClick);
button.removeEventListener('click', buttonClick);
// 此时button会存在内存泄漏的风险. 因为没有清空

button = null; // 这样不止清空了button 同样把 count 给干掉了
let data = wm.get(button); //
console.log(data); // undefined

2. 私有成员

var Stack = (function(){
var wm = new WeakMap();
return class {
  constructor() {
    wm.set(this, []);
  }
  push(elem){
    wm.get(this).push(elem);
  }
  toString(elem){
    console.log(wm.get(this));
  }
}
})();

var stack = new Stack();
stack.push(1);
stack.push(2);
console.log(stack); // 看不到里面的成员了
stack.toString(); // [1,2] 对外不可见, 成为私有成员了