setter 当获取指定属性时调用
getter获取指定属性时调用
let ownProp = {
_name: '鸡桑',
age: '两年半',
set name(value) {
console.log('修改了名字');
this._name = value;
},
//名字不能与setter,getter里的一致
get name() {
console.log('获取了名字');
return this._name;
}
}
proxy代理,对目标调用属性方法等都会触发
let managerId = ['020609']; //设立一个管理员id库
let handler = {//设立一个处理方式
get: function (target, key) {//获取属性时触发
return target[key];//返回目标值
},
set: function (target, key, value) {//设置属性时触发
let id = prompt('请输入你的管理员ID'); //输入id
//判断输入的id是否为管理员id 正确触发修改 不符合触发弹窗
managerId.includes(id) ? target[key] = value : alert('仅限管理员修改')
}
};
// 这个传给target 这个传给key
let proxy = new Proxy(ownProp, handler);
let proxy2 = new Proxy(ownProp, handler);
proxy.name = '鸡哥'; //代理修改
console.log(proxy.name);
setter与getter以及porxy代理都能监听属性方法的修改与获取,不过setter与getter仅限指定的属性
proxy监听全部,并且两者并不冲突,可以多重监听;一定程度上保证安全性;