CodeGym /Java 博客 /随机的 /第 7 部分。介绍 MVC(模型-视图-控制器)模式
John Squirrels
第 41 级
San Francisco

第 7 部分。介绍 MVC(模型-视图-控制器)模式

已在 随机的 群组中发布
本资料是“企业发展概论”系列的一部分。往期文章: 第 7 部分。介绍 MVC(模型-视图-控制器)模式 - 1在本文中,我们将了解一种叫做 MVC 的东西。我们将讨论什么是 MVC,触及它的历史,探索 MVC 中体现的基本思想和概念,逐步了解如何将应用程序分解为模型、视图和控制器模块,编写一个使用 Spring Boot 的小型 Web 应用程序,并以 Spring MVC 为例,了解如何将数据从 Java 代码发送到 HTML 页面。要理解这些材料,您需要熟悉设计模式,尤其是观察者和外观。并且熟悉 HTTP 请求和响应,理解 HTML 的基础知识,知道什么是 Java 注解。喝杯咖啡吃点心,放松一下。让我们开始。

MVC 的历史

MVC 背后的想法是由 Trygve Reenskaug 在 1970 年代后期在 Xerox PARC 工作时制定的。在那些日子里,使用计算机工作需要学位并不断研究大量文档。Reenskaug 与一群非常强大的开发人员一起解决的任务是简化普通用户与计算机的交互。有必要创造一种工具,一方面要极其简单易懂,另一方面要能够控制计算机和复杂的应用程序。Reenskaug 所在的团队开发了“适合所有年龄段的儿童”的笔记本电脑——Dynabook,以及在 Alan Kay 的领导下开发的 SmallTalk 语言。就在那时,友好界面的概念被确立了。在许多方面,Reenskaug 和他的团队所做的工作影响了 IT 领域的发展。这是一个有趣的事实,它并不直接适用于 MVC,但说明了这些发展的重要性。艾伦·凯, “当我第一次接触 Apple 时,那是在 84 年,当时 Mac 已经问世,《新闻周刊》联系了我,问我对 Mac 的看法。我说,‘好吧,Mac 是第一台足够优秀的个人电脑受到批评。所以,在 2007 年发布 iPhone 之后,他把它拿到我面前,递给了我。他说,'艾伦,这东西好到要被批评吗?我说,‘史蒂夫,把它做得和平板电脑一样大,你就会统治世界。’”3 年后,2010 年 1 月 27 日,Apple 推出了对角线为 9.7 英寸的 iPad。换句话说,史蒂夫·乔布斯几乎完全遵循了艾伦·凯的建议。Reenskaug 的项目持续了 10 年。但是又过了 10 年,第一个关于 MVC 的出版物才曝光。Martin Fowler,多本关于软件架构的书籍和文章的作者,提到他使用 Smalltalk 的工作版本研究了 MVC。由于很长一段时间没有从原始来源获得有关 MVC 的信息,并且由于其他几个原因,出现了大量对这个概念的不同解释。因此,许多人将 MVC 视为一种设计模式。不太常见的是,MVC 被称为复合模式或多个模式的组合,它们一起工作以创建复杂的应用程序。但是,如前所述,MVC 实际上主要是一组架构思想/原则/方法,可以使用不同的模式以各种方式实现……接下来,我们将考虑嵌入在 MVC 概念中的主要思想。由于其他几个原因,出现了大量对这个概念的不同解释。因此,许多人将 MVC 视为一种设计模式。不太常见的是,MVC 被称为复合模式或多个模式的组合,它们一起工作以创建复杂的应用程序。但是,如前所述,MVC 实际上主要是一组架构思想/原则/方法,可以使用不同的模式以各种方式实现……接下来,我们将考虑嵌入在 MVC 概念中的主要思想。由于其他几个原因,出现了大量对这个概念的不同解释。因此,许多人将 MVC 视为一种设计模式。不太常见的是,MVC 被称为复合模式或多个模式的组合,它们一起工作以创建复杂的应用程序。但是,如前所述,MVC 实际上主要是一组架构思想/原则/方法,可以使用不同的模式以各种方式实现……接下来,我们将考虑嵌入在 MVC 概念中的主要思想。

