因为专注,所以专业
2005 - 2020

ES6中的代理(Proxy)和反射(Reflection)

时间:2020-03-10 02:22:06    作者:八叔模板堂

代理和反射的定义

应用

let target = {}; let p = new Proxy(target, {});

p.a = 37; // 操作转发到目标 console.log(target.a); // 37. 操作已经被正确地转发
  • get() 方法用于拦截对象的读取属性操作
  • set() 方法用于拦截设置属性值的操作
  • has() 方法可以看作是针对 in 操作的钩子
  • deleteProperty() 方法用于拦截对对象属性的 delete 操作
let target = { name: 'target', color: 'blue', size: 50, skill: 'drink' } let proxy = new Proxy(target, { set: function(trapTarget, key, value, receiver) { // 忽略不希望受到影响的已有属性 if(!trapTarget.hasOwnProperty(key)) { if(isNaN(value)) { throw new TypeError('属性必须是数字!')
      }
    } //添加属性 return Reflect.set(trapTarget, key, value, receiver)
  }, get: function(trapTarget, key, receiver) { if(!(key in receiver)) { throw new TypeError(key + '属性不存在!')
    } return Reflect.get(trapTarget, key, receiver)
  }, has: function(trapTarget, key) { if(key === 'color') { return false }else { return Reflect.has(trapTarget, key)
    }
  }, deleteProperty: function(trapTarget, key) { if(key === 'skill') { return false }else { return Reflect.deleteProperty(trapTarget, key)
    }
  }

}); //添加一个新属性 proxy.count = 1 console.log(target.count) //1 proxy.name = 'proxy' console.log(proxy.name) //proxy console.log(target.name) //proxy proxy.anotherName = 'proxy' //抛出错误: 属性必须是数字! console.log(proxy.age) //抛出错误:age属性不存在! console.log('name' in proxy) //true console.log('color' in proxy) //false console.log('size' in proxy) //true let result1 = delete proxy.size console.log('size' in proxy) //false console.log('skill' in proxy) //true let result2 = delete proxy.skill console.log('skill' in proxy) //true 

参考

赞(0
免费拨打  111-1111-1111
免费拨打  111-1111-1111免费拨打 111-1111-1111
微信二维码
手机二维码
返回顶部
返回顶部返回顶部