摘要:模式的目的是实现一种动态的程序设计,使后续对程序的修改和扩展简化,并且使程序某一部分的重复利用成为可能。它处理事件并作出响应。事件包括用户的行为和数据上的改变。此外,提高了应用程序的灵活性和可配置性。
我的博客地址 → MVC | The story of Captain,转载请注明出处。
MVC模式 (Model–View–Controller)是软件工程中的一种软件架构模式,把软件系统分为三个基本部分:模型(Model)、视图(View)和控制器(Controller)。
MVC模式 的目的是实现一种动态的程序设计,使后续对程序的修改和扩展简化,并且使程序某一部分的 重复利用 成为可能。除此之外,此模式通过对复杂度的简化,使程序结构更加直观。软件系统通过对自身基本部分分离的同时也赋予了各个基本部分应有的功能。
MVC 简介模型(Model): 用于 封装与应用程序的业务逻辑相关的数据 以及 对数据的处理方法。Model 有对数据直接访问的权力,Model 不依赖 View 和 Controller,也就是说, Model 不关心它会被如何显示或是如何被操作。
视图(View): 负责格式化显示数据,Controller 会有一个机制将处理的结果 (可能是 Model, 集合或是状态等) 交给 View,然后由 View 来决定怎么显示。
控制器(Controller):起到不同层面间的桥梁组织作用,用于控制应用程序的流程。它处理事件并作出响应。事件 包括用户的行为和数据 Model 上的改变。
MVC 优点
表现与数据的分离:
View 表现层 负责数据的展示于数据的获取,Model 数据层负责数据的储存与数据的运算,Controller 控制层负责处理信息,在表现层与数据层之间起传输作用,控制流程的走向。三个模块进行分离,各司其职、分而治之,模块功能责任明确,有高度解耦之效,提高开发效率。
代码的高重复利用率:
多个 View 可以使用一个 Model,多个 View 与 Model 之间可以使用一个 Controller 进行通信,因为功能模块的分离使得代码重复利用率大大提升。
提升项目的生命周期:
因为高度的去耦合,在后期的维护与升级上可以做到快速高效,模块之间互不影响,延长了项目的生命周期。
应用软件的不同功能可以不止有一个 MVC,A 功能可以有 i 个 Model、j 个 View、k 个 Controller,B 功能同样也是。站在不同功能的角度,每个功能都拆分为 MVC,站在整个软件架构角度也是拆分为 MVC,因此 MVC 更容易实现一个项目的管理划分。
以下内容摘自维基百科:
MVC 模式在概念上强调 Model、View、Controller 的分离,各个模块也遵循着由 Controller 负责处理消息、Model 负责处理数据、View 负责数据展示 的职责分离原则负责各自的功能。MVC 可以从根本上强制性地将数据层和表现层分开,尽管构造 MVC 模式需要一些额外的工作,但是它带给我们的好处是毋庸置疑的。MVC 在 JavaScript 中的应用示例
首先,多个 View 能共享一个 Model 。如今,同一个Web应用程序会提供多种用户界面,例如用户希望既能够通过浏览器来收发电子邮件,还希望通过手机来访问电子邮箱,这就要求Web网站同时能提供Internet界面和WAP界面。在MVC设计模式中, Model 响应用户请求并返回响应数据,View 负责格式化数据并把它们呈现给用户,业务逻辑和表示层分离,同一个 Model 可以被不同的 View 重用,所以大大提高了代码的可重用性。
其次,Controller 是自包含(self-contained)指高独立内聚的对象,与 Model 和 View 保持相对独立,所以可以方便的改变应用程序的数据层和业务规则。例如,把数据库从MySQL移植到Oracle,或者把RDBMS数据源改变成LDAP数据源,只需改变 Model 即可。一旦正确地实现了控制器,不管数据来自数据库还是LDAP服务器,View 都会正确地显示它们。由于MVC模式的三个模块相互独立,改变其中一个不会影响其他两个,所以依据这种设计思想能构造良好的少互扰性的构件。
此外,Controller 提高了应用程序的灵活性和可配置性。Controller 可以用来连接不同的 Model 和 View 去完成用户的需求,也可以构造应用程序提供强有力的手段。给定一些可重用的 Model 、 View 和Controller 可以根据用户的需求选择适当的 Model 进行处理,然后选择适当的的 View 将处理结果显示给用户。
因为 MVC 模式强调职责分离,所以在发展 MVC 应用时会产生很多文件,MVC 模式要求开发者以更高的构架(Application Architecture)导向思维来进一步思考应用程序的设计,而非用大杂烩的方式开发撰写应用程序,对于应用程序的生命周期以及后续的可扩充与可维护性而言有相当正面的帮助。另外,MVC 职责分离也带来了一个现代软件工程要求的重要特性:可测试性 (Testability),MVC-based 的应用程序在良好的职责分离的设计下,各个部分可进行独立的单元测试,有利于与企业内的自动化测试、持续集成 (Continuous Integration) 与持续发行 (Continuous Delivery) 的流程集成,减少应用程序改版部署所需的时间。
对于一个刚入门的初学者来说,架构导向的思考会有一定的门槛,需要较多的实现与练习才能具备相应的能力,大多数的初学者还是较习惯于大杂烩式的程序撰写,所以可能会对 MVC 模式抱持着排斥或厌恶的心态,然而 MVC (或是其他的Design Patterns) 都是有助于应用程序长远的发展,虽然大杂烩式的程序也可以用来发展长生命周期的应用程序,但是相较于 MVC,大杂烩式的程序在可扩充性和可维护性 (尤其是可测试性) 上会远比 MVC 复杂很多,相反的,MVC 模式的应用程序是在初始开发时期必须先思考并使用软件架构,使得开发时期会需要花较多心力,但是一旦应用程序完成后,可扩充性、可维护性和可测试性反而会因为 MVC 的特性而变得容易。
MVC 模式在已有众多优秀 Framework 的现代,早就已经没有不适合小型应用的问题,小型的应用还是可以由 MVC Framework 的应用来获取 MVC 的优点,同时它也能作为未来小型应用扩充到大型应用时的基础。若一开始就想要做大型应用,那么 MVC 模式的职责分离以及要求开发的架构思考会更适合大型应用的开发。
以下以 JavaScript 为例,演示 MVC 模型:
// View 负责展示数据 let View = { init: function () { this.renderData = (msg) => alert(msg); } }; // Model 负责存储数据 let Model = { init: funciton () { this.data = "Hello world!"; } }; // Controller 负责 Model 和 View 之间的通信 let Controller = { init: function () { Model.init(); View.init(); this.handleMessage(); }, handleMessage: () => View.renderData(Model.data); }; // 利用 Controller.init() 进行整个功能的初始化,启动整个功能 Controller.init();日常生活中的 MVC 实例
在日常生活中也有很多能够映射出 MVC 的例子,例如我们常用的电脑就可以拆分为 MVC:
Model:电脑的硬盘、CPU、显卡、各个单片机等,负责数据的存储与运算。
View:显示器,负责与用户交互,展示数据信息。
Controller:鼠标与键盘,负责传达事件,用户使用键盘输入字符,使用鼠标点击屏幕,捕获到该事件后,Model(处理器) 将 View(屏幕) 的数据进行存储并进行运算,最终结果又会展示到 View(屏幕)上。
每个模块之间互不影响,键盘坏了可以换键盘(Controller),鼠标坏了换鼠标(Controller),显示器坏了换显示器(View),内存不够用了再加内存条(Model)等等,充分体现了 MVC 的模块化分离思想。
更多精彩内容,请点击 → The story of Captain
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/92765.html
摘要:所以我查了很多的材料,希望能从自己的角度上用通俗的语言阐述前端框架的演变。现在,前端页面会有很多复杂的交互逻辑和用户体验,如果还使用之前老的框架,对层的操作就会难以维护,这就是前端框架要不断演变的主要原因。 说实在的,我不觉得MVC,MVVM这些框架有什么难的,直到我想写一篇文章去系统的阐述它们。我遇到了以下几个问题,1.不同的文章说的南辕北辙 2.没有一个清晰的大纲和框架分类。所以我...
阅读 826·2023-04-25 19:49
阅读 3760·2021-09-30 09:47
阅读 2747·2021-09-13 10:21
阅读 2684·2021-08-24 10:04
阅读 3172·2019-08-30 15:55
阅读 2303·2019-08-30 15:55
阅读 2402·2019-08-30 15:54
阅读 3475·2019-08-30 13:53