1. 程式人生 > 其它 >ES6 21.代理Proxy

ES6 21.代理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;
    }