vue2和vue3中，双向数据绑定的原理的不同点

vue2双向数据绑定的原理

• vue2的双向数据绑定是通过数据劫持结合发布-订阅者的模式实现的，它通过object.defineProperty()来劫持对象属性的getter和setter操作，在数据变动的时候发布消息给订阅者，触发响应的监听回调。
• 对于object.defineProperty,有三个参数，第一个参数：要定义属性的对象的名字，第二个参数：要定义或修改的属性的名称或symbol,第三个参数：要定义或修改的属性的描述符
• 以下是一个例子：

let obj = {} //定义一个对象
//给obj添加个name的属性，并赋值为12 ，writable是定义该属性是否能被修改
    Object.defineProperty(obj,'name',{value:12,writable:true})
    console.log(obj) //12
    obj.name = 23
    console.log(obj)//23    当writable:false时，结果为12

对于Object.defineProperty()可以参考：
Object.defineProperty()

object.defineProperty的缺陷

• object.defineProperty可以对对象的属性进行劫持，但是无法监控数组下标的变化，所以当通过下标对数据进行操作时，无法实时响应。
• object.defineProperty只能劫持对象属性，所以需要对每个对象的每个属性进行遍历。在vue2.0里是通过递归+遍历data对象来实现对数据的监控的，如果属性值是对象的话，还需要深度遍历。

vue3双向数据绑定的原理

• vue3的双向数据绑定是通过ES6的语法proxy(代理)对象来实现的，它也可以实现数据劫持。相比于Object.defineProperty，proxy可以检测到数组内部数据的变化。
• 参考：
• 深入理解Proxy 及 使用Proxy实现vue数据双向绑定
• vue使用Proxy实现双向绑定的方法示例