ES6代理proxy

ES6代理

1、proxy的实现

    let my = {
        location : "市区",
        housePrice : 20000
    }

//在我们获取数据前进行处理；//参数 第一要代理的对象 第二 处理函数
    let intermediaryAgent = new Proxy(my,{

        //get函数
        get(target,property){
            console.log(target);
            console.log(property);
            if(property == 'housePrice'){
                return target[property]*1.2;
            }else if (property == "location"){
                return "位于市中心";
            }
            return target[property];
        }
    })

    console.log(intermediaryAgent.location);

 

2、set方法   

参数 target当前对象 property 设置的那个属性 value 代表给属性赋的值是

作用，给属性值处理后设置值

    let account = {
        balance: 8000,
        money: 100
    }

    //第一我们要代理谁 //set 设置数据进行处理
    let bank = new Proxy(account, {
        get(target, property) {
            return target[property];
        },
        //参数 target当前对象 property 设置的那个属性 value 代表给属性赋的值是
        set(target, property, value) {
            console.log(value);
            if (property === 'bankMoney') {
                if (target.balance > value) {//判断自己的钱是否大于 传入的 是取钱 否余额不足
                    target.balance = target.balance - value
                    console.log(target.balance);
                } else {
                    console.log("余额不足")
                }
            }
        },
        
        ownKeys: function (target) { 
            return balance;//截获 只给该代理一个参数，其他属性获取不到
        },
        has:function(target,property){//has()方法用于是判断是否含有指定的键值对，有，就返回true。否则返回false。
            if(target[property]===undefined){
                return false;
            }else {
                return true;
            }
        }
    })
    bank.bankMoney = 7000;
    console.log(bank.balance)

　　

3、ownKeys:截获 只给该代理相应属性，其他属性获取不到

        ownKeys: function (target) { 
            return balance;//截获 只给该代理一个参数，其他属性获取不到
        },

　　

4、has()方法用于是判断是否含有指定的键值对，有，就返回true。否则返回false。

        has:function(target,property){//has()方法用于是判断是否含有指定的键值对，有，就返回true。否则返回false。
            if(target[property]===undefined){
                return false;
            }else {
                return true;
            }

　　

5、apply方法 ，函数可以被代理。使用apply调用。

    let fn = function(){
        console.log("我的隔壁呢？")
    }

    let fn1 = new Proxy(fn,{
        apply: function(){
            console.log("唉")
        }
    })

    fn1();//唉

　　

6、proxy.revocable方法

（可废止的，可撤回的;）函数来实现，它会返回一个对象，对象中含有一个proxy属性，它就是Proxy的代理实例对象；还有一个revoke属性，它是一个方法，用于取消代理。

    let person = {"name":"张三"};
    //处理程序
    let handLe = {
        get : function(target,prop){
            return "李四";
        }
    };

    //使用Proxy.revocable()进行代理
    let obj = Proxy.revocable(person,handLe);

    console.log(obj.proxy.name);//李四

    //revoke 取消代理
    obj.revoke();
    console.log(obj.proxy.name);//报错代理被取消