zoukankan      html  css  js  c++  java
  • 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();
  • 相关阅读:
    Spring Boot整合Freemarker
    Spring Boot异常处理
    CSAPP缓冲区溢出攻击实验(下)
    SparkSQL基础应用(1.3.1)
    程序员的自我修养:(1)目标文件
    CSAPP缓冲区溢出攻击实验(上)
    Redis源码学习:字符串
    六星经典CSAPP-笔记(7)加载与链接(上)
    Redis源码学习:Lua脚本
    六星经典CSAPP-笔记(10)系统IO
  • 原文地址:https://www.cnblogs.com/sunliyuan/p/13516238.html
Copyright © 2011-2022 走看看