目录
ES6之Proxy
proxy的中文有代理的意思。在其他的程序设计语言中这个单词也具有类似的含义。
它是什么
Proxy是一个构造器。Proxy在目标对象的外层搭建了一层拦截,外界对目标对象的某些操作,必须通过这层拦截。在 js 中构造器的典型特点就是首字母大写,我们通过new Proxy(原对象,{代理列表})格式去创建对象,创建的这个对象我们称之为代理对象。 即:
代理对象 = new Proxy(原对象,{代理列表})
之所以要额外产生这么一个代理对象,好处在于可以保持原对象不变,在代理对象中添加新的功能,或者是改造某些功能。而这个原对象则可以在适当的时机回滚回去。可以与设计模式中的代理模式对比理解。
proxy使用格式
var obj;
var proxyObj = new Proxy(obj, {
对obj的操作1: 函数1,
对obj的操作2: 函数2,
...
})
obj 参数表示所要拦截的目标对象,{}
参数是一个对象,用来定制拦截行为
proxy入门示例
var obj = {name:'fan',age:34}
console.info(obj.name)
var proxyObj = new Proxy(obj,{
get:function(target,key,receiver){console.info(target,key,receiver); return 'no'}
})console.info(proxyObj.name)
console.info(proxyObj.abc)proxyObj.name // no
proxyObj.abc // no
解释如下:
- proxxy对象是在obj对象的基础之上创建的一个新对象。
- proxyObj.name是要去获取proxy对象的name属性。
.操作符会自动去调用get()方法
。这一点非常重要当然。我们平时使用.操作时,是没有感知到这一点的。 - 在new Proxy的第二个参数中,明确设置了get的方法:当访问proxyObj的任意属性时,输出target,key,receiver的值,并统一返回no。所以proxyObj.name和proxyObj.abc都会得到no。
- get函数中的三个参数:target,key,receiver。 target就是原对象obj, key是当前的属性名;receiver是代理对象。你可以在get方法中做任意的自定