Proxy对象和Reflect对象

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);    // 二者配合使用
  }
});

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

妍思码匠

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值