MVC模式（Model-View-Controller Pattern）

常用于单应用框架或多应用的单体框架中,不过目前前后端采取分离形态，所以V很多已挪到了前端。MVC模式指的是模型，视图，控制器相互分离的一种思想。

MVC模式的实例

首先构建模型，一般是指数据的最小单元，其实模型的设计又有很多细节。

  1. /**
  2.  * 模型，在业务中模式设计其实特别讲究
  3.  * 在领域模型其实就细分了很多种类，比如：
  4.  * 失血模型
  5.  * 贫血模型
  6.  * 充血模型
  7.  * 胀血模型
  8.  */
  9. class Student {
  10.     getRollNo() {
  11.        return this.rollNo;
  12.     }
  13.     setRollNo(rollNo) {
  14.        this.rollNo = rollNo;
  15.     }
  16.     getName() {
  17.        return this.name;
  18.     }
  19.     setName(name) {
  20.        this.name = name;
  21.     }
  22. }

其次构建视图，一般用于输出或显示。

  1. class StudentView {
  2.     printStudentDetails(studentName, studentRollNo){
  3.        console.log("Student: ");
  4.        console.log("Name: " + studentName);
  5.        console.log("Roll No: " + studentRollNo);
  6.     }
  7. }

最后根据控制器来控制模型渲染视图。

  1. class StudentController {
  2.     constructor(model, view){
  3.        this.model = model;
  4.        this.view = view;
  5.     }
  6.     setStudentName(name){
  7.        this.model.setName(name);    
  8.     }
  9.     getStudentName(){
  10.        return this.model.getName();  
  11.     }
  12.     setStudentRollNo(rollNo){
  13.         this.model.setRollNo(rollNo);      
  14.     }
  15.     getStudentRollNo(){
  16.        return this.model.getRollNo();     
  17.     }
  18.     updateView(){           
  19.        view.printStudentDetails(this.model.getName(), this.model.getRollNo());
  20.     }  
  21. }

在使用来说就是根据数据变化，更新显示了。

  1. function retrieveStudentFromDatabase() {
  2.     const student = new Student();
  3.     student.setName("Robert");
  4.     student.setRollNo("10");
  5.     return student;
  6. }
  8. const model  = retrieveStudentFromDatabase();
  9. //创建一个视图：把学生详细信息输出到控制台
  10. const view = new StudentView();
  11. const controller = new StudentController(model, view);
  12. controller.updateView();
  13. //更新模型数据
  14. controller.setStudentName("John");
  15. controller.updateView();

MVC模式的优势

在MVC模式下，每层各司其职，层次清楚，层级干涉度小，有利于解除应用内层级之间的耦合。