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();
  • 相关阅读:
    JDBC 复习4 批量执行SQL
    JDBC 复习3 存取Oracle大数据 clob blob
    Oracle复习
    Linux命令(1)grep
    JDBC 复习2 存取mysql 大数据
    JDBC 复习1 DBUtil
    php 环境搭建问题
    Windows 批处理 bat 开启 WiFi 菜单选项 设置ID PWD
    Bat 批处理启动和停止Oracle 服务
    docker 学习1 WSL docker ,Windows docker
  • 原文地址:https://www.cnblogs.com/sunliyuan/p/13516238.html
Copyright © 2011-2022 走看看