MVC:基本思想和原则

  • VC 是一套架构思想和原则,用于构建具有用户界面的复杂信息系统
  • MVC是缩写,代表:模型-视图-控制器
免责声明:MVC 不是设计模式。MVC 是一组架构思想和原则,用于构建具有用户界面的复杂系统。但为方便起见,为了不重复说“一套架构思想……”,我们将参考MVC模式。让我们从简单的开始。Model-View-Controller 背后隐藏着什么?当使用 MVC 模式开发带有用户界面的系统时,您需要将系统分为三个组件。它们也可以称为模块或组件。随心所欲地称呼它们,但将系统分为三个部分。每个组件都有自己的用途。 模型。第一个组件/模块称为模型。它包含应用程序的所有业务逻辑。 看法。系统的第二部分是视图。该模块负责向用户显示数据。用户看到的一切都是由视图生成的。 控制器。此链中的第三个环节是控制器。它包含负责处理用户操作的代码(所有用户操作都在控制器中处理)。模型是系统中最独立的部分。如此独立以至于它一定对视图和控制器模块一无所知。该模型是如此独立,以至于它的开发人员可能对视图和控制器几乎一无所知。视图的主要目的是以用户可以使用的格式提供来自模型的信息。视图的主要限制是它不得以任何方式更改模型。控制器的主要目的是处理用户操作。用户通过控制器对模型进行更改。或者更准确地说,存储在模型中的数据。这是您之前在课程中看到的图表: 第 7 部分。介绍 MVC(模型-视图-控制器)模式 - 2从这一切,我们可以得出一个合乎逻辑的结论。一个复杂的系统需要进行模块划分。让我们简要描述一下实现这种分离的步骤。

步骤 1. 将应用程序的业务逻辑与用户界面分离

MVC 的主要思想是任何具有用户界面的应用程序都可以分为 2 个模块:负责实现业务逻辑的模块和用户界面。第一个模块将实现应用程序的主要功能。该模块是系统的核心,应用程序的领域模型在这里实现。在MVC范式中,这个模块就是字母M,即模型。第二个模块实现了整个用户界面,包括向用户显示数据和处理用户与应用程序交互的逻辑。这种分离的主要目标是确保系统的核心(MVC 术语中的“模型”)可以独立开发和测试。进行此分离后,应用程序的架构如下所示: 第 7 部分。介绍 MVC(模型-视图-控制器)模式 - 3

第 2 步 使用观察者模式使模型更加独立并同步用户界面

这里我们有 2 个目标:
  1. 为模型实现更大的独立性
  2. 同步用户界面
以下示例将帮助您理解用户界面同步的含义。假设我们在线购买电影票并查看剧院的可用座位数。与此同时,其他人可能正在购买电影票。如果这个人比我们先买票,我们希望看到我们正在考虑的放映时间的可用座位数量减少。现在让我们考虑如何在程序中实现它。假设我们有我们系统的核心(我们的模型)和接口(买票的网页)。两个用户试图同时在剧院中选择座位。第一个用户买票。该网页需要向第二个用户显示这已经发生。这应该如何发生?如果我们从核心更新界面,那么核心(我们的模型)将依赖于接口。在开发和测试模型时,我们必须牢记更新界面的各种方式。为此,我们需要实现观察者模式。此模式允许模型向所有侦听器发送更改通知。作为事件侦听器(或观察器),用户界面接收通知并进行更新。一方面,观察者模式让模型通知界面(视图和控制器)发生了变化,而实际上对此一无所知,从而保持独立。另一方面,它使得同步用户界面成为可能。我们需要实现观察者模式。此模式允许模型向所有侦听器发送更改通知。作为事件侦听器(或观察器),用户界面接收通知并进行更新。一方面,观察者模式让模型通知界面(视图和控制器)发生了变化,而实际上对此一无所知,从而保持独立。另一方面,它使得同步用户界面成为可能。我们需要实现观察者模式。此模式允许模型向所有侦听器发送更改通知。作为事件侦听器(或观察器),用户界面接收通知并进行更新。一方面,观察者模式让模型通知界面(视图和控制器)发生了变化,而实际上对此一无所知,从而保持独立。另一方面,它使得同步用户界面成为可能。

