聊一聊MVC模式跟MVVM模式

简介: 聊一聊MVC模式跟MVVM模式

MVC思想

可以简单理解为三层:

M:model模型层,对数据的增删改查也可以说是dao层,涉及到数据层service

V:view视图层,前端页面(html,js,css),专门对数据进行渲染给用户看的

C:controller 控制层,主要用于处理业务也包括路由

MVC理解

用户去下订单支付订单

用户点击下订单,触发点击事件,这就是视图层(view:V),通过事件触发以后会到达后端,后端在路由配置里面会接收到用户的请求,用户的请求到达后端要去执行哪一个方法,执行什么方法是路由所控制的,路由拿到用户请求进行分析之后就是request然后进行分配控制器,然后把用户的请求丢给控制器,让控制器给用户请求进行相应的处理,这就是控制层(controller:C)【控制层其实包含了路由和控制器,路由:只是用来请求用户的请求和拿到你的请求然后丢到给下一个控制器,不会做额外的处理,仅仅负责页面的导向作用】,业务处理完毕,要针对订单做保存,记录日志等等这些数据,这些数据会通过模型层(model)去做一个增加数据的操作,这时候一条订单,日志会保存到数据库里面,随后做一个查询操作,查询操作也是在数据层做的,拿到用户所需要的信息之后,会在返回到控制器,返回给(控制层),再一次的进行业务处理,最后把数据包装好之后,在抛给视图层,在页面上做一个渲染,这就是MVC的处理过程。

MVVM思想

mvvm思想就是在后端的mvc思想上把(view视图层)进行分离

V(view:视图层) 指整个视图层的页面 【页面HTML】

**M(model:数据层)**每一个页面所存在的一些数据【单页面的静态数据】他是一个JSON对象,在页面展示的,需要渲染的都是model。

MVVM理解

老式操作方式

如果采用老式的开发模式,可以通过js、jq去操作dom,把数据渲染到页面之后用户在修改自己的个人信息去提交,在用户修改的时候会去监听用户的操作,用户修改过后我们会通过对应的方法把数据重新的拿到,(也可以说是把相应的内容封装到model里面去),这个过程需要额外在写一个方法的,也可以直接采用form的序列化,把form里面的数据序列化成一个json对象,随后在提交到后端进行了个修改的操作。

MVVM操作方式

新增viewModel是一个核心,也可以说是调度者或者协调器,在视图层数据层做一个数据的传递工作。

从拿到用户数据不是直接去交给视图层渲染的,我们会把相应的数据丢给我们的VM让他去做一个渲染的操作,随后数据就可以在视图层渲染了,用户在视图层里操作了其他的view的元素,修改了一些数据,这个时候开发者不用再去写额外的方法,只要用户修改了数据,要么数据就相应的会通过VM再一次传递到model里面去,双向的俩个动作都是由VM这个调度者去协调进行相应的处理,对于这俩个方向来回操作,我们也成为数据双向绑定,这么一整个就是MVVM的设计思想

今天入职喜提试用期4000,原本不打算学了,我这里十分感谢大厂出身的一个大牛,放弃了原本高薪的机会,才让我们得以相遇,让我看到了希望,目标 :30岁之前年薪一百万,还有九年加油

相关文章
|
5月前
|
设计模式 存储 前端开发
MVVM、MVC、MVP三种常见软件架构设计模式的区别
MVC、MVP 和 MVVM 是三种常见的软件架构设计模式,主要通过分离关注点的方式来组织代码结构,优化开发效率。
119 12
|
22天前
|
前端开发
MVVM是什么?和MVC有何区别呢?
【10月更文挑战第11天】MVVM 和 MVC 都是为了更好地组织和管理软件架构,提高开发效率和代码质量。理解它们的特点和区别,有助于我们在实际开发中做出更合适的选择,并构建出更加优秀的应用程序。
|
21天前
|
存储 前端开发 测试技术
MVC、MVP、MVVM 模式
MVC、MVP 和 MVVM 是三种常见的软件架构模式,用于分离用户界面和业务逻辑。MVC(Model-View-Controller)通过模型、视图和控制器分离数据、界面和控制逻辑;MVP(Model-View-Presenter)将控制逻辑移到 Presenter 中,减少视图的负担;MVVM(Model-View-ViewModel)通过数据绑定机制进一步解耦视图和模型,提高代码的可维护性和测试性。
|
5月前
|
设计模式 存储 前端开发
MVC(Model-View-Controller)是一种软件设计模式,用于将应用程序的输入逻辑、业务逻辑和用户界面逻辑分离
【6月更文挑战第17天】**MVC模式**是软件设计模式,用于分离输入逻辑、业务逻辑和用户界面。模型处理数据和业务,视图展示数据,控制器协调两者响应用户请求。优点包括:关注点分离、提高开发效率、简化测试、支持多视图及便于大型项目管理。
51 3
|
2月前
|
设计模式 开发框架 前端开发
MVC 模式在 C# 中的应用
MVC(Model-View-Controller)模式是广泛应用于Web应用程序开发的设计模式,将应用分为模型(存储数据及逻辑)、视图(展示数据给用户)和控制器(处理用户输入并控制模型与视图交互)三部分,有助于管理复杂应用并提高代码可读性和维护性。在C#中,ASP.NET MVC框架常用于构建基于MVC模式的Web应用,通过定义模型、控制器和视图,实现结构清晰且易维护的应用程序。
49 2
|
1月前
|
前端开发 Java
【案例+源码】详解MVC框架模式及其应用
【案例+源码】详解MVC框架模式及其应用
50 0
|
2月前
|
前端开发 测试技术 开发者
MVC模式在现代Web开发中有哪些优势和局限性?
MVC模式在现代Web开发中有哪些优势和局限性?
|
2月前
|
设计模式 前端开发 PHP
PHP中实现简易的MVC模式
【8月更文挑战第31天】 本文将引导你了解如何在PHP中应用MVC(Model-View-Controller)架构模式,通过一个简单的例子展示其实现过程。我们将从基础的概念出发,逐步深入到代码实践,最终让你能够自己动手构建一个简易的MVC框架。文章不仅提供理论知识,还包含具体的代码示例,帮助你更好地理解并运用MVC模式。
|
5月前
|
设计模式 前端开发 Java
mvc模式详解
mvc模式详解
|
5月前
|
设计模式 存储 前端开发
【设计模式】MVC与MVVM详尽解读与实战指南
【设计模式】MVC与MVVM详尽解读与实战指南
864 0