昨天开始学习 Vue,正式的开始接触前端工程化了，以后还会陆陆续续写一点关于 Vue 和 Webpack 的东西。

在 new Vue的实例对象时，生成了一个 ViewModel。Vue 是如何去初始化实例对象，与 DOM 进行绑定，数据交换的。

官方是这样描述一个 Vue 对象的创建的。

每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如，需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做生命周期钩子的函数，这给了用户在不同阶段添加自己的代码的机会。

Vue 对象在初始化中，会经历以下几个阶段。

• create
• render
• mount

在每个阶段开始或结束之前，都可以创建一个生命周期函数，当到此阶段之前或之后，执行这个函数。

生命周期函数有 beforeCreate created beforeMount mounted beforeDestory destoryed

beforeCreate 生命周期函数在生成实例数据之前，与 DOM 等还没有绑定，此时是无法获取到 this.data 或者 this.method 的，DOM 中的元素也只是原始数据。

created 此时已经可以获取实例对象中的 data method 等属性，但是无法获取 DOM 中希望得到的内容。

beforeMount 此时 Vue 已经在内存中完成了模板渲染，在内存中 VDOM 树已经构建完成，但是没有在 DOM 上进行绑定。此时 DOM 依然是原始值。

mounted 此时 DOM 已经进行一次更新，并与 Vue 实例进行数据绑定。此时 Vue 实例对象初始化结束，进入运行阶段。

beforeDestory 此时 Vue 实例并没有销毁，数据依然存在。

destoryed 此时 Vue 实例中的数据已经释放。无法获取到此实例中的值。