欢迎光临散文网 会员登陆 & 注册

刚谈完MVC又来了一个MVVM,我都要懵了|( ̄0 ̄)

2023-07-28 09:20 作者:啥玩意你再说一遍  | 我要投稿

MVVM(Model-View-ViewModel)是一种软件架构模式,用于构建用户界面(UI)和业务逻辑的分离。它是从MVC(Model-View-Controller)模式演化而来,旨在更好地支持现代前端开发和数据绑定。

以下是MVVM的三个主要组成部分:

1. 模型(Model):模型表示应用程序的数据和业务逻辑。它负责管理和维护数据,但不包含与特定视图或用户界面相关的任何逻辑。

2. 视图(View):视图是用户界面的表示,通常是用户能够直接与之交互的部分。它们负责展示数据,但不包含业务逻辑。视图可以是页面、窗体、控件等。

3. 视图模型(ViewModel):视图模型是连接模型和视图之间的桥梁。它负责将模型中的数据转换为视图所需的格式,并提供与视图交互所需的指令和事件。视图模型通过数据绑定机制将数据从模型传递给视图,并响应视图的用户交互。它通常包含与视图相关的业务逻辑。

MVVM 的关键思想是将视图逻辑与业务逻辑分离,并通过数据绑定实现视图和视图模型之间的信息传递。通过这种方式,视图和视图模型可以独立开发和测试,并且能够在不影响彼此的情况下进行修改和演化。此外,MVVM 可以促进开发团队的协作,使设计师和开发人员可以并行工作,各自专注于自己的领域。

MVVM 在很多框架和平台上得到广泛应用,例如 Microsoft 的 WPF(Windows Presentation Foundation)和 Xamarin,以及流行的前端框架如 Vue.js 和 Angular。它提供了一种结构化的开发模式,帮助开发人员构建复杂的用户界面和交互性应用程序。

MVVM(Model-View-ViewModel)和MVC(Model-View-Controller)是两种常见的软件架构模式,用于设计和组织应用程序的代码。

区别:

1. 角色定位:

   - MVC:MVC 将应用程序分为三个主要组件:Model(模型)、View(视图)、Controller(控制器)。模型表示数据和业务逻辑,视图负责展示数据,控制器处理用户的输入和响应请求。

   - MVVM:MVVM 也将应用程序分为三个组件:Model(模型)、View(视图)、ViewModel(视图模型)。与 MVC 不同,视图模型(ViewModel)是 MVVM 的核心,它负责将模型中的数据转换为视图所需的格式,并提供与视图交互所需的指令和事件。

2. 数据绑定:

   - MVC:MVC 中通常使用观察者模式或手动更新的方式将数据从模型传递给视图,并通过控制器进行中介。视图和模型之间的数据传递需要手动管理。

   - MVVM:MVVM 强调数据绑定,通过数据绑定机制将视图和视图模型之间的数据关联起来。视图的更新可以自动反映模型的更改,同时用户对视图的交互通过视图模型进行处理。

3. 测试性:

   - MVC:MVC 的分层结构可以更容易地进行单元测试和集成测试。控制器和模型之间的交互可以通过模拟数据进行测试。

   - MVVM:MVVM 类似于 MVC,视图模型和模型之间的交互可以进行单元测试。视图模型可以独立于视图进行测试,同时视图和视图模型之间的交互也可以通过模拟数据进行测试。

联系:

1. 分离关注点:无论是 MVC 还是 MVVM,都强调将应用程序的不同关注点分离开来,以提高可维护性和可测试性。

2. 数据驱动界面:MVC 和 MVVM 都关注于将数据与界面进行关联,通过数据的变化驱动界面的更新。

3. 可扩展性:MVC 和 MVVM 都提供了一种结构化的模式,使开发人员可以按照松耦合的方式扩展和修改应用程序。

最终,选择 MVC 还是 MVVM 取决于具体的项目需求和开发团队的偏好。MVC 适用于传统的桌面和 Web 应用程序开发,而 MVVM 更适合现代的客户端和前端开发。

