Proxy对象理解:
ES6新增了Proxy用于修改某些操作的默认行为,等同于在语言层面做出修改,所以属于一种“元编程”(meta programming),即对编程语言进行编程。
可以理解为,在目标对象之前架设一层“拦截”,外界对对象的访问,都必须先通过这层拦截,因此提供一种机制,可以对外界的访问进行过滤和改写。
Reflect对象理解:
Reflect对象与Proxy对象功能基本一致,他的设计目的主要有以下几点:
1,将Object对象的一些明显语言内部的方法(eg:defineProperty())放到Reflect上
2,修改一些Object方法的返回结果,让其变得更合理(比如:Object.defineProperty在无法定义属性时会抛出一个错误,而Reflect.defineProperty则会返回false)
3,让一些Object的某写操作语法都变成函数的形式(比如:老写法'key' in obj,新写法Reflect.has(obj, name);delete xxx变成Reflect.deleteProperty(obj, name)等)
4,配合Proxy对象,让Proxy对象有的方法在Reflect对象上都能找到。这样就可以让Proxy对象方便的调用Reflect上的方法,完成默认行为的修改(也就是说,不管Proxy怎么修改默认行为,总能在Reflect上获取默认行为)
Proxy对象的使用方式:
var proxy = new Proxy(target, handler) - target:要拦截的目标对象。handler:具体拦截的代码
var target = { name: '张三' };
var proxy = new Proxy(target, {
get: function(target, propKey, receiver) { // 拦截属性获取
return '新张三';
},
has (target, propKey) { // 拦截判断对象是否存在某属性
var newKey = propKey.toLowerCase();
return newKey in target;
}
});
console.log(proxy.name); // '新张三'
console.log(proxy.has('Name')); // true
Reflect对象的使用方式:
内置的Reflect对象已经封装了13个静态方法((Reflect.apply、set、get、has、defineProperty等)),可以直接再控制台输入Reflect查看。可以配合Proxy对象使用:
var obj = { name: 'zs'};
const proxy = new Proxy(obj, {
set: function(target, key) {
return Reflect.set(target, key); // 二者配合使用
}
});