复杂的软件必须有清晰合理的架构,否则无法开发和维护。
MVC、MVP、MVVM 就是常见的软件架构模式,属于编程的方法论。
MVC
MVC 是 Model-View-Controller 的缩写
- Model 代表数据模型,Model变更后,通知View更新视图。
- View 代表视图(用户的操作界面),检测用户的键盘、鼠标等行为,传递调用Controller执行应用逻辑。
- Controller代表控制器,处理 View 和 Model 之间协作的应用逻辑或业务逻辑。
较其他模式的特点:
- Model 和 View 之间存在直接的通讯,而这在其他两种模式中不存在
优点:
- 职责分离:模块化程度高、Controller可替换、可复用性、可扩展性强。
- 多视图更新:使用观察者模式可以做到单Model通知多视图实现数据更新。
缺点:
- 测试困难:View需要UI环境,因此依赖View的Controller测试相对比较困难。
- 依赖强烈:View强依赖Model(特定业务场景),因此View无法组件化设计。
MVP
MVP 是 Model-View-Presenter 的缩写
MVP 与 MVC 最重要的差别是Model和View之间不进行通讯,都是通过Presenter完成。
- Passive View:View不再处理同步逻辑,对Presenter提供接口调用。由于不再依赖Model,可以让View从特定的业务场景中抽离,完全可以做到组件化。
- Presenter(Supervising Controller):和经典MVC的Controller相比,任务更加繁重,不仅要处理应用业务逻辑,还要处理同步逻辑(高层次复杂的UI操作)。
- Model:Model变更后,通过观察者模式通知Presenter,如果有视图更新,Presenter又可能调用View的接口更新视图。
较其他模式的特点:
-
各部分之间的通信,都是双向的。
-
View 与 Model 不发生联系,都通过 Presenter 传递。
-
View 非常薄,不部署任何业务逻辑,称为"被动视图"(Passive View),即没有任何主动性,而 Presenter非常厚,所有逻辑都部署在那里。
优点:
- Presenter便于测试、View可组件化设计
缺点:
- Presenter厚、维护困难
MVVM
MVVM 是 Model-View-ViewModel 的缩写
MVVM 模式将 Presenter 改名为 ViewModel,基本上与 MVP 模式完全一致。唯一的区别是,它采用双向绑定(data-binding):View的变动,自动反映在 ViewModel,反之亦然。
- ViewModel:内部集成了Binder(Data-binding Engine,数据绑定引擎),在MVP中派发器View或Model的更新都需要通过Presenter手动设置,而Binder则会实现View和Model的双向绑定,从而实现View或Model的自动更新。
View:可组件化,例如目前各种流行的UI组件框架,View的变化会通过Binder自动更新相应的Model。
Model:Model的变化会被Binder监听(仍然是通过观察者模式),一旦监听到变化,Binder就会自动实现视图的更新。
较其他模式的特点:
-
在MVVM架构下,View和 Model 之间并没有直接的联系,而是通过ViewModel进行交互,Model和 ViewModel 之间的交互是双向的, 因此View 数据的变化会同步到Model中,而Model 数据的变化也会立即反应到View 上。
-
ViewModel 通过双向数据绑定把 View 层和 Model层连接了起来,而View和 Model 之间的同步工作完全是自动的,无需人为干涉,因此开发者只需关注业务逻辑,不需要手动操作DOM,不需要关注数据状态的同步问题,复杂的数据状态维护完全由 MVVM 来统一管理
优点:
- 提升了可维护性,解决了MVP大量的手动同步的问题,提供双向绑定机制。
- 简化了测试,同步逻辑是交由Binder处理,View跟着Model同时变更,所以只需要保证Model的正确性,View就正确。
缺点:
- 产生性能问题,对于简单的应用会造成额外的性能消耗。
- 对于复杂的应用,视图状态较多,视图状态的维护成本增加,ViewModel构建和维护成本高。
廖雪峰:MVVM
阮一峰:MVC,MVP 和 MVVM 的图示
阮一峰:谈谈MVC模式
掘金:基于Vue实现一个简易MVVM
掘金:MVC、MVP、MVVM,我到底该怎么选?