proxy作用:
1、代理
2、解决跨域
案例一
var house = {
price: 1000000,
size: 120,
info: "河北科技大学附近"
}
// Proxy(要代理的对象,{包含很多方法})
var housePro = new Proxy(house, {
get(target, property) {
// 代理的对象
// console.log(target);
// 对象中的属性
// console.log(property);
if (property == "info") {
return '在河北科技大学附近,上大学不用考试,直接上学'
}
return target[property]
},
set(target, property, value) {
console.log(value);
target[property] = value
},
// ownKeys拦截操作,拦截过滤Object.Keys()对对象的属性遍历
ownKeys() {
return ['size', 'price']
},
// has()拦截操作:拦截key in object的操作,结果会返回一个布尔值。
has(target, property) {
// console.log(target);
// console.log(property);
// console.log(target[property]);
// return false
if (target[property] == undefined) {
return false
} else {
return true
}
}
})
console.log(housePro.price);
console.log(housePro.size);
console.log(housePro.info);
housePro.price = 1100000
console.log(housePro.price);
console.log(Object.keys(housePro));
console.log('size' in housePro);
console.log('info' in housePro);
console.log('info1' in housePro);
案例二
function fn() {
console.log('我是现在没有代理的函数');
}
var fn_1 = new Proxy(fn, {
apply() {
console.log('我被代理了');
}
})
fn_1()
案例三
// 如果创建了代理之后又想取消代理的话,我们可以用Proxy.revocable( )(可废止的,可撤回的;)函数来实现
var obj1 = {
name: 'zs'
}
var houseProxy = Proxy.revocable(obj1, {
get(target) {
console.log(target);
return '12312312'
}
})
console.log(houseProxy);
console.log(houseProxy.proxy.name);
// 取消代理
houseProxy.revoke()
console.log(houseProxy);
console.log(houseProxy.proxy.name); //Cannot perform 'get' on a proxy that has been revoked
// console.log(houseProxy.info);
var obj = {
name: 'zs',
age: 18
}
// 判断对象中有没有判断的这个属性名
console.log("name" in obj);
console.log("age" in obj);
console.log("age1" in obj);