简介:认识高阶知识点之代理Proxy和反射Reflect
Proxy
- 概述
正如Proxy的英译"代理"所示,Proxy是ES6为了操作对象引入的API。它不直接作用在对象上,而是作为一种媒介,如果需要操作对象的话,需要经过这个媒介的同意。
- 使用方式
/* @params
** target: 用Proxy包装的目标对象
** handler: 一个对象,对代理对象进行拦截操作的函数,如set、get
*/
let p = new Proxy(target, handler)
- 使用场景
const house = {
name: '张三',
price: '1000',
phone: '18823139921',
id: '111',
state: '**',
};
const houseProxy = new Proxy(house, {
// 读取代理
get: function (target, key) {
switch (key) {
case 'price':
return target[key].replace('1000', '1200');
case 'phone':
return target[key].substring(0, 3) + '****' + target[key].substring(7);
default:
return target[key];
}
},
// 设置代理
set: function (target, key, value) {
if (key === 'id') {
return target[key];
} else if (key === 'state') {
return (target[key] = value);
}
},
});
console.log(houseProxy.price);
console.log(houseProxy.phone);
houseProxy.id = '222';
houseProxy.state = '****';
console.log(houseProxy.id);
console.log(houseProxy.state);
Reflect
- 概述
与Proxy相同,ES6引入Reflect也是用来操作对象的,它将对象里一些明显属于语言内部的方法移植到Reflect对象上,它对某些方法的返回结果进行了修改,使其更合理,更具语义化,并且使用函数的方式实现了Object的命令式操作
- 常见用法
const person = {
name: '张三',
age: '18',
phone: '18823139921',
id: '111',
};
const res = 'name' in person;
const res1 = Reflect.has(person, 'name');
console.log(res, res1);```