Object.defineProperty与Proxy

记录下代码，原文章找不到了，
Object.defineProperty 需要循环数据+递归给对象绑定响应式，不能监听数组，所以数组的监听是通过改写数组的原型方法来监听数据改变的。
Proxy 只需要递归给对象绑定响应式，可以监听数组，只是有兼容问题。

Object.defineProperty

const obj = {}
var a = '111'
Object.defineProperty(obj, 'a', {
  get() {
    console.log('11111')
    return a
  },
  set(value) {
    console.log(value, '22222')
    a = value
  }
})
var b = {
 c: '2222'
}
Object.defineProperty(obj, 'b', {
  get() {
    console.log('33333')
    return b
  },
  set(value) {
    console.log(value, '44444')
    b = value
  }
})
obj.a = '333'
obj.b.c = '555'
console.log(obj)

Proxy

var obj = {
  a: 1,
  d: {
    c: 3
  },
  b: [1,2]
}
let handler = {
  get(obj, prop) {
    console.log(obj, prop, 'getter')
    if (typeof obj[prop] === 'object' && obj[prop] !== null) {
      return new Proxy(obj[prop], handler)
    }
    return obj[prop]
  },
  set(obj, prop, value) {
    console.log(obj, prop, value, 'setter')
    obj[prop] = value
    return true
  }
}

var obj1 = new Proxy(obj, handler)
console.log(obj1.a)
obj1.a = 4
obj1.d.c = 8