[toc]

# 提要

在做 Unity 前端 UI 一方面的开发的时候，公司项目里使用的数据交互就是基于 MVVM 方式的双向绑定，这个概念以前在前端听说过，实际应用起来的时候忽然感觉异常的方便。故以此文章记录一下

# 自己的臆想

大部分语言都会有 getter 和 setter, 那么其实在自己的想象中实现双向绑定就可以通过 getter 和 setter 来实现。我们可以在框架中封装一些数据类型，外部只能访问这些提供的数据类型，然后这些数据类型是基于 getter 和 setter 来实现的。那么当外界企图更改这个数据的时候，我们就可以反向通知绑定了这个数据的各个组件来进行数据的刷新.

# 以 Vue 为例

网上搜 MVVM 的时候，第一篇文章讲的是 vue 实现双向绑定的方式，看了一下 大概意思是，js 有一个方法可以重写数据的 get 和 set, 这一点和最近开发使用的 lua 得元表挺像的，既然可以重写，那么就不需要自己再去封装了。 那篇文章的大概思路如下: 就是说 observer 是 js 内置的方法，可以劫持对属性的 set 和 get, 然后我们 View 层会有很多数据，但在页面启动前，我们会有一个 compile 的阶段，在这个阶段，我们将这一个 view 里所有的数据都添加一个监听事件，即 Watcher 之后每当这些数据发生改变的时候，就会通知 Dep, 然后 Dep 会转发给各自属性的 Watcher, 这些 Watcher 再根据引用关系直接更改 View 层的数据显示