虽互不曾谋面,但希望能和您成为笔尖下的朋友
以读书,技术,生活为主,偶尔撒点鸡汤
不作,不敷衍,意在真诚吐露,用心分享
点击左上方,可关注本刊
标星公众号(ID:itclanCoder)
如果不知道如何操作
点击这里,标星不迷路
如何监控 js 对象属性的变化?
方式 1:通过
Object.defineProperty()
来监听
var obj = {
name: 'itclanCoder',
phone: 13711767328,
};
Object.defineProperty(obj, 'phone', {
configurable: true, // 属性可配置
set: function (v) {
console.log('phone发生了变化');
this.phone = v;
},
get: function () {
return this.phone;
},
});
obj.phone = 15213467443;
要想监听属性的变化,首先需要通过Object.defineProperty()
为需要监听的属性设置一个代理,通过代理的值,触发set
和get
的方法 在这个方法中编写自己想要的逻辑操作
方法 2-使用 proxy 代理实现
var obj = {
name: 'itclanCoder',
phone: 13711767328,
};
var handler = {
set: function (target, name, value) {
console.log('phone发生了变化');
// 改变被代理对象的值,使之保持一致
target[name] = value;
},
};
var proxy = new Proxy(obj, handler);
proxy.phone = 1371123765;
上面执行完后,会更新 phone 的值
如果您有问题,欢迎评论下方一起讨论~
公众号(ID:itclanCoder)
码能让您早脱菜籍,文能让您洗净铅华
可能您还想看更多:
Js篇-面试题15-通过什么方法可以实现-检测页面 DOM 变化