AngularJS前端MV*框架之经典MVC

一、学习背景

出于店铺事务稳步庞大,很多老品种需要保险,由于这一个品种的前端基本都是jQuery+jQuery
plugins搞定的,编写的代码可谓是:无协会、无纪律,导致前者维护资金越来越高,为了缓解这一难题,决定引入前端MV*框架。从浏览器包容性、与其他零件方便集成的角度考虑,最后摘取了backbone.js。因为事先接触过AngularJS,backbone.js我只看了一天文档,就能支付实际项目了;可是有个难题间接无时或忘,由于backbone.js没有明确提议自己的架构方式,所以它不属于MVC、MVP、MVVM中的任何一种,而是在乎它们之间的某部变种,这点让自身无比郁闷,因为那导致我不可以精确的团队JavaScript代码。而这一标题标根本原因是本身对MV*架构格局的敞亮不够深远,所以我控制:先将MVC、MVP、MVVM的定义与不一样驾驭透彻,再回过头来审视backbone.js。

MVC是一种架构情势,说白了就是一种集体代码的方法,将代码按照职分分开成三块区域,那样的裨益很肯定:易于阅读、便于维护。回顾一下从未有过引入MV*框架前的那一坨JavaScript代码,我信任一大半人都会表示:我碰都不想碰了。即便你引入了模块加载框架(requirejs、seajs等),你的代码仍旧是“凌乱”的,只然则范围减少到模块内部而已,前端MV*框架就是为着化解那么些标题应运而生的。

二、经典MVC

2.1 MVC诞生

20世纪80年份,mvc作为smalltalk-80(神话中的“面向对象编程之母”)的一个类库走进人们的视野。那多少个年代浏览器还没现身,计算机的图形用户界面(GUI)还一对一的简陋。为了将UI组件代码从业务逻辑代码中脱离出来,人们尝试对应用程序进行分层,发生了初期的MVC形式。当今的MVC(本文称为MVC的变种)已经与经典MVC黯淡无光,由于经典MVC的一些特征并不合乎方今的富客户端应用(前边会有表明),所以从某种意义上的话,经典MVC已经消失了,本文的叙说针对的是经典MVC。

2.2 经典MVC的干活流程

经文MVC根据职务将代码划分为三个区域:Model(模型)、View(视图)、Controller(控制器)。不考虑破例意况,一大半的干活流程是那般的:

AngularJS 1

“经典MVC”

第一从M、V、C各自的职分说起:

  • Model:代表工作逻辑层,它无所谓表现层的存在,只注意处总管情。
  • Controller:接受用户的输入,将输入转为相应的下令,执行越发的操作。
  • View:向用户彰显体现的新闻,与M建立观望者情势,依照M的更动机关重新渲染。

第一要求说的是,不要以浏览器的角度了解那一个流程,因为这些时期浏览器还未出现。一个全体的MVC的劳作流程是如此的:

  1. 率先C接受用户的刺激。
  2. (流程①)C将那种刺激转化为某种命令去调用M的接口,对M执行更新操作。
  3. (流程②)M发送状态改变的打招呼给V(由寓目者形式形成)。
  4. (流程③)V调用M的接口获取最新数据,重新渲染V(由观看者方式形成)。

从调用流程大家发现经典MVC有以下多少个特性:

  1. C与V共同整合一个突显层,即一个UI组件,两者是无能为力独立存在的,所以没有精神上的分手,那点与现行的MVC变种有很大分别。
  2. C与V没有直接的调用关系,各自处理自己的政工。
  3. 引入观察者情势完结多少绑定,C没有直接更新V,而是去更新M,然后经过观望者模式对V举办更新。由于一个M得以对应多个UI组件,当某个特定的C更新M时,会唤起连锁的多少个V同时更新,那对于开发复杂的用户界面分外便利。
  4. 中标将“表现层(C+V)”从“业务逻辑层(M)”剥离出来。

2.2 经典MVC的缺陷

2.2.1 观看者形式的短处

观察者格局在给开发者带来有利的同时,也牵动了一个标题,那就是:很难通过跟踪代码来获知程序的流程走向,那平昔促成了程序复杂度的增高,所以过多的应用观看者情势会使程序变的不易了解。

2.2.2 特殊表现层逻辑的难堪地点

AngularJS,时刻用户对图形界面的要求越来越高,GUI变得进一步复杂,表现层的逻辑已经不仅仅是将M的多少直接显示到显示器上那么不难。大家须求对M的多寡开展进一步的加工处理后才能显现给用户。经典MVC的一代,图形用户界面是极度不难的,所以MVC能满意半数以上光景的急需,即便有那么一小部分特其余突显层逻辑(M数据的加工处理),也被放到M里进行拍卖了,就算污染了M的纯度,可是影响并不大。不过对于当代的富客户端应用来说,那种“特殊表现层逻辑”是极度庞大的,即使都塞进M里,那显然是不可以承受的。

2.2.3 smalltalk的对策

基于smalltalk-80
MVC的开发者也发觉到了MVC的短板,他们采用的政策是对V举行举办,将V拓展为一个全新的靶子,它既涵盖V的全体内容(包罗替代V,与M建立阅览者情势),又含有对M数据开展加工处理的逻辑代码,他们把那种全新的对象叫作:Presentation
Model。而那总体的更动都是为着更彻底的将“表现层”与“业务逻辑层”分离。

三、总结

经典MVC总起来说有三个关键点:分离表现层、通过观望者情势举办多少同步。尽管MVC已经不可以满意当代富客户端应用的需求,可是它的多个关键点却被传承了下来,影响了一一日千里的MVC变种,比如MVP、MVVM等,而这一个MVC变种也正是为了满足富客户端的须求进化而来,下篇小说介绍MVP与MVVM。

参考文献

<a
href=”https://en.m.wikipedia.org/wiki/Model–view–controller"&gt;wikipedia
Model-view-controller</a>
<a
href=”http://martinfowler.com/eaaDev/uiArchs.html\#ModelViewController"&gt;Martin
Fowler GUI Architectures</a>
<a href=”http://c2.com/cgi/wiki?ModelViewControllerHistory"&gt;Model
View Controller History</a>

相关文章