proxy代理

將原始數(shù)據(jù)代理档冬，不能修改原始數(shù)據(jù)，通過代理的方式去修改數(shù)據(jù)。

{
    let obj={
        time:'2017-3-11',
        name:"net",
        _r:123
    };
    let monitor=new Proxy(obj,{
        //攔截對(duì)象屬性的讀取
        get(target,key){
            return target[key].replace('2017','2018')
        },
        //攔截對(duì)象設(shè)置屬性
        set(target,key,value){
            if(key=='name'){
                return target[key]=value
            }else {
                return target[key]
            }
        },
        //攔截key in obj
        has(target,key){
            if(key==='name'){
                return target[key]
            }else{
                return false;
            }
        },
        //攔截delete
        deleteProperty(target,key){
            if(key.indexOf('_')>-1){
                delete target[key];
                return true;
            }else{
                return target[key]
            }
        },
        //攔截Object.keys,Object.getOwnPropertySymbols,Object.getOwnPropertyNames
        ownKeys(target){
            return Object.keys(target).filter(item=>item!='time')
        }
    });
    console.log(Object.keys(monitor))
    //["name", "_r"]
    //monitor
    console.log(monitor.time)
    // 2018-3-11
/*    monitor.time='2018';
    monitor.name='3333';*/
    console.log(monitor.time)
    //2018-3-11
    console.log(monitor)
    //Proxy {time: "2017-3-11", name: "3333", _r: 123}
    console.log('name' in monitor , 'time' in monitor)
    //true false
    delete monitor.time;
    console.log(monitor)
    //Proxy {time: "2017-3-11", name: "net", _r: 123}
    delete monitor._r;
    console.log(monitor)
    //Proxy {time: "2017-3-11", name: "net"}
}

Reflect

{
    let obj={
        time:'2017-3-11',
        name:"net",
        _r:123
    };
    console.log(Reflect.get(obj,'time'))
    //2017-3-11
    Reflect.set(obj,'name','re')
    console.log(obj)
    //{time: "2017-3-11", name: "re", _r: 123}
    console.log(Reflect.has(obj,'time'))
    //true
}

應(yīng)用

Proxy可以將業(yè)務(wù)與邏輯更好的分離

{
    function validator(target,validator) {
        return new Proxy(target,{
            _validator:validator,
            set(target,key,value,proxy){
                if(target.hasOwnProperty(key)){
                    let va=this._validator[key];
                    if(!!va(value)){
                        return Reflect.set(target,key,value,proxy)
                    }else{
                        throw Error(`不能設(shè)置${key}到${value}`)
                    }
                }else{
                    throw  Error(`${key} 不存在`)
                }
            }
        })
    }
    const personValidators={
        name(val){
            return typeof val==='string'
        },
        age(val){
            return typeof val==='number'&&val>18
        }
    }
    class Person{
        constructor(name,age){
           this.name=name;
           this.age=age;
           return validator(this,personValidators)
        }
    }
    const person=new Person('liubin',20);
    console.log(person)
    //Proxy {name: "liubin", age: 20}
    //person.name=48;
    //不能設(shè)置name到48
    person.name='48';
    console.log(person)
    //Proxy {name: "48", age: 20}
}