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

简单来说，生命周期函数就是vue实例在某一个时间点会自动执行的函数

vue实例.png

下面用代码块运行代码，并在控制台中调试

<div id="app"></div>
//生命周期函数就是vue实例在某一个时间点会自动执行的函数
    var vm = new Vue({
        el:"#app",
        //如果没有模板，直接使用el元素对应的html作为模板进行渲染
        template:"<div>{{test}}</div>",
        data:{
          test:"hello world!",
        },
        beforeCreate:function () {
            console.log("beforeCreate");
        },
        created:function () {
            console.log("created");
        },
        beforeMount:function () {
            console.log(this.$el);
            console.log("beforeMount");
        },
        mounted:function () {
            console.log(this.$el);
            console.log("mounted");
        },
        beforeDestroy:function () {
            console.log("beforeDestroy");
        },
        destroyed:function () {
            console.log("destroy");
        },
        beforeUpdate:function () {
            console.log("beforeUpdate");
        },
        updated:function () {
            console.log("updated");
        }
    })