SOURCE

// 响应式函数
function reactive(obj, key, value) {
  Object.defineProperty(data, key, {
    get() {
      console.log(`访问了${key}属性`)
      return value
    },
    set(val) {
      console.log(`将${key}由->${value}->设置成->${val}`)
      if (value !== val) {
        value = val
      }
    }
  })
}


const data = {
  name: 'Blank',
  age: 22
}
Object.keys(data).forEach(key => reactive(data, key, data[key]))
console.log(data.name)
// 访问了name属性
// Blank
data.name = 'sunshine_lin' // 将name由->Blank>设置成->sunshine_lin
console.log(data.name)
// 访问了name属性
// sunshine_lin


//***********对于新增属性不能触发，get()、set()方法，所有VUE2中新增属性需要使用Vue.$set()
data.sex = "男"
console.log(data.sex)