Vue 主要通过以下 4 个步骤来实现数据双向绑定的：
(1)、实现一个监听器 Observer：对数据对象进行遍历，包括子属性对象的属性，利用 Object.defineProperty() 对属性都加上 setter 和 getter。 这样的话，给这个对象的某个值赋值，就会触发 setter，那么就能监听到了数据变化。
(2)、实现一个解析器 Compile：解析 Vue 模板指令，将模板中的变量都替换成数据，然后初始化渲染页面视图，并将每个指令对应的节点绑定更新函数， 添加监听数据的订阅者，一旦数据有变动，收到通知，调用更新函数进行数据更新。
(3)、实现一个订阅者 Watcher：Watcher 订阅者是 Observer 和 Compile 之间通信的桥梁 ，主要的任务是订阅 Observer 中的属性值变化的消息， 当收到属性值变化的消息时，触发解析器 Compile 中对应的更新函数。
(4)、实现一个订阅器 Dep：订阅器采用 发布-订阅 设计模式，用来收集订阅者 Watcher，对监听器 Observer 和 订阅者 Watcher 进行统一管理 15、Vue 框架是通过遍历数组 和递归遍历对象，从而达到利用 Object.defineProperty() 也能对对象和数组（部分方法的操作）进行监听。 Object.defineProperty() 方法会直接在一个对象上定义一个新属性，或者修改一个对象的现有属性，并返回此对象。
一起设计吧
