Vue响应式原理模拟
Vue的功能
1.记录传入的选项，设置
d
a
t
a
/
data/
data/el
2.负责把 data 中的属性注入到 Vue 实例，并且转换成 getter/setter
3.observer 监听 data 中所有属性的变化
4.负责调用 compiler 解析指令/插值表达式
Observer的功能
1.数据劫持
负责把 data 中的成员转换成 getter/setter 负责把多层属性转换成 getter/setter 如果给属性赋值为新对象，把新对象的成员设置为getter/setter
2.添加 Dep 和 Watcher 的依赖关系
3.数据变化发送通知
Compile的功能
1.负责编译模板，解析指令/插值表达式
2.负责页面的首次渲染,当数据变化后重新渲染视图
compileText()负责编译差值表达式
compileElement()负责编译元素指令
Dep的功能
1.收集依赖，添加观察者(watcher)
2.通知所有观察者
Watcher的功能
- 当数据变化触发依赖， dep 通知所有的 Watcher 实例更新视图
- 自身实例化的时候往 dep 对象中添加自己