20.Proxy

作者: dptms | 来源:发表于2017-10-27 14:15 被阅读22次

    Proxy

    通过 Proxy 你可以改写对象的一些默认的方法,定义自己的逻辑。有一种保护,预处理的感觉

    const person = { name: 'Dp', age: 2000 };
    // `Proxy` 接收两个参数,第一个参数为要代理的目标对象,第二个参数是一个对象,包含我们要修改的方法
    const personProxy = new Proxy(person, {
        // 改变获取值的方式
        get(target, key) {
            return target[key].toLowerCase();
        },
        // 改变设置值的方式
        set(target, key, value) {
            target[key] = value.toUpperCase();
        }
    });
    

    // 存取电话号码示例

    const phoneHandler = {
        set(target, key, value) {
            target[key] = value.match(/\d/g).join('');
        },
        get(target, key) {
            return target[key].replace(/(\d{3})(\d{4})(\d{4})/, '$1-$2-$3');
        }
    }
    const phoneProxy = new Proxy({}, phoneHandler);
    

    打印结果

    phoneProxy.home = '1350 8690 910'
    "1350 8690 910"
    phoneProxy.work = '18871233098'
    "18871233098"
    phoneProxy
    Proxy {home: "13508690910", work: "18871233098"}
    phoneProxy.home
    "135-0869-0910"
    phoneProxy.work
    "188-7123-3098"
    

    相关文章

      网友评论

          本文标题:20.Proxy

          本文链接:https://www.haomeiwen.com/subject/ewwrpxtx.html