Vue双向绑定的原理

原理：通过数据劫持并结合发布者-订阅者模式实现的。

核心方法：Object.defineProperty(obj, prop, descriptor)

• obj 需要定义属性的对象；
• prop 需被定义或修改的属性名；
• descriptor 需被定义或修改的属性的描述符；

let obj = {};
let name = '';
Object.defineProperty(obj, name, {
  get: function () {
    return name;
  },
  set: function (value) {
    name = value;
  }
});
obj.name = 'Vue';
console.log(obj.name); // Vue

通过Object.defineProperty设置get和set方法，实现数据的劫持。在数据变化时发布消息给订阅者，触发相应的监听回调。也就是数据和视图同步，数据发生变化，视图跟着变化，视图变化，数据也随之变化。