es6代理 proxy 学习

Posted 2020-11-03 菜鸟木易

深入浅出es6里面有详细介绍代理   深入浅出es6:http://www.infoq.com/cn/es6-in-depth/

以下是本人的 实际测试例子。

代理的基本用法。

// proxy = new Proxy(target,hander)  

// 代理调用的方法，就是调用目标对象的方法，或者是被重写的14中句柄对象中的方法。
//hander中的14个方法是Object内定的14个方法

// 如果重写set，get就会重新定义.的行为，可以阻止赋值取值操作，同样的可以轻松的监听属性的变化，类似于Object.defineProperty(obj,key,{set,get})中的set,get

 

(function(){

 

var target={c:12,d:33};
var proxy = new Proxy(target,{
get:function(target,key,receiver)
{
console.log("get...")
return Reflect.get(target,key,receiver);
},
set:function(target,key,value,receiver){
console.log("set...")
}
})

// proxy.account=1;
// console.log(proxy.account);

console.log(proxy.c);


})() ;

(function(){

//代理可以实现自动填充属性，原理是监听赋值操作，发现没有就创建一个

function Tree() {
return new Proxy({}, handler);
}
var handler = {
get: function (target, key, receiver) {
if (!(key in target)) {
target[key] = Tree(); // 自动创建一个子树
}
return Reflect.get(target, key, receiver);
},

};

var tree=Tree();
tree.aa.aa.aa.aa=1;
})();