proxy代理对象

var obj={
      a:1,
      b:2
    }
const m=new Proxy(obj,{
      get(target,key){
        console.log(target,key)
        return target[key]
      },
      set(target,key,val){
        console.log(target,key,val)
        target[key]=val
      }
    })

obj为被代理的对象
m为代理对象，它代理了obj。

• Proxy的第一个参数，是一个对象。被代理的对象。
• Proxy的第二个参数，配置对象。共有13种方法，我们介绍两个最常用的方法。
  get方法的两个参数，target为被代理对象，key为属性名
  set方法的三个参数，target为被代理对象，key为属性名,val为此次的赋值。

m.a访问代理对象的a属性时，就会调用代理对象的get方法；
m.a=33，为代理对象赋值时，就会调用代理对象的set方法。赋值完成后，obj中的a的值也发生了改变。

obj.a直接访问被代理对象的a属性，不会调用m的get方法；
obj.a=33，直接为被代理对象的a属性赋值，不会调用m的set方法。
赋值完成后，m中的a的值也发生了改变，m代理了obj。

我们通过操作代理对象m来获取或者设置代理对象obj的属性，这样就可以在获取或设置时再添加一些额外的操作。
Proxy可以理解成，在代理对象之前架设一层拦截，外界对该对象的访问，先通过这层拦截。

使用Object.defineProperty也可以实现对对象属性的拦截，

var obj={
      a:1,
      b:2
    }
   
var x=obj.a
Object.defineProperty(obj,'a',{
      get(){
        return x
      },
      set(val){
        x=val
      }
    })

使用Proxy的优点：

• 1、Object.defineProperty需要用到一个中间值，如果在set方法中直接返回obj.a的话，就再次调用了set方法，就会造成死循环。
• 2、使用Object.defineProperty的话，后面在obj中添加的属性
• 3、使用Proxy，可以通过obj，也可以通过m再往里添加属性，新添加的属性一样具有响应能力