MVC，大家都知道的模式……不太好

“MVC 是引用最多（也是最错误引用）的模式之一”——Martin Fowler

Crédit photo: 史蒂夫·约翰逊

与许多关于这个主题的文章和评论相反， MVC 不是全栈或后端模式， 这是一个仅限前端的模式。

作为初级开发人员，我们经常会掉入陷阱……但要完全了解 MVC 的真正含义，让我们首先了解一些基本原理。

一个 Web 应用程序通常分为 3 个部分，也称为 3 层架构。

数据表示层

它负责转换和显示要返回给用户的数据。这是应用程序的整个 UI 部分。这取决于业务层

业务层

这包含公司活动的所有逻辑和业务规则。它通常位于服务器端，不像表示层可以驻留在服务器端（服务器端渲染）或客户端（客户端渲染）。

数据持久层

该层负责持久化业务层希望“保存”的数据。她抽象出 “如何保存数据” 对于业务层。它与数据库、API 和其他连接器交互，以保存和检索上层所需的数据。

在这个架构中，有一个重要的概念需要记住：这些是层之间的依赖规则。业务层（应用程序的核心）理论上没有依赖关系。它完全抽象出知道如何使用其数据（由表示层）以及如何保存其数据（由持久层）。*

因此，Model Vue Controller (MVC) 模式错误地与 3 层架构相关联，如下所示：

• View = 数据表示层


• 控制器 = 业务层


• 模型 = 数据层

您必须承认，这两个概念很好地结合在一起，但是...

这是错的 ！ ❌

但是 Jamy，MVC 是如何成为仅前端模式的？

让我们谈谈控制器，它是故事中的罪魁祸首......

这 控制器 MVC 的模式元素是控制 Vue .这意味着他与后者强烈耦合，因为他……控制着她。小学我亲爱的华生。

或者，si le C 控制器 认识她 Vue ，它不能驻留在业务层，因为让我们记住： 业务层独立存在 .所以 控制器 MVC 在数据表示层上运行良好，因为它依赖于 Vue ！ CQFD

但是为什么我们（错误地）认为 MVC 控制器与业务层相关联呢？

从历史上看，Web 应用程序在服务器端呈现 HTML 页面。因此，客户端发送一个 HTTP 请求，服务器返回一个 HTML 格式的响应，浏览器简单地显示在用户的屏幕上。

在此配置中，HTTP 控制器是 控制器 MVC 因为它收到来自客户端的请求，所以查询 模型 检索数据，然后构建 Vue （HTML）发送回客户端。

最近，随着 Angular 或 React 等框架的到来，整个表示层现在都在客户端。渲染在浏览器中完成；这是著名的 客户端渲染 .除了我们忘记移动所有与之相关的概念外，这就是产生歧义的地方！

因此，在应用程序中 客户端渲染 , HTTP 控制器不是 MVC 控制器。 在这种配置中，HTTP 控制器有一个完全不同的功能：它只是通过 HTTP 协议上的 API 来打开业务层。它的唯一作用是接收客户端请求、查询业务层和呈现数据，通常以 JSON 格式呈现。它不再在数据呈现中扮演任何角色，只在业务层的边缘运行。

所以，混淆了 控制器 MVC 与 HTTP 控制器，我们扭曲了基本概念。我们将业务层定义为 “C” 来自 MVC。这就是混乱的地方！

模型，附带损害

通过将 HTTP 控制器错误识别为 控制器 MVC，它歪曲了对模式的整体理解。事实上，通过这个棱镜，我们可以很自然地将持久层识别为这个著名的理想候选者 模型 ，由我们使用 控制器 ，正如 MVC 向我们展示的那样。

正如您已经可以想象的那样……这是一个错误！ 模型不等同于持久层。 根据 MVC， 模型 应该包含业务逻辑，这就是业务层的角色。这 模型 因此是由后者渲染的！

具体来说，在所谓的“经典”Web 应用程序中， ** 模型** 因此被使用 ** 控制器** 客户端。当。。。的时候 ** 控制器** “更新” ** 模型** ，这将转换为对公开业务层的 API 的 http 调用。为了应对变化 ** 模型** ， 这 ** 控制器** 所以更新 ** Vue** ，它将被呈现到最终用户的屏幕上。

而这一切的观点？

为了 五 MVC，我们已经有点赢家了，这部分已经在正确的层了。 — 伊皮！

介于两者之间 客户端渲染 或者 服务器端渲染 , 原理不变；这 控制器 从中检索项目 模型 ，然后构建它的 Vue 和。这 Vue 然后仅限于 HTML 部分。它由 控制器 ，具体取决于您要呈现给用户的数据和逻辑。

如果你使用 反应 或者 角 ，你可能在不知不觉中做 MVC。

在角度

• 组件 .TS 包含控制器的所有逻辑


• 组件 .HTML 是你的看法


• 服务（API 等）是允许您阅读和更新您的 楷模

并做出反应

• React 组件包含 控制器


• render() 函数渲染 Vue


• 服务（API 等）是允许您阅读和更新您的 楷模

所以 ！希望对 MVC 的真正含义有所启发，我希望您不再使用这个词来指定 3 层架构！

很好的一天！

来源

https://martinfowler.com/eaaCatalog/modelViewController.html

Robert C Martin — 清洁架构和设计

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明

本文链接：https://www.qanswer.top/37434/55361802