Vue2是如何监测数组变化的

Vue2是通过Object.defineProperty方法来进行数据监测的

Object.defineProperty是可以对数组进行监测的，但是Vue2为什么没用呢，其实是出于性能的考虑，数据一般会被频繁的改动，每次的改动都需要遍历整个数组，给数组属性重新observe，这样会极大的消耗性能，因此在Vue2中hack了Array上的一些方法。

Vue3是如何监测数组变化的

Vue3是用Proxy来进行对象、数组的代理，其实只要理解了Proxy就明白Vue3为什么会抛弃Object.defineProperty了：

Object.defineProperty只能劫持对象的属性，而Proxy是直接代理对象。由于 Object.defineProperty 只能对属性进行劫持，需要遍历对象的每个属性，如果属性值也是对象，则需要深度遍历。而 Proxy 直接代理对象，不需要遍历操作。
Object.defineProperty对新增属性需要手动进行Observe。由于 Object.defineProperty 劫持的是对象的属性，所以新增属性时，需要重新遍历对象，对其新增属性再使用 Object.defineProperty 进行劫持。
Proxy 具有更多的拦截支持，可以做的更精细化的控制

Object.defineProperty与Proxy的区别在于一个是只能对属性拦截，对象或数组监测时必须遍历，另一个是对对象本身的劫持，