精通JavaScript--08设计模式:架构型

我们在前面3章节学习过的一些创建型,结构型和行为型设计模式可以组合在一起,成为架构型设计模式。

8.1  MVC模式

MVC(Model-View-Controller,模型-视图-控制器)模式可以把JavaScript应用程序的代码划分为3个独立的部分:模型(Model),负责把代码中的与底层数据构成相关的代码组合在一起,包括对数组对存储和读取;视图(View),负责将那些用于把模型中所保存的数据显示在屏幕上的代码组合一起,本质上就是对各DOM元素进行处理;控制器(Controller),负责处理系统中的业务逻辑,并在需要时更新模型和视图,它使得模型和视图不需要在彼此之间直接沟通,实现了它们之间的松解耦连接。关注点分离(Spearation Of Concerns,SOC)会使得代码更易于理解和处理,更易于测试,并可使工作于相同项目的多位开发者根据应用程序的模型,视图,控制器3个层次进行任务划分。

MVC架构模式实际上是将我们在第6章和第7章所学过的3种特定设计模式结合到一起使用,即观察者模式,组合模式和策略模式。当模型中的数据发生改变时,就会运用观察者模式来触发事件,传出更新后的数据,以供系统中的其他部分使用。同样,视图也会使用相同的观察模式来监听模型中数据的变化,并使用更新后的数据来更新用户界面。视图只能从模型直接读取数据,并不能修改数据,那是控制器的职责。视图还能包含子视图,用作处理较大型UI的可重用的部分。可运用组合模式,这样确保控制器就不需要清楚其逻辑所需影响的视图数量了。最后,控制器将使用策略模式来应用一个特定的视图至它本身,使得较大型系统中的多个视图可以共享相同的控制器逻辑,前提是这些视图都暴露一个相似的方法。我选择把此方法命名为render()。该方法接收来自于模型的数据,并将视图放置在当前页面,把视图与系统的其余部分广播发布的事件进行绑定设置,以使视图准备就绪。值得注意的是,在JavaScript应用程序中,模型通常时通过Ajax连接至一个作为数据库(用于保存系统所表示的数据)的后台服务器的。

代码清单8-1展示了我们时如何创建一个“类”来处理一个采用MVC模式的简单系统中的模型数据的表示的,此系统用于屏幕上email地址列表的管理。

代码清单8-1  模型

时间: 2024-10-12 21:43:01

精通JavaScript--08设计模式:架构型的相关文章

怎样才算精通javascript

任何一门编程语言都是人去创造的,不管是javascript还是php或者是c 那么,到底什么是精通javascript,什么又是精通php呢? 试问,我理解了js里面对象的概念,理解了各种逻辑运算符,我精通么? 显然,另外的同学会说,不,你还要学习面向对象或者函数式编程,你要试图用js去模拟一个类,然后让它具备重载以及多态等等特性.好了,我都学会了,精通了么? 其它同学说,不不不,你需要让你的js写的更高效,还要考虑各种浏览器下对某些方法的支持与否,我们要保证这个js具备较好的兼容性.好了,你又

设计模式——结构型模式

设计模式的另一大类型为结构型.共收录了7个模式,分别为适配器模式.桥接模式.组合模式.装饰模式.外观模式.享元模式.代理模式.下面从特点和使用两方面小探,欢迎交流!      适配器模式(Adapter):将一个类的接口转换成客户希望的另外一个接口.Adapter模式使得原本由于接口不兼容而不能一起工作的那些类可以一起工作.[大话设计模式]        特点:需要交流的两方,在数据和行为都匹配,但接口不符时,我们应该考虑用适配器,目的是促使交流和复用.可以理解为入乡随俗,相同的意思,不同的表达

设计模式(结构型)之外观模式(Facade Pattern)

