vue的Observer簡化版

class Observer {constructor(value) {if (!value || typeof value !== 'object') returnthis.walk(value) // 對對象的所有屬性進行遍歷并定義響應式}walk (obj) {Object.keys(obj).forEach(key => defineReactive(obj, key, obj[key]))}
}
// 定義核心方法 defineReactive
function defineReactive (target, key, value) {new Observer(value) // 如果值還是對象，則繼續對其子屬性進行觀察Object.defineProperty(target, key, {enumerable: true,configurable: true,get: function reactiveGetter () {return value},set: function reactiveSetter (newVal) {if (newVal === value) returnvalue = newValnew Observer(value) // 新值如果是對象，也需要對其進行觀察}})
}let observer = {name: 'observer',age: 18,tempObj: {n: 1,m: 2}
}new Observer(observer)console.dir(observer)