js Proxy

MDN文档

拦截

// index.html

  var obj = {
    name:'ajanuw'
  }
  
  var handle = {
    // 通过代理可以 约束，验证 向一个对象传的 key:value
    get(target, key){
      return Reflect.has(target, key)
        ? Reflect.get(target, key)
        : undefined
    },
    set(target, key, value){
      if(key === 'name') return false;
      return Reflect.set(target, key, value);
    }
  }

  var proxy = new Proxy(obj, handle);

  console.log( proxy.name );
  proxy.name = 'new Name'; // 无法设置
  proxy.age = 22
  console.log( obj);

apply

拦截函数的调用

    function hello (name){
      return `hello ${name}`;
    }
    var x = new Proxy(hello,{
      apply(target, thisArg, args){
        if(args.length === 1)
          return target(args)
        else
          return 'err'
      }
    });
    console.log( x('ajanuw'));

construct

拦截new 操作, 必须返回对象

function hello (name, age){
  this.name = name
  this.age = age
}

var x = new Proxy(hello,{
  construct(target, arg, newTarget){
    return new target(...arg);
  }
});

var a = new x('hello', 22);
console.log( Reflect.ownKeys(a) );// ["name", "age"]

defineProperty

用于拦截对对象的 (Object | Reflect ).defineProperty()

  var obj = {name:'ajanuw'}
  var handler = {
    defineProperty(target, key, descriptor){
      // console.log( key);// name
      // console.log( descriptor);// {value: "boo"}
      // 做了个简单的 密封
      if(  Reflect.has(target, key) )
        return Reflect.defineProperty(target, key, descriptor);
    }
  }

  var x = new Proxy(obj, handler);

  Reflect.defineProperty(x, 'name', {
    value: 'boo'
  });

  Reflect.defineProperty(x, 'age', {
    value: 22
  });

  console.log( x);//{name: "boo"}

deleteProperty

拦截 delete 操作

  var obj = {name:'ajanuw', age: 22}
  var handler = {
    deleteProperty(target, key){
      if( key === 'name')
         return false;
      else
         Reflect.deleteProperty(target, key);
         return true;
    }
  }

  var p = new Proxy(obj, handler);

  console.log( Reflect.deleteProperty(p, 'name') );// false
  console.log( Reflect.deleteProperty(p, 'age') );// true
  console.log( p);

getOwnPropertyDescriptor(target, prop)

( Object | Reflect ).getOwnPropertyDescriptor() 访问属性的描述的陷阱。你懂得！
必须返回 一个对象

getPrototypeOf(target)

读取对象的原型时， 拦截 必须返回一个对象值或者 null

has(target, prop)

枚举拦截， 返回布尔值

isExtensible()

拦截 (Object|Reflext).isExtensible() ， 必须返回 Truthy

ownKeys(target)

拦截 Reflect.ownKeys(); 必须返回数组， string 或 symbol

preventExtensions() 密封对象

拦截 (Object|Reflect).preventExtensions()

setPrototypeOf(target, newProto) 设置对象原型

拦截设置对象原型，修改了返回 true， 否者返回false