Vue.js 官方文档摘记：Vue 实例_vue.js官网文档-CSDN博客

Vue 实例

构造器

var vm=new Vue({
    //选项
});

可以扩展vue构造器，从而用预订义选项创建可复用的组件构造器。

var MyComponent=Vue.extend({
    //扩展选项
});
//可以将上面理解为为Vue创建了一个名为 MyComponent 的子类
var myComponent=new MyComponent();

尽管可以命令式地创建扩展实例，不过在多数情况下建议将组件构造器注册为一个自定义元素，然后声明式地在用在模板中。

属性和方法

每个Vue实例都会代理其data对象里所有的属性。

var data={a:1};
var vm=new Vue({
    data:data
});
//上面等同于
var vm2=new Vue({
    data:{a:1}
});
//同时第一种方式时，可以理解为将data的引用传入Vue中，所以data的任何变化
//都会影响Vue中的值，如下面的情况：
vm.a===data.a // ->true
vm.a=2;       // ->data.a=2
data.a=3;     // ->vm.a=3

上面采用vm.a直接调用vm中的data中的a元素，但是如何调用data呢？

var outside_data={a:1};
var vm=new Vue({
    el:"#example1",
    data:outside_data
});
//如果要调用vm下的data，就要使用下面的形式
vm.$data===data;
//这里顺道再一提el这个选择属性
vm.$el=document.getElementById('example1');

实例生命周期

有一些像是面向对象编程中的构造函数、析构函数一样的，在对象被创建、释放时执行的函数：

created
mounted
uodated
destroyed

如下面这个例子：

var vm=new Vue({
    data:{a:1},
    //在这个对象创建好之后执行，并且在其中可以使用this表示新建好的这个实例
    created:function(){console.log('Vue实例创建完成，且a的值为'+this.a)}
});

生命周期

这里把官网的图扣过来了:

@Vue实例创建生命周期

这里用我那渣渣级的英语能力翻译一下：

new Vue()
执行beforeCreate函数
观察data属性
注册事件
create函数执行
有没有设置el属性，如果有的话，查看有没有设置template属性，如果没有的话，则在外部使用vm.$mount(el)被调用后执行template属性的检测
接着上面，如果有设置template属性，则将模板编译进页面，如果没有设置的话，则将el的输出作为模板？？？
执行beforeMount函数
创建vm.$el来取代原始的el:""的配置
执行mounted函数
检测该vm对象是否有发生改变
当data进行update后，执行beforeUpdate函数，之后进行更新
之后执行uodated函数
如果上面不是更新，而是释放该vm实例，如执行vm.$destroy，则beforeDestroy函数会被执行，释放vm实例后，会同时释放该实例下的相关资源