代理定义:ES6新增了代理和反射威开发者提供拦截并向操作嵌入额外行为
1 空代理:所谓的空代理,就是作为一个抽象的目标对象,其他的什么都不做
const target = {
"id":"target"
}
const handle ={}
const proxy = new Proxy(target,handle)
target.id ="foo"
console.log(target.id) //foo
console.log(proxy.id) //foo
上述例子就是一个空代理
2 捕获器
使用代理的主要目的是捕获器.每个处理程序对象可以包含零个或者多个捕获器,每个捕获器代表一种操作.下面例子为get捕获器
const target = {
foo: 'bar'
}
const handle ={
get(){
return "handle overide"
}
const proxy = new Proxy(target,handle)
}
当通过执行get()操作的时候,就会触发get()捕获器,其中 proxy[property] proxy.property Object.create(property)[property]都会触发get()捕获器
3 捕获器参数和反射
不同的捕获器的参数各部相同,比如get捕获器,则接收三个参数,第一个参数为原目标,第二个参数为属性,第三个参数为代理对象
get(targget,property,receiver){
}
可以通过全局的Reflect捕获器对象进行重建.几乎所有的捕获器都有相对应的Reflect.比如 Reflect.get Reflect.set....
如果想创建一个可以捕获所有方法,可以如下写法
const target ={
foo:"bar"
}
const proxy = new Proxy(target,Relfect)
4 捕获器的不变样式
捕获器几乎可以改变所有的基本方法,但也不是没有限制.必须遵循捕获不变样式.比如,如果一个对象的属性设置writeable为false,如果通过代理设置值,那么就是报错
5撤销代理
能够设置代理,也能够取消代理,取消代理方法是revocable
const target ={
foo:'bar'
}
const handle ={
get(){
return "intercepted"
}
let { proxy,revoke} = Proxy.revocable(target,handle)
console.log(target.foo) //bar
console.l0g(proxy.foo) //intercepted
revoke()
console.l0g(proxy.foo) //报错
}
3 代理不足
代理与内置引用类型的实例很好引用,但是不能代理没有内部槽道的类型,比如 Date函数对象
4 捕获器API
4.1 get()
4.2 set()
4.3 has()
4.4 defineProperty()
4.5 getOwnProperDescriptor()
4.6 deleteProperty()
4.7 ownKeys() Object.keys()方法受用
...
网友评论