Proxy 实现数据监听/双向绑定

语法

let proxy = new Proxy(target, handler)

1、第一个参数target，可以是对象和数组
2、第二个参数handler

{
  get(obj, prop, receiver) {
    return Reflect.get(obj, prop, receiver))
  },
  set(obj, prop, value, receiver) {
   // obj 目标对象
  // prop 属性
  // value 更改的值
  // receiver proxy本身
   return Reflect.set(obj, prop, value, receiver))
  }
}

监听对象

数据双向绑定

深层监听对象

例如上面的监听对象，如果这样操作
proxy.arr.push(10)
proxy.m.n = 100
无法触发set函数，即监听不到值的改变
这是因为Proxy只能监听一层对象属性

为了能监听到整个对象，需要给该对象中的每一层对象添加监听

初始化数据渲染

let proxy = new Proxy() 不会立刻出发set函数
通过给proxy的属性赋值时才会触发set