MVVM和MVC

MVVM（模型-视图-视图模型）

模型：后端传递的数据

视图：看到的页面

视图模型：（mvvm模式的核心）连接model和view的桥梁，它有两个方向：

1.将模型转换为视图：后端传递的数据转换为前端的页面（方式：数据绑定）

2.将视图转化为模型：将所看到的页面转化为后端数据（方式：DOM事件监听）

在MVVM模式下，视图和模型是不能直接通信的，它们通过ViewModel来通信，ViewModel相当于一个观察者，当数据发生变化时能监听到数据的这种变化，然后通知到对应的视图做自动更新；用户操作视图时，ViewModel也能监听到视图的变化 ，然后通知数据做改动。

MVC(Model-View-Controller  模型-视图-控制器)

M：模型

V：视图

C：页面业务逻辑

使用MVC的目的就是将M和V的代码分离，MVC是单向通信，M和V必须通过C来承上启下。

ViewModel存在的目的在于抽离Controller中展示的业务逻辑，而不是替代Controller，其它视图操作业务等还是应该放在Controller中实现。也就是说MVVM实现的是业务逻辑组件的重用。

MVVM框架出现的原因：

1.以前把传统的服务端代码放到浏览器中，产生了海量的js代码，链接各式各样的html和css，没有正规的组织形式，

2.为了解决浏览器兼容问题，出现了很多类库，比如jQuery，这些库没有实现对业务逻辑的分层，所以维护性和扩展性比较差

在vue中，Model:指的是js中的数据，如对象，数组等等。View:指的是页面视图viewModel:指的是vue实例化对象。

渐进式：

1.如果你已经有一个现成的服务端应用，你可以将vue 作为该应用的一部分嵌入其中，带来更加丰富的交互体验;2.如果你希望将更多业务逻辑放到前端来实现，那么VUE的核心库及其生态系统也可以满足你的各式需求（core+vuex+vue-route）。和其它前端框架一样，VUE允许你将一个网页分割成可复用的组件，每个组件都包含属于自己的HTML、CSS、JAVASCRIPT以用来渲染网页中相应的地方。3.如果我们构建一个大型的应用，在这一点上，我们可能需要将东西分割成为各自的组件和文件，vue有一个命令行工具，使快速初始化一个真实的工程变得非常简单（vue init webpack my-project）。我们可以使用VUE的单文件组件，它包含了各自的HTML、JAVASCRIPT以及带作用域的CSS或SCSS。以上这三个例子，是一步步递进的，也就是说对VUE的使用可大可小，它都会有相应的方式来整合到你的项目中。所以说它是一个渐进式的框架。

vue实现数据双向绑定的原理：

vue的双向绑定是由数据劫持结合发布者-订阅者模式实现的，通过Object.defineProperty()来劫持对象属性的setter和getter操作，在数据变动时进行相应的操作。

未完待续。。。