Step 3 将界面分离为视图和控制器

我们继续将应用程序划分为模块,但现在处于层次结构的较低级别。在此步骤中,用户界面(我们在步骤 1 中将其分离为一个不同的模块)被拆分为一个视图和一个控制器。在视图和控制器之间划清界限是很困难的。如果我们说视图是用户看到的,而控制器是允许用户与系统交互的机制,你可能会指出矛盾。网页上的按钮或手机屏幕上的虚拟键盘等控制元素基本上是控制器的一部分。但它们与视图的任何部分一样对用户可见。我们在这里真正谈论的是功能分离。用户界面的主要任务是促进用户与系统的交互。
  • 输出并方便地向用户显示系统信息
  • 输入用户数据和命令(将它们传达给系统)
这些功能决定了用户界面应该如何划分为模块。最后,系统架构如下所示: 第 7 部分。介绍 MVC(模型-视图-控制器)模式 - 4这就是我们如何得到一个由三个模块组成的应用程序,称为模型、视图和控制器。让我们总结一下:
  1. 根据MVC范式的原则,一个系统必须被分成模块。
  2. 最重要和独立的模块应该是模型。
  3. 模型是系统的核心。应该可以独立于用户界面开发和测试它。
  4. 要实现这一点,在划分的第一步,我们需要将系统划分为模型和用户界面。
  5. 然后,使用观察者模式,我们增强了模型的独立性并同步了用户界面。
  6. 第三步是将用户界面划分为控制器和视图。
  7. 将用户数据接收到系统中所需的一切都在控制器中。
  8. 将信息传递给用户所需的一切都在视图中。
在你喝热巧克力之前还有一件重要的事情要讨论。

关于视图和控制器如何与模型交互的一些信息

通过控制器输入信息,用户可以更改模型。或者至少,用户更改了模型数据。当用户通过界面元素(通过视图)接收信息时,用户正在接收有关模型的信息。这是怎么发生的?视图和控制器通过什么方式与模型交互?毕竟,视图类不能直接调用模型类的方法来读取/写入数据。否则,我们就不能说模型是独立的。模型是一组密切相关的类,视图和控制器都不应该访问这些类。要将模型连接到视图和控制器,我们需要实现外观设计模式。模型的外观是模型和用户界面之间的层,视图通过它接收方便格式化的数据,控制器通过调用外观上的必要方法来更改数据。最后,一切看起来像这样: 第 7 部分。介绍 MVC(模型-视图-控制器)模式 - 6

MVC:我们得到了什么?

MVC 范例的主要目标是将业务逻辑(模型)的实现与其可视化(视图)分开。这种分离增加了代码重用的可能性。当我们需要以不同的格式呈现相同的数据时,MVC 的好处最为明显。例如,作为表格、图形或图表(使用不同的视图)。同时,在不影响视图实现方式的情况下,我们可以更改我们对用户操作(按钮点击、数据输入)的响应方式。如果遵循MVC的原则,就可以简化软件开发,增加代码可读性,提高可扩展性和可维护性。在“企业开发简介”系列的最后一篇文章中,我们将了解使用 Spring MVC 构建的 MVC 实现。 第 8 部分。让我们使用 Spring Boot 编写一个小应用程序
评论
TO VIEW ALL COMMENTS OR TO MAKE A COMMENT,
GO TO FULL VERSION