一、vuejs 前端框架 渐进式前端框架。
       适应项目：小，中，大。

二，核心思想

Vue.js是一个提供MVVM数据双向绑定的库，专注于UI层面，核心思想是：数据驱动、组件系统。

数据驱动：

Vue.js数据观测原理在技术实现上，利用的是ES5Object.defineProperty和存储器属性: getter和setter（所以只兼容IE9及以上版本），

可称为基于依赖收集的观测机制。核心是VM，即ViewModel，保证数据和视图的一致性。

三、vuejs功能

      VueJS 让前端和后台完全分离。


      1、擅长移动端单页应用程序
      2、擅长网页版在线及时聊天(弹幕)
      3、传统多页网站


四、重要概念

     数据绑定

    Vue通过设定对象属性的 setter/getter 方法来监听数据的变化，通过getter进行依赖收集，而每个setter方法就是一个观察者，在数据

变更的时候通知订阅者更新视图。

  

       vue采用的是数据劫持结合发布者-订阅者模式的方式，通过Object.defineProperty()来实现对属性的劫持，并在数据变动时发布消息给订阅者，使其触发相应的监听回调。

      具体步骤：

1、 实现Observer

        将需要observe的数据对象进行递归遍历，包括子属性对象的属性，都加上setter和getter。实现一个消息订阅器，维护一个数组，用来收集订阅者，数据变动触发notify，再调用订阅者的update方法

2、 实现Compile

        compile解析模板指令，将模板中的变量替换成数据，然后初始化渲染页面视图，并将每个指令对应的节点绑定更新函数，添加监听数据的订阅者，一旦数据有变动，收到通知，更新视图

3、 实现Watcher

         Watcher订阅者是Observer和Compile之间通信的桥梁

五：Vue优势

  1. 低耦合。视图（View）可以独立于Model变化和修改，一个ViewModel可以绑定到不同的"View"上，当View变化的时候Model可以不变，当Model变化的时候View也可以不变。
  2. 可重用性。你可以把一些视图逻辑放在一个ViewModel里面，让很多view重用这段视图逻辑。
  3. 独立开发。开发人员可以专注于业务逻辑和数据的开发（ViewModel）。
  4. 可测试。界面素来是比较难于测试的，而现在测试可以针对ViewModel来写。

 

六，vue生命周期

     

  • 创建前/后： 在beforeCreate阶段，vue实例的挂载元素，el和数据对象data都为undefined,还未初始化。在created阶段，vue示例的数据对象data产生，el还未有。

  • 载入前/后：在beforeMount阶段，vue实例的$el和data都初始化了，但还是挂载之前为虚拟的dom节点，data.message还未替换。在mounted阶段，vue实例挂载完成，data.message成功渲染。

  • 更新前/后：当data变化时，会触发beforeUpdate和updated方法。

  • 销毁前/后：在执行destroy方法后，对data的改变不会再触发周期函数，说明此时vue实例已经解除了事件监听以及和dom的绑定，但是dom结构依然存在。