一、什么是Proxy
官方解释:Proxy 用于修改某些操作的默认行为,等同于在语言层面做出修改,所以属于一种“元编程”(meta programming),即对编程语言进行编程。
Proxy 可以理解成,在目标对象之前架设一层“拦截”,外界对该对象的访问,都必须先通过这层拦截,因此提供了一种机制,可以对外界的访问进行过滤和改写。
比如说生活中很常见的有代理商,对某品牌衣服做了代理,然后买家通过代理去买衣服而不是直接和厂家买,这就是proxy。
二、使用
Proxy提供一些方法来进行拦截
(1)get(target, propKey, receiver):拦截对象属性的读取
{
let obj = {
name:"衣服",
time:"2018-1-1",
desc:"质量还行"
}
let presonZ = new Proxy(obj,{ //obj是原对象(也就是衣服厂商)
//get(){} //全部拦截用户的获取
get(target,key){ //target对象 key属性名
if(key == "time") { //判断拦截time属性读取
return false
}else{
return target[key]
}
}
})
console.log(presonZ.name) //衣服 用户操作
console.log(presonZ.time) //false
}
(2)set(target, propKey, value, receiver)
拦截对象属性的设置,比如proxy.foo = v或proxy['foo'] = v,返回一个布尔值。返回ture是可以修改(拦截失败),返回false不可以修改(拦截成功)
let presonZ = new Proxy(obj, {
set(target, key, val) {
if (key == "name") { //拦截成功 不可以修改的
return target[key];
// return false; //可以return false 但是是提示报错,也可以直接返回值
} else { //可以修改
target[key] = val;
return true
}
}
})
presonZ.name = "皮袄";
console.log(presonZ.name); //永远都是衣服
presonZ.desc="修改成功";
console.log(presonZ.desc); //修改成功
presonZ.time = "2011-1-1";
console.log(presonZ.time); //2011-1-1
(3)deleteProperty(target, propKey)
拦截delete proxy[propKey]的操作,返回一个布尔值。
//delete
let presonZ = new Proxy(obj,{
deleteProperty(target, propKey){
if(propKey == 'name') {
return target[propKey]
}else{
delete target[propKey];
return true
}
}
})
// delete(presonZ.name); //删除name属性
delete(presonZ.name); ///name属性依然在
delete(presonZ.desc) //删除成功
console.log(presonZ) //Proxy {name: "衣服", time: "2018-1-1"}