鍍金池/ 問(wèn)答/HTML/ 如何監(jiān)聽(tīng)Object的值的訪問(wèn)和設(shè)置?

如何監(jiān)聽(tīng)Object的值的訪問(wèn)和設(shè)置?

let app1 = new Observer({
  name: 'youngwind',
  age: 25
});

let app2 = new Observer({
  university: 'bupt',
  major: 'computer'
});

// 要實(shí)現(xiàn)的結(jié)果如下:
app1.data.name // 你訪問(wèn)了 name
app.data.age = 100;  // 你設(shè)置了 age,新的值為100
app2.data.university // 你訪問(wèn)了 university
app2.data.major = 'science'  // 你設(shè)置了 major,新的值為 science

請(qǐng)實(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)的信息。

回答
編輯回答
忘了我

百度前端技術(shù)學(xué)院-動(dòng)態(tài)數(shù)據(jù)綁定(一)
有參考資料和別人的提交的答案,可供參考。

2018年3月4日 18:57
編輯回答
殘淚
function Observer(props) {
  this.data = {};
  for(let key in props) {
    Object.defineProperty(this.data, key, {
      get () {
        console.log("你訪問(wèn)了 " + key);
        return props[key];
      },
      set (value) {
        console.log("你設(shè)置了 " +key+ ",新的值為 " + value);
        props[key] = value;
      }
    });
  }
}
2018年7月19日 05:02