Vue基础

一、Vue的生命周期

生命周期四大阶段：
1.初始化阶段:
beforeCreate：实例刚创建完成,此时还没有data和methods属性
created：vue实例data和method属性已经初始化完成,此时还没有编译模板

2.实例挂载阶段
beforeMount：挂载前 模板编译完成,此时e l 还 没 有 挂 载 , el还没有挂载，data目前可见
mounted：挂载完成后 模板编译完成,$el挂载完成

3.数据更新阶段
beforeUpdate： 数据更新时执行,data数据此时已经是最新的数据,UI界面还是旧的
updated：数据更新完成后,界面和data里的数据此时都是最新的,完成的界面的更新渲染render

4.销毁阶段
销毁前: beforeDestroy： 实例准备销毁,此时data和methods方法都能用
销毁后:destroyed： 实例销毁完成,此时原先创建的实例方法和属性都不可以属性

二、vue是怎么实现数据双向绑定的

        vue数据双向绑定是通过数据劫持结合发布者-订阅者模式的方式来实现的。

        首先要对数据进行劫持监听，所以我们需要设置一个监听器Observer，用来监听所有属性。如果属性发上变化了，就需要告诉订阅者Watcher看是否需要更新。因为订阅者是有很多个，所以我们需要有一个消息订阅器Dep来专门收集这些订阅者，然后在监听器Observer和订阅者Watcher之间进行统一管理的。接着，我们还需要有一个指令解析器Compile，对每个节点元素进行扫描和解析，将相关指令（如v-model，v-on）对应初始化成一个订阅者Watcher，并替换模板数据或者绑定相应的函数，此时当订阅者Watcher接收到相应属性的变化，就会执行对应的更新函数，从而更新视图。