在一个MVVM框架中,前端(Client Side)和后端(Server Side)通常被分配不同的任务和职责。

前端(客户端)主要负责以下方面:

1. 视图(View):前端负责创建和渲染用户界面,包括用户界面的布局、样式和交互。它负责将数据展示给用户,并接收用户的输入。

2. 视图模型(ViewModel):前端开发人员负责实现视图模型,它将从后端获取的数据进行处理和准备,以便在视图上进行展示。视图模型通常包含与视图相关的业务逻辑,以及与后端进行数据交互的接口。

3. 数据绑定和状态管理:前端负责将视图和视图模型之间建立数据绑定关系,确保视图的显示始终与视图模型的状态保持同步。它通常使用框架提供的数据绑定工具或库来简化数据传递和状态管理。

后端(服务器端)主要负责以下方面:

1. 模型(Model):后端负责处理业务逻辑和数据持久化,包括与数据库或其他持久化存储的交互。它定义了数据的结构和规则,并提供对数据的 CRUD(创建、读取、更新、删除)操作。

2. 服务端逻辑:后端负责处理后端的业务逻辑,例如验证用户身份、实现业务规则、权限管理等。它通过提供 API(Application Programming Interface)来与前端进行通信,前端可以通过调用后端提供的接口来获取或修改数据。

3. 数据存储和管理:后端负责与持久化存储(如数据库)进行交互,包括读取、写入、修改和删除数据。它还可以负责缓存数据以提高性能,并处理并发访问和安全性等方面的问题。

总体而言,在MVVM框架中,前端主要关注实现用户界面的展示和交互,以及与视图模型的数据绑定,而后端主要关注处理业务逻辑、数据持久化和提供API接口。两者通过定义良好的接口和协议来实现数据的传递和交互,共同构建一个完整的应用程序。

请注意,目前的主流框架是Spring MVC和Spring Boot,而Spring框架与MVVM(Model-View-ViewModel)模式的结合并不常见。通常,MVVM模式更与前端框架(如Angular、Vue.js、React)相关联。

尽管如此,你可以在Spring MVC中应用类似MVVM模式的思想,以提高应用的可测试性、可扩展性和可维护性。下面是一些可能的应用方式:

1. 视图模型(ViewModel):创建独立于业务逻辑的视图模型,它们负责存储和管理与视图相关的数据,并提供必要的数据绑定功能。这可以帮助减少控制器(Controller)的负担,使其专注于处理请求和调用适当的服务。

2. 数据绑定:使用合适的数据绑定库,例如Spring MVC自带的Spring Expression Language(SpEL)或前端框架提供的数据绑定机制,实现视图和视图模型之间的双向数据流动。这样,当视图的状态发生变化时,视图模型可以自动更新,并且当视图模型的数据改变时,视图也会相应地进行更新。

3. 分离关注点:将业务逻辑和视图逻辑尽可能地分离开来,以增强代码的可测试性和可维护性。将一些通用的展示逻辑从控制器中抽取到视图模型中,使得控制器可以更专注于处理请求和调用业务服务。

4. 响应式编程:使用Spring WebFlux作为基于响应式编程的替代方案,它可以与Reactive Stream API和其他响应式编程技术一起使用。响应式编程可以提供更高的并发处理能力和更好的性能,在处理非阻塞I/O、实时数据流等场景中很有用。

总的来说,尽管Spring框架并没有原生支持MVVM模式,但你可以应用一些MVVM思想,通过引入视图模型、数据绑定和分离关注点等方式来提高代码的可读性、可测试性和可维护性。这需要结合适当的技术和框架,如Spring MVC、Spring Boot、数据绑定库和响应式编程技术来实现。


刚谈完MVC又来了一个MVVM,我都要懵了|( ̄0 ̄)的评论 (共 条)

分享到微博请遵守国家法律