PS一句:最终还是选择CSDN来整理发表这几年的知识点,该文章平行迁移到CSDN.因为CSDN也支持MarkDown语法了,牛逼啊! [工匠若水 http://blog.csdn.net/yanbober] 阅读前一篇<设计模式(结构型)之装饰者模式(Decorator Pattern)>http://blog.csdn.net/yanbober/article/details/45395747 概述 一个客户类需要和多个业务类交互,而这些业务类经常会作为整体出现,由于涉及到的类比较多,导致使

&lt;精通JavaScript&gt;---阅读笔记01

下面是阅读精通JavaScript书做的相关笔记. JS中的函数重载 函数重载必须依赖两件事情:判断传入参数数量的能力和判断传入参数类型的能力,在js中每个函数都带有一个仅在这个函数范围内作用的变量,称之为参数argument,它是一个包含所有传给函数参数的伪数组,所以并不是正的数组,但是我们不可以去修改它.其实这个就相当于一个池,将参数全部都保存在里面,之后在用的时候去取,只是这个池我们看不见.是语言自己去找. JS中2种常见的类型检查 :typeof()操作符 typeof n==”stri

设计模式(结构型)之代理模式(Proxy Pattern)

PS一句:最终还是选择CSDN来整理发表这几年的知识点,该文章平行迁移到CSDN.因为CSDN也支持MarkDown语法了,牛逼啊! [工匠若水 http://blog.csdn.net/yanbober] 阅读前一篇<设计模式(结构型)之享元模式(Flyweight Pattern)>http://blog.csdn.net/yanbober/article/details/45477551 概述 代理模式是常用的结构型设计模式之一,当无法直接访问某个对象或访问某个对象存在困难时可以通过一个

《精通JavaScript》读后感

<精通JavaScript>这本书是jQuery的作者John Resig写的,很遗憾,这么晚了才拜读这么一本好书. 现在的jQuery在开发中已经不常使用了,出现了后起之秀,各种MV*框架,到现在我也没有开始学习,所以我不能对比.昨天在微信公众号上面看到一篇关于<jQuery是否还有未来和应用场景>之中的文章,几位国外的大佬就此讨论了一下.想法大概是jQuery太重了,直接操作DOM也会显得有些笨拙和无法完成目前的分离式操作.估计是没有太多的应用场景了,我的想法大概是,在未来,我

《精通javascript》几个简单的函数

精通JavaScript(图灵计算机科学丛书) ,让你大开眼界的 JavaScript 力作,跟随 jQuery 之父到达前所未有的深度,Amazon 五星盛誉图书. 本书是目前最深入的JavaScript图书,讲述了现代JavaScript的所有知识,展现了这门技术将能给网站建设带来如何丰富的体验.本书言简意赅,扩展了读者视野,并关注于基础且重要的主题–现代JavaScript是什么和不是什么,浏览器支持的当前状态,以及需要注意的陷阱等. 书中所有概念都来自于现实案例的分析.前端UI分享 书没

设计模式(结构型)之装饰者模式(Decorator Pattern)

PS一句:最终还是选择CSDN来整理发表这几年的知识点,该文章平行迁移到CSDN.因为CSDN也支持MarkDown语法了,牛逼啊! [工匠若水 http://blog.csdn.net/yanbober] 阅读前一篇<设计模式(结构型)之组合模式(Composite Pattern)>http://blog.csdn.net/yanbober/article/details/45392513 概述 装饰模式可以在不改变一个对象本身功能的基础上给对象增加额外的新行为.装饰模式是一种用于替代继承

【00】架构型

1.架构型(archetype) 一种形式,所有的东西或多或少地遵守.一种形式,属于同一类型的类都或多或少地遵守,包括属性.链接.方法.插入点.交互. 2.领域无关的4种架构型 (1)时刻时段架构型(moment-interval):粉红色 这件事情是在某个时刻或某一时间段内发生的. 例如,销售是在一个时刻完成:租赁是在一个时间段发生. (2)角色架构型(role):黄色 角色:一种参与的方式,它由人.地点或物品来承担. 参与方.人和组织机构扮演角色是很常见的. (3)描述架构型:蓝色 一组反复