MVVM（Model View ViewModel）模式 Mvvm定义MVVM是Model-View-ViewModel的简写。即模型-视图-视图模型。 【模型】指的是后端传递的数据。【视图】指的是所看到的页面。【视图模型】mvvm模式的核心，它是连接view和model的桥梁。 一是将【模型】转化成【视图】，即将后端传递的数据转化成所看到的页面。实现的方式是：数据绑定。 二是将【视图】转化成【模型】，即将所看到的页面转化成后端的数据。实现的方式是：DOM 事件监听 总结：在MVVM的框架下视图和模型是不能直接通信的。它们通过ViewModel来通信，ViewModel通常要实现一个observer观察者，当数据发生变化，ViewModel能够监听到数据的这种变化，然后通知到对应的视图做自动更新； 而当用户操作视图，ViewModel也能监听到视图的变化，然后通知数据做改动，这实际上就实现了数据的双向绑定。并且MVVM中的View 和 ViewModel可以互相通信 MVVM模式优点有以下几点： 视图层低耦合；各种代码写成控件后可重用；前后端分离明显； 便于测试和部署  View依然是我们的DOM Model就是我们我们抽离出来的obj ViewModel就是我们创建的Vue对象实例 它们之间如何工作呢？ 首先ViewModel通过Data Binding让obj中的数据实时的在DOM中显示。 其次ViewModel通过DOM Listener来监听DOM事件，并且通过methods中的操作，来改变obj中的数据。 ## MVC  Model：模型层，是应用程序中用于处理应用程序数据逻辑的部分。通常模型对象负责在数据库中存取数据。 View：视图层，用户界面渲染逻辑，通常视图是依据模型数据创建的。 Controller：控制器，数据模型和视图之间通信的桥梁，通常控制器负责从事图读取数据，控制用户输入，并向模型发送数据。 >View通过Controller来和Model联系，Controller是View和Model的协调者，View和Model单向联系。 用户通User过控制器Controller来操作模板Model从而达到视图View的变化 **MVC的思想**：Controller负责将Model的数据用View显示出来，换句话说就是在Controller里面把Model的数据赋值给View。 **MVC的特点**：实现关注点分离，即应用程序中的数据模型与业务和展示逻辑解耦。就是将模型和视图之间实现代码分离，松散耦合，使之成为一个更容易开发、维护和测试的客户端应用程序。 **MVC的优点**： 耦合度低，视图层和业务层分离； ；重用度高 ；生命周期成本低 ；可维护性高 ；部署快 >如果前端没有框架，只使用原生的html+js，MVC模式可以这样理解。 将html看成view，js看成controller，负责处理用户与应用的交互，响应对view的操作（对事件的监听），调用Model对数据进行操作，完成model与view的同步（根据model的改变，通过选择器对view进行操作）； 将js的ajax当做Model，也就是数据层，通过ajax从服务器获取数据。 ## MVVM  - MVVM与MVC最大的区别就是： 它实现了View和Model的自动同步，也就是当Model的属性改变时，我们不用再自己手动操作Dom元素，来改变View的显示，而是改变属性后该属性对应View层显示会自动改变。 html部分相当于View层，View通过通过模板语法来声明式的将数据渲染进DOM元素，当ViewModel对Model进行更新时，通过数据绑定更新到View。     Vue实例中的data相当于Model层，而ViewModel层的核心是Vue中的双向数据绑定，即Model变化时view可以实时更新，View变化也能让Model发生变化。