1、MVVM模型
MVVM是Model-View-ViewModel的简写。即模型-视图-视图模型。Model指的是后端传递的数据。View指的是所看到的页面。ViewModel 是mvvm模式的核心，它是连接view和model的桥梁。
在MVVM模式中，把Model用纯JavaScript对象表示，View负责显示，两者做到了最大限度的分离，把Model和View关联起来的就是ViewModel。
ViewModel负责把Model的数据同步到View显示出来，还负责把View的修改同步回Model；我们只需关注业务逻辑，不需要手动操作DOM, 不需要关注数据状态的同步问题，复杂的数据状态维护完全由 MVVM 来统一管理。
总结：在MVVM的框架下视图和模型是不能直接通信的。它们通过ViewModel来通信（ViewModel通常要实现一个observer观察者），当数据发生变化，ViewModel能够监听到数据的这种变化，然后通知到对应的视图做自动更新，而当用户操作视图，ViewModel也能监听到视图的变化，然后通知数据做改动，这实际上就实现了数据的双向绑定。并且MVVM中的View 和 ViewModel可以互相通信。
2、MVC模型
MVC是Model-View- Controller的简写。即模型-视图-控制器。M和V指的意思和MVVM中的M和V意思一样。C即Controller指的是页面业务逻辑控制。使用MVC的目的就是将M和V的代码分离。MVC是单向通信。也就是View跟Model，必须通过Controller来承上启下。即：
- View 传送指令到 Controller ；
- Controller 完成业务逻辑后，要求 Model 改变状态 ；
- Model 将新的数据发送到 View，用户得到反馈。
3、MVVM的优点
- a.低耦合：MVVM模式中，数据是独立于UI的，ViewModel只负责处理和提供数据
- b.自动同步数据:ViewModel通过双向数据绑定把View层和Model层连接了起来，View和Model这两者可以自动同步。我们不需要手动操作DOM, 不需要关注数据状态的同步问题，MVVM 统一管理了复杂的数据状态维护
- c.可重用性：可以把一些视图逻辑放在一个ViewModel里面，让很多view重用这段视图逻辑
- d.独立开发：开发人员可以专注于业务逻辑和数据的开发（ViewModel），设计人员可以专注于页面设计
4、MVVM和MVC的区别
- ViewModel存在目的在于抽离Controller中展示的业务逻辑，而不是替代Controller
- mvvm 通过数据来驱动视图层的显示；而MVC是节点操作。
- mvvm主要解决了:mvc中大量的DOM 操作使页面渲染性能降低，加载速度变慢，影响用户体验的问题
- mvc中Model和View是可以直接打交道的，造成Model层和View层之间的耦合度高。而mvvm中Model和View不直接交互，而是通过中间桥梁ViewModel来同步
文章参考转载：
https://blog.csdn.net/weixin_43680581/article/details/104398953
https://blog.csdn.net/le_17_4_6/article/details/88836297