前端小白如何理解mvc mvp mvvm

本文解释了架构、框架和设计模式的概念,以及MVVM和MVP模式在软件设计中的作用。特别强调了前端框架React、Vue和Angular如何体现MVVM的思想。同时提到IT行业的分工(如前端、action层、service层)也可视为MVP理念的应用。
摘要由CSDN通过智能技术生成

架构、框架、设计模式是都是啥?

架构抽象出来不同组织或者对象亦或是简单组件,根据需求和各个单元的功能,进行组合排列。 从而完成系统的运行或者是实现目标。

框架使用什么样的规则,什么样的开发语言,或者使用什么样模型。

设计模式解决某一类问题的基本思路,或者是基本方法。

MV + C/P/VM是啥?

model: 模型,用来展示或者存放的数据。
view: 视图,用来显示界面用户交互面。
c: control 控制器, 用来接受用户操作信息或者指令信息,并且负责将信息转化数据
p: presenter ,单词的含义是主持人。我愿意理解为 “住持” ,作为一个系统寺庙的住持,它要负责接受信息,处理信息,发布信息。
vm: 视图模型
流程图介绍三种设计模式
mvc:
在这里插入图片描述
用户操作视图,发生改变通知控制器,控制更新数据,模型接受新数据,发给视图展示。例如:计算器,输入1 + 1, 计算后等于2,计算器显示了2.
mvp:
在这里插入图片描述

用户操作视图,发生改变通知住持,住持处理更新数据,模型接受新数据,发给住持,住持更新视图。

== 我们可以看到从这里开始,视图和模型直接不能直接通信了,这个思想也被mvvm模型借鉴==
mvvm
在这里插入图片描述

mvvm的视图和视图模型是双向数据绑定,他们彼此的变化不需要在单独处理而是响应式。其他的和mvp一样。
mvvm 软件设计思想 在react vue angular 前端框架都有体现。

tips: 在整个IT行业,一个公司it部门分为前端,action层,service层,是不是也是mvp思想的体现。

MVC(Model-View-Controller)、MVP(Model-View-Presenter)和MVVM(Model-View-ViewModel)是常见的软件架构模式,用于组织和管理应用程序的代码。 1. MVC(Model-View-Controller): - Model(模型):负责存储和管理应用程序的数据和业务逻辑。 - View(视图):负责显示数据并与用户进行交互。 - Controller(控制器):处理用户输入,并根据输入更新模型和视图。 在MVC中,模型和视图是相互独立的,通过控制器来协调数据的更新和视图的更新。用户的输入首先由控制器处理,然后控制器更新模型的状态,最后模型的变化会反映在视图上。MVC模式可以有效地分离应用程序的逻辑和界面。 2. MVP(Model-View-Presenter): - Model(模型):负责存储和管理应用程序的数据和业务逻辑。 - View(视图):负责显示数据并与用户进行交互。 - Presenter(展示器):作为View和Model之间的中间人,处理用户输入并更新模型和视图。 在MVP中,Presenter负责处理用户的输入,并根据输入更新模型和视图。View只负责显示数据和将用户输入传递给Presenter,而不直接与模型交互。这种分离使得视图和模型可以独立开发和测试。 3. MVVM(Model-View-ViewModel): - Model(模型):负责存储和管理应用程序的数据和业务逻辑。 - View(视图):负责显示数据并与用户进行交互。 - ViewModel(视图模型):作为View和Model之间的中间人,处理视图的状态和行为,并将数据从模型转换为视图可用的形式。 在MVVM中,视图通过绑定(数据绑定)与视图模型关联,当模型的状态发生变化时,视图模型会自动更新视图。这种双向绑定使得视图和模型始终保持同步,减少了手动更新视图的代码量。 总结来说,MVCMVPMVVM都是用于组织和管理应用程序的代码,它们都有各自的优势和适用场景。选择哪种架构模式取决于应用程序的需求、团队的技术背景和个人偏好。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值