ES6 20.代理Proxy

要点：代理能力

1.什么是代理？

答：给目标对象封装一层拦截，外界访问必须先通过这层拦截

2.类似猎头招聘，你自己发布招聘会暴露自身信息，而通过中介则安全的多

3.代理Proxy的语法：

// 目标对象
let obj={
    name:'Mr.Lee',
    age:100,
    gender:'男'
}

// 创建一个代理，参数1拦截的目标对象，参数2拦截行为
// 参数2如果是空对象，代理直接会调用目标对象
let p=new Proxy(obj,{
    // get方法用于拦截某个属性的读取操作
    // 这里直接return，通过代理对象无论访问目标对象的任何属性都是fail
     get(target,property){
         return 'fail';      
     }
})
// 代理对象访问name为fail
console.log(p.name);

 

4.如果想让代理对象公布出合适的信息，可以通过 get() 两个参数来实现

  // 通过属性判断，可以获取目标对象属性的值
        // 并且还可以各种操作，比如验证、修改等  
        if(property==='age'){
            return target[property]-80;  //obj.age
        }else{
            return 'fail';
        }

// 对外公布的年龄20
console.log(p.age);

 

5.可以通过set()方法对代理对象的属性进行赋值，有三个参数

 // set可以拦截某个属性的赋值操作，比get多了参数3
    set(target,property,value) {
        if(property==='age'){
            if(!Number.isInteger(value) || value > 150){
                throw new TypeError('年龄数据不合法！');
            }
            target[property]=value;
        }
    }

// 通过代理对象对属性进行赋值
p.age=25;
console.log(p.age);  //25
console.log(obj.age); //目标对象属性也被更改

 

 

ps:1.代理并不是复制克隆目标对象，只是拦截目标对象更改默认行为

2.代理可以使用  set()  和   get() 方法，对目标对象的数据进行过渡和验证

3.代理对象中任何未公开或不存在的属性，可自定义返回内容，比如：fail 或者 已屏蔽

4.代理也可以阻止赋值的默认行为：直接  return false  ，就禁止赋值了

    set(target,property,value) {
        return false;
    }