MVC、MVP、MVVM三种模式的介绍及区别（代码例子说明）

大家好，欢迎来到IT知识分享网。

目录

一、MVC（Model-View-Controller）

二、MVP（Model-View-Presenter）

三、MVVM（Model-View-ViewModel）

四、几种架构模式的比较

五、例子演示

前言

       ”软件系统的架构将系统描述为计算机组件及组件之间的交互“。架构 = 组件 + 交互。

       MVC（Model-View-Controller）、MVP（Model-View-Presenter）和MVVM（Model-View-ViewModel）是常见的软件架构模式，用于将应用程序的逻辑分离成不同的组件。它们都有各自的特点和适用场景。

一、MVC（Model-View-Controller）

        MVC（Model-View-Controller） 是一种软件架构模式，用于将应用程序的逻辑分离成三个不同的组件：模型（Model）、视图（View）和控制器（Controller）。每个组件都有自己的职责和功能，相互之间通过定义好的接口进行通信。

1、MVC的组件说明

（1）Model（模型）：负责数据的处理和业务逻辑。

（2）View（视图）：负责展示数据给用户，并处理用户的输入。

（3）Controller（控制器）：负责协调模型和视图之间的交互，处理用户的输入并更新模型和视图。

MVC模式的核心思想是将应用程序分为三个独立的部分，使得每个部分可以独立开发、测试和维护。

这3种组件通过交互来协作：View创建Controller后， Controller根据用户交互调用Model的相应服务，而Model会将自身的改变通知View，View则会读取Model的信息以更新自身。

1. View 传送指令到 Controller
2. Controller 完成业务逻辑后，要求 Model 改变状态
3. Model 将新的数据发送到 View，用户得到反馈

另一种是直接通过controller接受指令:

用户接受信息，传到Controller——>model——>view

2、优缺点

• 优点：
  • 分离关注点：模型和视图的分离，提高了代码的可维护性和可测试性。
  • 控制器作为中介，实现了模型和视图之间的解耦。
  • 可以支持多个视图对应一个模型的情况。
• 缺点：
  • 视图和控制器之间的交互复杂，增加了开发的复杂度。
  • 控制器可能会变得臃肿，难以管理。

二、MVP（Model-View-Presenter）

1、MVP组件说明

（1）Model（模型）：负责数据的处理和业务逻辑。

（2）View（视图）：负责展示数据给用户，并处理用户的输入。

（3）Presenter（Presenter）：负责协调模型和视图之间的交互，处理用户的输入并更新模型和视图。

MVP模式将视图和模型解耦，通过Presenter作为中介来协调它们之间的交互。视图通过接口与Presenter进行交互，Presenter将视图的事件传递给模型进行处理，并将处理结果返回给视图进行展示。

2、优缺点

• 优点：
  • 视图和模型的解耦，方便进行单元测试。
  • Presenter作为中介，将视图和模型之间的交互逻辑集中处理。
  • 可以支持多个视图对应一个Presenter的情况。
• 缺点：
  • Presenter可能会变得臃肿，难以管理。
  • 视图和Presenter之间的交互仍然较为复杂。

三、MVVM（Model-View-ViewModel）

1、MVVM组件说明

（1）Model（模型）：负责数据的处理和业务逻辑。

（2）View（视图）：负责展示数据给用户，并处理用户的输入。

（3）ViewModel（视图模型）：负责将模型中的数据转换为视图可以直接使用的形式，并监听视图的变化来更新模型的数据。

MVVM模式通过数据绑定机制将ViewModel中的数据直接绑定到视图上，实现了视图和数据的自动同步。

2、优缺点

• 优点：
  • 视图和模型的解耦，方便进行单元测试。
  • 数据绑定机制简化了视图和模型之间的交互逻辑。
  • ViewModel可以通过命令模式实现对用户输入的响应。
• 缺点：
  • 数据绑定可能导致性能问题，需要谨慎使用。
  • 对于复杂的交互逻辑，可能需要编写额外的代码来处理。

四、几种架构模式的比较

1、应用场景

（1）MVC：Web应用程序、桌面应用程序等。

（2）MVP：桌面应用程序、移动应用程序等。

（3）MVVM：前端开发、移动应用程序等。

2、互相比较的优劣：

（1）MVC相对简单，适用于小型应用程序，但控制器可能变得臃肿。

（2）MVP在MVC的基础上进一步解耦了视图和模型，但Presenter可能变得臃肿。

（3）MVVM通过数据绑定机制简化了视图和模型之间的交互，但可能导致性能问题。

总结：选择合适的模式取决于具体的应用需求和团队的技术栈。如果应用规模较小且交互逻辑简单，可以选择MVC；如果需要更好的可测试性和解耦性，可以选择MVP；如果需要更高的灵活性和可维护性，可以选择MVVM。

五、例子演示

下面是一个使用C++代码示例来说明MVC、MVP和MVVM的区别：

 // 假设有一个计算器应用程序 // MVC示例 class CalculatorModel { public: int add(int a, int b) { return a + b; } }; class CalculatorView { public: void displayResult(int result) { cout << "Result: " << result << endl; } pair<int, int> getUserInput() { int a, b; cout << "Enter two numbers: "; cin >> a >> b; return make_pair(a, b); } }; class CalculatorController { private: CalculatorModel model; CalculatorView view; public: void calculate() { pair<int, int> input = view.getUserInput(); int result = model.add(input.first, input.second); view.displayResult(result); } }; // MVP示例 class CalculatorModel { public: int add(int a, int b) { return a + b; } }; class CalculatorView { public: void displayResult(int result) { cout << "Result: " << result << endl; } pair<int, int> getUserInput() { int a, b; cout << "Enter two numbers: "; cin >> a >> b; return make_pair(a, b); } }; class CalculatorPresenter { private: CalculatorModel model; CalculatorView view; public: void calculate() { pair<int, int> input = view.getUserInput(); int result = model.add(input.first, input.second); view.displayResult(result); } }; // MVVM示例 class CalculatorModel { public: int add(int a, int b) { return a + b; } }; class CalculatorViewModel { private: CalculatorModel model; public: int result; int inputA; int inputB; void calculate() { result = model.add(inputA, inputB); } }; class CalculatorView { public: CalculatorViewModel viewModel; void displayResult() { cout << "Result: " << viewModel.result << endl; } void getUserInput() { cout << "Enter two numbers: "; cin >> viewModel.inputA >> viewModel.inputB; } }; int main() { // MVC示例 CalculatorController controller; controller.calculate(); // MVP示例 CalculatorPresenter presenter; presenter.calculate(); // MVVM示例 CalculatorView view; view.getUserInput(); view.viewModel.calculate(); view.displayResult(); return 0; } 

以上是一个简单的计算器应用程序的示例，展示了MVC、MVP和MVVM三种模式的不同实现方式。你可以通过对比代码来理解它们之间的区别和特点。注意，这只是一个简化的示例，实际应用中可能会更加复杂和灵活。