vue3 使用了 Proxy 代替 vue2 Object.defineProperty() 实现响应式

在 vue 2 的文档中 有这么一段话：由于 JavaScript 的限制，Vue 不能检测数组和对象的变化。这里所谓的 JavaScript 的限制，所指的就是 Object.defineProperty() 的限制。
因为 Object.defineProperty() 是通过：为对象属性指定描述符的方式来监听对象中某个属性的get和set方法。
所以在以下两种情况下，新的属性是 非响应式的：

对于对象

var vm = new Vue({
  data:{
    a:1
  }
})

// `vm.a` 是响应式的

vm.b = 2
// `vm.b` 是非响应式的

对于数组

var vm = new Vue({
  data: {
    items: ['a', 'b', 'c']
  }
})
vm.items[1] = 'x' // 不是响应性的
vm.items.length = 2 // 不是响应性的

这也是为什么会存在 Vue.set 这个 API 的原因。

但是，这样的一种情况其实一直都是不合理的，因为这只是无意义的增加了复杂度而已，但是一直以来因为 Object.defineProperty() 这个 API 本身的限制，所以一直无法处理。

直到 Proxy 被广泛支持，这种情况才发生了变化。

Proxy 用于：为对象创建一个代理，从而实现基本操作的拦截。 那么这样就从根本上解决了 Object.defineProperty() 所面临的那么两个问题。这也是为什么 vue3 中不再有 Vue.set 方法的原因。