任務(wù)詳情:
實(shí)現(xiàn)這樣的一個(gè) Observer衍腥,要求如下:
傳入?yún)?shù)只考慮對(duì)象有勾,不考慮數(shù)組秫逝。
new Observer返回一個(gè)對(duì)象,其 data 屬性要能夠訪問(wèn)到傳遞進(jìn)去的對(duì)象户盯。
通過(guò) data 訪問(wèn)屬性和設(shè)置屬性的時(shí)候嵌施,均能打印出右側(cè)對(duì)應(yīng)的信息。
參考資料:https://github.com/youngwind/blog/issues/84,
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty
代碼如下:
var Observer = function(dataObj) {
this.data = dataObj;
this.walk(dataObj);
};
//遍歷要觀察的對(duì)象屬性
Observer.prototype.walk = function (object) {
var value;
for (var key in object) {
if (object.hasOwnProperty(key)) {
value = object[key];
//判斷屬性的value類型莽鸭,如果仍然是object吗伤,就調(diào)用遞歸算法
if (typeof value ==="object") {
new Observer(value);
};
//將值傳給convert函數(shù)
this.convert(key,value);
}
}
}
Observer.prototype.convert = function (key,value) {
Object.defineProperty(this.data,key,{
enumerable: true,
configurable: true,
get:function() {
console.log('正在訪問(wèn)'+key+'屬性');
return value;
},
set:function(newValue){
console.log('正在設(shè)置'+key+'屬性');
console.log('屬性值為'+ newValue);
if(newValue === value){
return;
}
value = newValue
}
});
}