Nanyi
Date: February 1, 2015
Complex software must have a clear and reasonable architecture, otherwise it cannot be developed and maintained.
MVC (Model-view-controller) is one of the most common software architectures and is widely used in the industry. It's easy to understand, but it's not easy to tell the difference between the derived MVP and the MVVM architecture.
Last night, I read "Scaling isomorphic Javascript code" and suddenly realized that the difference was very simple. I can say it in a few words.
(Pictured: Taken in Valencia, Spain, August 2014)
First, MVC
The MVC pattern means that the software can be divided into three parts.
- View: User interface.
- Controller: Business logic
- Model: Data saving
The modes of communication between the sections are as follows.
- View Transfer command to Controller
- Controller needs Model to change state after completion of business logic
- Model sends new data to View, user gets feedback
All communications are one-way.
Second, interactive mode
When you accept user directives, MVC can be divided into two different ways. One is passed to the Controller through the View acceptance instruction.
The other is to accept the instructions directly through the controller.
Third, example: Backbone
Practical projects tend to take a more flexible approach, taking backbone.js as an example.
1. The user can send instructions (DOM events) to view, and the view directly requires Model to change state.
2. The user can also send instructions directly to the controller (changing the URL to trigger the Hashchange event) and then sent by the controller to the View.
3. The Controller is very thin and only acts as a route, and the view is very thick and the business logic is deployed in view. Therefore, Backbone simply cancels the Controller, leaving only one Router (router).
Four, MVP
The MVP mode renamed Controller to Presenter and changed the direction of communication.
1. The communication between the parts is bidirectional.
2. View and Model do not contact, are passed through Presenter.
3. View is very thin and does not deploy any business logic, called the "Passive View" (Passive view), which means that there is no initiative, and presenter is very thick, where all the logic is deployed.
V. MVVM
The MVVM pattern renamed Presenter to ViewModel, which is basically exactly the same as the MVP model.
The only difference is that it uses two-way binding (data-binding): The change of view is automatically reflected in ViewModel, and vice versa. This pattern is used in both Angular and Ember.
Finish
Excerpt from: http://www.ruanyifeng.com/blog/2015/02/mvcmvp_mvvm.html
Go Illustrations of MVC,MVP and MVVM