MVC和MVVM

MVC和MVVM

一、MVC

1.概念：

• 模型（Model）：数据层，负责数据的处理和获取的数据接口层。数据可以从服务器上面获取，也可以从本地数据库获取。

• 视图（View）：视图层，是指用户看到的并且与之交互的界面。

• 控制器（Controller）：控制层，它是Model 和 View 之间的协调者。

2.通信方式如下

• View 传送指令到 Controller。

• Controller 完成业务逻辑后，要求 Model 改变状态。

• Model 将新的数据发送到 View，用户得到反馈。

  注意：这里的通信都是单向的。

3.应用场景：

​ 主要用于中大型项目的分层开发。

二、MVVM

1.概念：

• MVVM是Model-View-ViewModel的简写，即模型-视图-视图模型。
• （ Model ）每个页面单独数据。
• （ View ）每个页面中的HTML结构。
• （ ViewModel）视图模型是mvvm模式的核心，它是连接view和model的桥梁。

2.通信方式如下：

它本质上是MVC 的改进版，它可以实现数据的双向绑定，一是将模型（Model）转化成视图(View)，即将后端传递的数据转化成所看到的页面。实现的方式是：数据绑定。二是将视图(View)转化成模型(Model)，即将所看到的页面转化成后端的数据。实现的方式是：DOM 事件监听。

三、总结：MVC和MVVM区别

​MVC和MVVM的区别并不是VM完全取代了C，只是在MVC的基础上增加了一层VM，只不过是弱化了C的概念，mvvm主要解决了mvc中大量的DOM 操作使页面渲染性能降低，加载速度变慢，影响用户体验，和当 Model 频繁发生变化，开发者需要主动更新到View 。即mvvm实现了View和Model的自动同步，也就是当Model的属性改变时，不用再自己手动操作Dom元素，来改变View的显示，而是改变属性后该属性对应View层显示会自动改变。