22. Proxy

Proxy

Proxy用于修改某些操作的默认行为,等同于在语言层面作出修改,所以属于一种"元编程",即对编程语言进行编程。Proxy可以理解为在目标对象之前设置一层拦截,外界对该对象的访问,都必须先通过这层拦截,因此提供了一种机制.可以对外界的访问进行过滤和改写。proxy这个词的愿意是代理,用在这里表示它来代理某些操作,可以看作是代理器

Proxy实际上是重载了点运算符,用自己的定义覆盖了原始定义,而Proxy实际上也是一个类,通过构造函数的方式创建一个Proxy实例,该构造函数中有两个参数.一个是要拦截的目标对象,另一个参数也是一个对象,用来定制拦截的行为

var p=new Proxy(target,handle);

var obj = { a: 1, b: 2, c: 3 };
var p = new Proxy(obj, {
    get:function(target, key, receiver) {
        console.log(target);
        console.log(key);
        console.log(receiver);
        return Reflect.get(target, key, receiver);
        //return target[key];下面的代码同上方
    },
    set:function(target,key,value,receiver){
        Reflect.set(target, key, value, receiver);
        //target[key]=value;下面的代码同上方
}
});
console.log(p.a);//1
/*
{a: 1, b: 2, c: 3}
a
Proxy {a: 1, b: 2, c: 3}
*/
p.a=4;
console.log(p.a);//4
/*
{a: 4, b: 2, c: 3}
a
Proxy {a: 4, b: 2, c: 3}
*/

注意:

改变Proxy实例内对象的值的时候会自动执行内部的set()方法,也能够改变传入参数对象的值,但是如果通过原对象访问的属性只会返回对应对象的值,如果通过Proxy实例访问对象属性,则会执行内部的get()方法

var obj = { a: 1, b: 2, c: 3 };
var p = new Proxy(obj, {
    get:function(target, key, receiver) {
        return “hello"
    },
    set:function(target,key,value,receiver){
        Reflect.set(target, key, value, receiver);
}
});
p.a=4;
console.log(obj.a);//4
console.log(p.a);//"hello"
console.log(p.b);//"hello"
console.log(p.c);//"hello"

如果Proxy构造函数的第二个参数是一个空对象,那么就没有任何拦截效果,访问proxy实例就等同于访问target
```
var obj = { a: 1, b: 2, c: 3 };
var p = new Proxy(obj, {});
p.a=4;
console.log(obj.a);//4
conosole.log(p.a);//4
```

**注:**Proxy实例还可以设置很多方法,在这里值将set()与get()的用法

22. Proxy

# Proxy

Proxy