从MVC到MVVM

MVVM

特性

模型-视图-视图模型（model-view-viewmodel，MVVM），实质上是模型-视图-控制器（model-view-controller，MVC）的改进版。
其中最重要的特性是数据绑定（data binding），此外还包括依赖注入、路由配置、数据模板等一些特性。

MVC

起源

MVC模式在Web 1.0时代曾被广泛应用于Web架构中，然而其诞生的时间却比Web早几年。
最初，MVC被应用于桌面程序中，在PHP、JSP等脚本语言诞生后，也逐渐成为Web开发的主流模式。

View 视图层

View视图层是用户能够看到并进行交互的客户端界面，如桌面应用的图形界面、浏览器端渲染的网页等；

Model 模型层

Model指业务模型，用于计算、校验、处理和提供数据，但不直接与用户产生交互；

Controller 控制器

Controller控制器则负责收集用户输入的数据，向相关模型请求数据并返回相应的视图来完成交互请求。

MVC模式

MVC模式实现了M和V的代码分离，M专注于数据，V专注于表达，C则在M和V之间架起了一座桥梁。
即使采用同一个Model的数据，如果调用不同的View，也会得到不同的页面呈现。

MVC优点

• 减少了Model层的冗余代码
• 使得Model和View更加灵活和易于维护
• 同时也简化了项目的架构和管理。

MVVM

经过技术更迭，MVC渐渐的演变出更多的形态，有的开发者也会将其统一称作“MV*模式”，MVVM则是其中的一种。

ViewModel

MVVM架构的主要目的是分离视图（View）和模型（Model），ViewModel层封装了界面展示和操作的属性和接口。
通过数据绑定，将View和ViewModel关联在一起，当ViewModel中的数据发生变化时，View也会同步进行更新。

MVVM模式

具体实现

MVVM模式解耦了视图和模型。

1. 在模式中，每一个View都有对应的一个ViewModel，同时ViewModel与Model建立联系。
2. 当接收到用户请求后，ViewModel获取模型响应的数据，并通过数据绑定将相应的视图页面重新渲染。
3. 模型层的数据只需要传入ViewModel层即可实现视图的同步更新
   从而实现了视图和模型之间的松散耦合。

MVVM灵活性

MVC是系统架构级别的，而MVVM是用于单页面上的。
因此，MVVM的灵活性要大于MVC的。

如果将这里的M抛开，只看VVM的话，那这就是一个组件的设计模式。
所以，MVVM模式也是组件化的开发的最佳实践。