前端vue自学总结Week06——生命周期篇（下）

Vue实例生命周期（下）

初始化阶段（initEvents）

自述总结：当父组件需要使用子组件时，可以给子组件注册一些事件，这些事件包括使用v-on或者@修饰，或者给浏览器函数原生事件，需要加.native修饰符。
在模版编译过程中，当遇到开始标签的时候，处理会解析开始标签，还会调用processAttrs函数去解析标签中的属性

在对标签进行解析时，判断如果属性是指令，则通过parseModifiers解析出属性的修饰符，然后再判断如果是事件的指令，则通过addHandler（）方法。

addHandler（）方法解析

addHandler函数一共做了三件事，第一件是根据modifiers的修饰符，根据不同的修饰符对name进行处理，第二件事是根据modifiers.native判断事件是浏览器的原生事件，还是自定义事件，分别对应el.nativeEvents和el.events，最后再根据name的不同属性，对事件进行归类，并把回调函数的字符串保存到对应的事件中。
总结：实例初始化阶段调用的初始化事件函数 initEvents实际上初始化的是父组件在模版中使用v-on或者注册监听子组件内除法的事件。

模版编译阶段

自述总结：首先Vue源码构建分成两种版本，完整版本和只包含运行时版本，而模版编译阶段只存在与完整版中。因为在只包含运行时版本中，当使用vue-loader或vueify时，*.vue文件内部的模版会在构建时预编译成渲染函数。模版编译阶段总的来说就是分析完整版的vm.$mount方法的实现，
1、根据用户传入的el参数获取DOM元素；
2、在用户没有手写render函数的情况下获取传入的模版template;
3、将获取到的template编译成render函数；
主要的过程就是从用户传入的el选项和template选项中获取到用户传入的内部或外部模版，然后将该模版编译成函数：

挂载阶段

自述总结：挂载阶段的主要工作是创建Vue实例并用其替换el选项对应的DOM元素，同时开启模版中的监控，当数据发生变化时，通知依赖进行视图更新。

mountComponent函数

首先会判断实例上是否有渲染函数，如果不存在会设置一个默认的渲染函数createEmptyVNode，并且该函数会创建一个注释类型的VNode节点
updateComponent函数

先执行渲染函数vm._render()得到一份最新的VNode节点树，然后执行vm._update()方法对最新的VNode节点树与上一次渲染的旧VNode节点树进行对比并更新DOM节点(即patch操作)，完成一次渲染；最后创建一个watcher实例，将定义好的updateComponent函数传入，当updateComponent函数任何一个数据发生变化，都会去更新视图。

销毁阶段

主要是将当前Vue实例从其父级实例中删除，取消当前实例上的所有依赖追踪并且移除实例上的所有事件监听器。