MVC及MVVM介绍

MVC及MVVM

1. MVVM

MVVM,是Model-View-ViewModel的缩写,即模型-视图-视图模型. 本质上是MVC(模型-视图-控制器)的改进版,它最重要的特性就是数据绑定,很多js框架都是基于MVVM框架.Vuejs就是其中之一.

• M(模型) 实体数据
• V(视图) 页面
• VM(视图模型) mvvm的核心,连接Model和View的桥梁

ViewModel在其中处于承上启下的作用

• 承上: 将模型转为视图,也就是将实体模型,转化成我们可以直接看到的页面数据,实现原理是:数据绑定
• 启下: 将视图转为模型,也就是将页面数据转为数据实体. 实现原理是:dom事件的监听

这种模式,我们称之为数据的双向绑定

所以呢,我们可以得出结论,View和Model之间是不可以直接通信的,他们之间是通过ViewModel通信,然后ViewModel要实现一个观察者模式(ObServer),当数据发生变化,ViewModel能够监听到这种变化,再通知对应的视图,做自动更新.

2.MVC

MVC 是Model-View-Controller的缩写,即模型-视图-控制器 Model和View的意思与MVVM中的意思一样,不同的是Controller,也就是控制器.

• M(模型) 实体数据
• V(视图) 页面
• C(控制器) 业务处理层

MVC模式实现了M和V的代码分离,M专注于数据,V专注于视图.MVC是单向通信的,也就是VIew和Model必须通过Controller来承上启下.

MVC和MVVM的区别并不是VM完全取代了C,ViewModel只是抽离了Controller中展示业务逻辑.而不是替代了Controller,其它视图操作业务还是应该放在Controller中实现.也就是说MVVM实现的是业务逻辑组件的重用

3.MVC和MVVM区别?

其实mvc和mvvm的区别并不大.都是一种设计思想.主要就是mvc中的Controller演变成了mvvm中的ViewModel.

mvvm主要解决了mvc中大量的dom操作,使页面渲染性能降低,加载速度变慢,影响用户体验