vue中MVVM实现原理

往页面中添加数据，从传统的dom操作，改变成数据层操作。不需要关注dom层操作，专注于操作数据，数据是什么，页面就显示什么。

最常用的是用vue-cli脚手架的方式来创建一个项目。它是以一种单文件组件的方式，即为.vue文件，它里面包含了模板、业务逻辑和样式。

 

1. 响应式数据绑定,当数据(model层)发生改变,它会自动更新视图(view),内部实现原理是利用Es5中的Object.definedProperty中的setter/getter代理数据,监控对数据的操作

2. 视图组件,UI界面对应的每个功能模块,可视为组件,划分组件是为了更好管理,维护,实现代码的复用,减少代码之间的依赖,也就是逼格高一词,高内聚,低耦合

3. 虚拟DOM:运行js的速度是很快的,大量的操作DOM就会很慢,时常在更新数据后会重新渲染页面,这样造成在没有改变数据的地方也重新渲染了DOM节点,这样就造成了很大程度上的资源浪费,用内存中生成与真实DOM与之对应的数据结构,这个在内存中生成的结构称为虚拟DOM,当model中数据发生变化时,Vue会将模板编译成虚拟 DOM 渲染函数,并结合响应系统，在应用状态改变时,vuejs能够智能地计算出重新渲染组件,并以最小代价并应用到DOM操作上

4. MVVM模式:其中M:model数据模型,V:view视图模板,而VM(观察者,vue帮我们实现了的):view model负责业务处理,对数据进行加工,处理,之后交给视图,它是通过模板中指令与数据进行关联控制的，使用mvvm模式,编码的重点是在于view层和model层,以前是面对DOM开发(MVP),现在更多的是面向数据编程