当前位置: 首页 > 后端技术 > Node.js

MVC、MVP和MVVM对比笔记

时间:2023-04-03 14:08:58 Node.js

MVC、MVP和MVVM三种非常重要的架构模式MVC(Model(模型)-View(视图)-Controller(控制器))MVP(模型(model)-View(视图)-Presenter(mediator))MVVM(Model(模型)-View(视图)-ViewModel(视图模型))MVC模式MVC是一种架构设计模式,通过分离关注点来支持改进的应用程序组织。它促进了业务数据(模型)与用户界面(视图)的分离,第三个组件(控制器)负责管理传统意义上的业务逻辑和用户输入。模型模型管理业务应用程序的数据。它们既不与用户界面相关,也不与表示层相关,相反,它们代表业务应用程序所需的唯一数据形式。当模型发生变化时(例如更新时),它通常会通知它的观察者(例如我们稍后将介绍的视图)发生了变化,以便观察者做出相应的反应。视图是模型的可视化表示,提供当前状态的过滤视图。JavaScript的视图是关于构建和操作DOM元素的。视图通常是模型的观察者,当模型发生变化时,视图会收到通知,从而使视图能够自行更新。Controller控制器是模型和视图之间的中介,它的典型职责是在用户操作视图时同步更新模型。MVC模式的优势有助于更轻松地模块化应用程序中的功能。整体维护更方便,控制器修改数据,数据驱动视图。将模型与视图解耦可以更轻松地编写单元测试。底层模型和控制器代码是解耦和可重用的。分离应用程序的体积和角色允许开发人员在核心逻辑上工作和在用户界面上工作的开发人员同时工作。MVP模式Model-View-Presenter(MVP)是MVC设计模式的衍生产品,专注于改进表示逻辑。PresenterMVP中的P代表Presenter。它是一个包含视图的用户界面逻辑的组件。与MVC不同,来自视图的调用被委托给控制器,控制器与视图分离,而是通过接口与之通信。在MVP中,P观察模型并在模型发生变化时更新视图(被动视图)。P实际上将模型绑定到视图,这是由MVC中的控制器预先承担的责任。MVC模式的优缺点与MVC模式相比,MVP的优点是:增强了应用程序的可测试性更清晰的隔离视图和模型缺点是:缺乏数据绑定支持MVVM模式MVVM(ModelViewViewModel)是一种MVC-基于和MVP架构模式,它试图更清楚地将用户界面(UI)与业务逻辑和行为分开。为此,许多示例使用声明性变量绑定来将视图层的工作与其他层分开。][3]ViewModel视图模型被认为是一个专用于数据转换的控制器。它可以将对象信息转换为视图信息,并将命令从视图传递给对象。视图模型位于我们的UI层后面的层中。它通过视图发布对象的公共数据,同时提供数据和方法作为视图的来源。视图和视图模型使用数据绑定和事件进行通信。视图模型不仅发布对象属性,它还提供其他方法和特性,例如验证。我们的视图处理自己的用户界面事件,并将相关事件映射到视图模型。对象及其属性与视图模型同步,并通过双向数据绑定进行更新。触发器(数据触发器)允许我们在视图状态更改后进一步更改对象属性。MVVM模式的优缺点优点:MVVM对于UI和驱动UI的构建块来说更方便。抽象视图的两个部分的并行开发减少了其背后的业务逻辑(或胶水)所需的代码量。视图模型比事件驱动代码更有效。易于单元测试视图模型(更像模型而不是视图)可以在不担心UI自动化和交互的情况下进行测试缺点:对于更简单的UI,MVVM可能有点矫枉过正虽然数据绑定可以是声明式的并且工作正常,但我们只是设置断点,它们比直接代码更难调试。在大型应用程序中,提高视图模型的设计以获得足够的泛化量会变得更加困难