es6 proxy 总结
Proxy: 可以对数据的处理,对构造函数的处理,对数据的验证,说白了就是在我们访问对象添加了一层拦截 ,
其实说明白点跟 vuejs computed 的计算属性很类似,
proxy 字面意思就是代理,下面代码就相当与代理了 test{} 对象,当proxy.age 时触发Proxy 的get 方法,做修改操作时触发 set 方法,
* 测试es6 proxy代理 */ function f() { var name="小刚" var handler={ get:(target, prop)=>{ console.log(target); // target {name: "小红", age: "20"} console.log(prop); // age debugger; if(prop==="age"){ return target[prop]+="日子"; } }, set:(target,key ,value)=>{ debugger; console.log(target); // {name: "小红", age: "20日子"} console.log(key); //age 注: 只显示proxy 调用的值 console.log(value); // 30 if(key==="age" && typeof value!=="number"){ throw Error("age 字段名必须为number"); } } } var test={ name:"小红", age:"20" } var proxy = new Proxy(test,handler); var name = test.age; // proxy 现在 代理 test 对象 console.log(`我的年纪${proxy.age}`) // 获取 对象 数据时触发, 与vuejs 的computed 属性类似 // 输出: 我的年纪20 // 做一个set 修改操作 console.log(`我修改了年纪属性触发set 方法${proxy.age=30}`) // 输出:我修改了年纪属性触发set 方法 30 } f();