Vue源码分析（1）—— 初始化

1. Data

1. 递归遍历data配置并对每一个属性做响应式处理
2. 响应式处理即为该属性定义一个dep实例，并进行数据劫持。getter进行依赖收集，setter进行派发更新
3. 组件render创建vnode过程获取数据并触发getter进行依赖收集
4. 后续修改值时触发setter进行派发更新，最终触发页面更新

2. Props

1. 对配置进行格式处理，统一格式便于后续操作
2. 对每个prop进行校验、响应式处理并求值
3. 父组件修改值触发父组件页面更新，update过程将新值赋给子组件props最终触发子组件页面更新

props本质就是一个data，只是响应式触发由父组件传递至子组件而已

3. Computed

1. 遍历computed配置，对每一项定义一个watcher并进行数据劫持处理
2. getter函数会先判断当前计算属性是否需要求值，需要则触发求值，不需要直接返回
3. 依赖收集时，计算属性所依赖的data会先对计算属性的watcher进行依赖收集，然后计算属性的watcher会触发依赖data对渲染watcher进行依赖收集
4. 修改依赖data时，首先触发计算属性的更新，即重置是否需要求值的参数。再触发页面更新，更新过程会再次对计算属性求值并依赖收集

计算属性本质是具有数据劫持功能的watcher，派发更新过程只重置参数，只在触发getter后才进行求值

4. Watch

1. 遍历watcher配置，解析出每一项的handler回调、监听路径，并定义一个watcher
2. 初始化阶段对该watcher进行一次求值，进行依赖收集
3. 修改监听值时触发派发更新，再次执行求值过程进行依赖收集，最后调用handler回调

Watch属性本质就是一个Watcher，进行依赖收集和执行回调

5. v-model

1. 编译阶段解析v-model指令，最终分解为props属性、input事件、和model指令
2. 在组件update过程创建v-model绑定的dom之后，执行dom的create钩子。依据vnode进行dom属性的添加，事件的绑定
3. 修改input值后会触发编译阶段生成的input事件，将值赋给props属性，最终触发响应式过程