Map和WeekMap的区别
弱引用为垃圾回收会忽略该引用值的引用。也就是，如果某个引用值被赋值给多个变量，当其他所有的变量都被清空时，弱引用的值会被垃圾回收机制回收。
WeakMap的key只能为引用值，并且key为弱引用。由于key为弱引用，key存在不确定性，因此WeakMap不能被遍历，如果能遍历会出现数据混乱。
如果在Map中添加数据，又不想影响垃圾回收机制，可以考虑使用WeakMap。
可以在node --expose-gc模式下，手动执行垃圾回收机制global.gc()，通过process.memoryUsage()查看WeakMap key被垃圾回收后，内存的变化。
let obj = { a: 1 };
let wm = new WeakMap();
wm.set(obj, 1);
obj = null; // wm 所引用的 { a: 1 } 将会被垃圾回收机制销毁。通过程序无法立马感知。可通过下面阮一峰老师的方法进行查看。
let obj = { a: 1 };
let m = new Map();
m.set( obj, 1 );
obj = null; // m 所引用的 { a: 1 } 不会被销毁。如果要销毁m所引用的{ a: 1 }，需要将m设置为null。
- Map内部是通过两个数组分别来维护key和value，通过key获取索引时，要遍历整个数组，每个key数组中的引用值为强引用。
- WeakMap内部的key值，由于是弱引用，通过程序不确定垃圾回收会把key值回收掉，因此WeakMap不适合用来遍历或获取size。
- WeakMap使用场景：当使用dom元素作为key值，适合用到WeakMap，因为当dom元素消失时，一般key所对应的value值也没有存在的意义。比如给dom元素添加监听事件时，可以把回调函数预设到WeakMap中，添加监听事件时，从weakMap中获取回调函数。
- WeakSet与WeakMap的特性基本一致
proxy
proxy的作用是对目标对象属性的拦截，本质上是生成了一个代理对象，访问代理对象的属性时，可以通过代理对象的set、get等方法进行拦截，在set和get方法中可以对目标对象进行业务处理。
-
proxy和definedProperty的区别：
- proxy是对整个对象的监听，defineProperty是对单个属性的监听。
- proxy比defineProperty的优势在于除了set、get方法以外，新增了很多其他方法，比如可以监听到新增、删除的属性，对数组的操作可以监听到。也可以通过apply对函数进行代理。
-
实用场景：
- 监听数组，通过负数可以直接访问数组末尾的值。
- 表单提交验证，给属性赋值时，进行验证是否合法。
- 赋值身份证后，对其他地域、生日、性别等字段进行赋值。
- Vue3中对于的观察者模式。
- 总之基于属性的访问和赋值操作，需要业务处理时，都可以用到Proxy。
var tar = {};
var agent = new Proxy(tar, {
set: function (target, key, value) { //对tar的赋值操作进行拦截
if (key === 'phone') {
return false;
} else if ( key === 'leaveMsg' ) {
if (typeof(value) === 'string') {
target[key] = value;
return true;
} else {
return false;
}
}
},
get: function ( target, key ) {
if ( key in target ) {
return target[key];
} else {
return '没有此属性';
}
},
has: function (target, key) { // ! 对于for in 此方法不起作用
if ( key in target ) {
return true;
} else {
return false;
}
},
deleteProperty: function (target, key) {
if(key.indexOf('_') !== 0) {
delete target[key];
}
}
});
agent.phone = 1; // 静默失败
agent.x = 2; // 成功
agent.leaveMsg = 123; // 静默失败
agent.leaveMsg = 'mgs'; // 成功
agent.a; // '没有此属性'
agent.hasOwnProperty('x'); // true
agent.hasOwnProperty('y'); // false
- 通过agent直接赋值，可以直接转移到obj
var obj = {};
var agent = new Proxy( obj, {} );
agent.x = 1;
console.log(obj.x); //1
Reflect
- 提供了各种静态方法
- 等同于通过obj[]的方式操作和访问对象属性
