vue 相关概念

• 是什么

vue 是一套用于构建用户界面的渐进式框架(按需使用组件, 不必完整使用), 被设计为可以自底向上逐层应用(把基础的东西写好，再逐层往上添加效果和功能)

• 渐进式框架
  主张最少
  它给你提供足够的 optional，但并不主张很多 required，也不多做职责之外的事！这就是渐进式

• MVVM

Model-View-ViewModel 的缩写，它是一种基于前端开发的架构模式，其核心是提供对 View 和 Model 的双向数据绑定，这使得 Model 的状态改变可以自动传递给 View，即所谓的数据双向绑定。
Vue 会通过 DOM Listeners 来监听并改变 Model 层的数据
当 Model 层的数据发生改变时，也会通过 Data Bingings 来监听并改变 View 层的展示。从而实现双向数据绑定的功能。
Model: 指的是数据部分，对应到前端就是 javascript 对象
View: 指的是视图部分，对应前端就是 dom
Viewmodel: 就是连接视图与数据的中间件
数据 (Model) 和视图 (View) 是不能直接通讯的，而是需要通过 ViewModel 来实现双方的通讯。
当数据变化的时候，viewModel 能够监听到这种变化，并及时的通知 view 做出修改。
同样的，当页面有事件触发时，viewMOdel 也能够监听到事件，并通知 model 进行响应。Viewmodel 就相当于一个观察者，监控着双方的动作，并及时通知对方进行相应的操作。

• 声明式渲染
  数据驱动 DOM
  Vue.js 的核心是一个允许采用简洁的模板语法来声明式地将数据渲染进 DOM 的系统.
  命令式：一步一步告诉程序如何去做，能否达成结果取决于开发者的设计
  声明式：只告诉程序想要什么结果，如何达成由程序保证，开发者不用关心

• 实现方式

首先，vuejs 在实例化的过程中，会对遍历传给实例化对象选项中的 data 选项，
遍历其所有属性并使用 Object.defineProperty 把这些属性全部转为 getter/setter。
同时每一个实例对象都有一个 watcher 实例对象，他会在模板编译的过程中, 用 getter 去访问 data 的属性，
watcher 此时就会把用到的 data 属性记为依赖，这样就建立了视图与数据之间的联系。
当之后我们渲染视图的数据依赖发生改变（即数据的 setter 被调用）的时候，watcher 会对比前后两个的数值是否发生变化，然后确定是否通知视图进行重新渲染。

这样就实现了所谓的数据对于视图的驱动