MVVM和MVC总结

---

什么是MVVM？

MVVM 由 Model、View、ViewModel 三部分构成

1. View 层

View 是视图层，也就是用户界面。前端主要由 HTML 和 CSS 来构建 。

2. Model 层
   Model 是指数据模型，泛指后端进行的各种业务逻辑处理和数据操控，对于前端来说就是后端提供的 api 接口。

3. ViewModel 是一个同步View 和 Model的对象；

MVVM 的核心是 ViewModel 层，它就像是一个中转站（value converter），负责转换 Model 中的数据对象来让数据变得更容易管理和使用，该层向上与视图层进行双向数据绑定，向下与 Model 层通过接口请求进行数据交互，起呈上启下作用

ViewModel 通过双向数据绑定把 View 层和 Model 层连接了起来，而 View 和 Model 之间的同步工作完全是自动的，无需人为干涉，因此开发者只需关注业务逻辑，不需要手动操作 DOM, 不需要关注数据状态的同步问题，复杂的数据状态维护完全由 MVVM 来统一管理。

什么是MVC

MVC是Model-View-Controller的缩写，即模型—视图—控制器

• Model：后端传递的 数据 。
• View：所看到的 页面 。
• Controller：页面 业务逻辑 。

1. MVC是 单向通信。即View和Model，必须通过Controller来承上启下。
2. 使用MVC的 目的 就是 将M和V的代码分离 。

MVC和MVVM的区别

mvc 和 mvvm 都是一种设计思想。主要就是 把mvc 中 Controller 演变成 mvvm 中的viewModel。MVC和MVVM的区别并不是VM完全取代了C，只是在MVC的基础上增加了一层VM，只不过是弱化了C的概念，ViewModel存在目的在于抽离Controller中展示的业务逻辑，而不是替代Controller，其它视图操作业务等还是应该放在Controller中实现。

mvvm 主要解决了 mvc 中大量的 DOM 操作使页面渲染性能降低，加载速度变慢，影响用户体验的缺点。当 Model 频繁发生变化，开发者都需要主动更新到 View 。MVVM实现的是业务逻辑组件的重用，使开发更高效，结构更清晰，增加代码的复用性。

参考文章

什么是 MVVM？

知乎