可观测对象

/*

• @Descripttion:通过递归的方式把一个对象的所有属性转化成可观测对象
• @version:
• @Author: 仲灏Izhaong164165005@qq.com
• @Date: 2020-03-30 10:44:44
• @LastEditors: 仲灏Izhaong164165005@qq.com
• @LastEditTime: 2020-04-20 18:12:54
  */

export class Observer {
constructor(value) {
this.value = value
// 给value新增一个_ob_属性, 值为该value的Observer实例
def(value, ‘ob’, this)
if (Array.isArray(value)) {
// 当value为数组时的逻辑
// …
} else {
this.walk(value)
}
}

walk(obj: Object) {
const keys = Object.keys(obj)
for (let i = 0; i < keys.length; i++) {
defineReactive(obj, keys[i])
}
}
}

/**

• 使一个对象转化成可观测对象
• @param { Object } obj 对象
• @param { String } key 对象的key
• @param { Any } val 对象的某个key的值
  */
  function defineReactive(obj, key, val) {
  // 如果只传了obj和key，那么val = obj[key]
  if (arguments.length === 2) {
  val = obj[key]
  }
  if (typeof val === ‘object’) {
  new Observer(val)
  }
  Object.defineProperty(obj, key, {
  enumerable: true,
  configurable: true,
  get() {
  console.log(${key}属性被读取了)
  return val
  },
  set(newVal) {
  if (val === newVal) {
  return
  }
  console.log(${key}属性被修改了)
  val = newVal
  }
  })
  }