MVVM模式下，ViewModel和View，Model有啥区别

Posted 2023-02-28

一、主体不同

1、ViewModel：视图模型是暴露公共属性和命令的视图的抽象。

2、View：视图是用户在屏幕上看到的结构、布局和外观（UI）。

3、Model：指代表真实状态内容的领域模型（面向对象），或指代表内容的数据访问层（以数据为中心）。

二、特点不同

1、ViewModel：一个ViewModel可以绑定到不同的"View"上。

2、View：可以独立于Model变化和修改。

3、Model：View变化的时候Model可以不变，当Model变化的时候View也可以不变。

三、作用不同

1、ViewModel：可以取出 Model 的数据同时帮忙处理 View 中由于需要展示内容而涉及的业务逻辑。

2、View：用于展示数据。

3、Model：用于声明实体，定义数据。

参考资料来源：百度百科-MVVM

参考技术A 简单的说，ViewModel就是View与Model的连接器，View与Model通过ViewModel实现双向绑定。

Model：很简单，就是业务逻辑相关的数据对象，通常从数据库映射而来，我们可以说是与数据库对应的model。
View：也很简单，就是展现出来的用户界面。
基本上，绝大多数软件所做的工作无非就是从数据存储中读出数据，展现到用户界面上，然后从用户界面接收输入，写入到数据存储里面去。所以，对于数据存储（model）和界面（view）这两层，大家基本没什么异议。但是，如何把model展现到view上，以及如何把数据从view写入到model里，不同的人有不同的意见。
MVC派的看法是，界面上的每个变化都是一个事件，我只需要针对每个事件写一堆代码，来把用户的输入转换成model里的对象就行了，这堆代码可以叫controller。
而MVVM派的看法是，我给view里面的各种控件也定义一个对应的数据对象，这样，只要修改这个数据对象，view里面显示的内容就自动跟着刷新，而在view 里做了任何操作，这个数据对象也跟着自动更新，这样多美。所以：
ViewModel：就是与界面（view）对应的Model。因为，数据库结构往往是不能直接跟界面控件一一对应上的，所以，需要再定义一个数据对象专门对应view上的控件。而ViewModel的职责就是把model对象封装成可以显示和接受输入的界面数据对象。
至于viewmodel的数据随着view自动刷新，并且同步到model里去，这部分代码可以写成公用的框架，不用程序员自己操心了。 参考技术B 在MVC里，View是可以直接访问Model的！从而，View里会包含Model信息，不可避免的还要包括一些业务逻辑。 MVC模型关注的是Model的不变，所以，在MVC模型里，Model不依赖于View，但是 View是依赖于Model的。不仅如此，因为有一些业务逻辑在View里实现了，导致要更改View也是比较困难的，至少那些业务逻辑是无法重用的。

MVVM在概念上是真正将页面与数据逻辑分离的模式，它把数据绑定工作放到一个JS里去实现，而这个JS文件的主要功能是完成数据的绑定，即把model绑定到UI的元素上。

有人做过测试：使用Angular（MVVM）代替Backbone（MVC）来开发，代码可以减少一半。

此外，MVVM另一个重要特性，双向绑定。它更方便你同时维护页面上都依赖于某个字段的N个区域，而不用手动更新它们。