JS设计模式之外观模式

原创 2016年05月31日 11:38:27

介绍

外观模式(Facade)为子系统中的一组接口提供了一个一致的对外接口(即为封装),这个高层接口使得这一子系统更加容易使用。

正文

外观模式不仅简化类中的接口,而且对接口与调用者也进行了解耦。外观模式经常被认为开发者必备,它可以将一些复杂操作封装起来,并创建一个简单的接口用于调用。

外观模式经常被用于JavaScript类库里,通过它封装一些接口用于兼容多浏览器,外观模式可以让我们间接调用子系统,从而避免因直接访问子系统而产生不必要的错误。

外观模式的优势是易于使用,而且本身也比较轻量级。但也有缺点 外观模式被开发者连续使用时会产生一定的性能问题,因为在每次调用时都要检测功能的可用性。

外观模式很简单,还是代码中学习,下面我们使用了外观模式通过检测浏览器特性的方式来创建一个跨浏览器的使用方法。

var addMyEvent = function (el, ev, fn) {
    if (el.addEventListener) {
        el.addEventListener(ev, fn, false);
    } else if (el.attachEvent) {
        el.attachEvent('on' + ev, fn);
    } else {
        el['on' + ev] = fn;
    }
}; 

总结

那么何时使用外观模式呢?一般来说会在三个阶段中使用:

首先,在设计初期,应该要有意识地将不同的两个层分离,比如经典的三层结构,在数据访问层和业务逻辑层、业务逻辑层和表示层之间建立外观Facade。

其次,在开发阶段,子系统往往因为不断的重构演化而变得越来越复杂,增加外观Facade可以提供一个简单的接口,减少他们之间的依赖。

第三,在维护一个遗留的大型系统时,可能这个系统已经很难维护了,这时候使用外观Facade也是非常合适的,为系系统开发一个外观Facade类,为设计粗糙和高度复杂的遗留代码提供比较清晰的接口,让新系统和Facade对象交互,Facade与遗留代码交互所有的复杂工作。

版权声明:本文为博主原创文章,未经博主允许不得转载。

JavaScript设计模式(二)适配器、装饰者和工厂模式

作者 Joseph Zimmerman http://www.joezimjs.com 创建日期 15 May 2012 您已经来到 JavaScript 设计模式系列的第 2...
  • buptlyz
  • buptlyz
  • 2016年07月25日 00:28
  • 126

【设计模式之三:模式对比】外观模式、代理模式与中介者模式的区别

外观模式 个人理解:         子类继承外观类的所有属性方法,客户端只需要跟外观类进行交流,实现了对所有子类的封装。 没有使用外观类 如图:         应用外观类 ...
  • cangchen
  • cangchen
  • 2015年04月08日 23:05
  • 2674

装饰者模式与外观者模式的区别

(转载)http://bbs.bccn.net/thread-216717-1-1.html 很久没有来这一个论坛里了,一上来就看到很多关于设计模式的贴子上了精,今天我也来谈一下设计模式,我现在所介绍...
  • zhuhai__yizhi
  • zhuhai__yizhi
  • 2016年03月03日 09:55
  • 1091

外观模式(注意区别于中介者模式)

一.外观模式(有点像中介者模式) 通过一个外观类使得整个系统的接口只有一个统一的高层接口,这样就能降低用户的使用成本,也就对用户屏蔽了很多实现细节,当然在我们的开发过程中,外观模式也是我们封装API的...
  • u011889786
  • u011889786
  • 2016年06月05日 21:24
  • 1593

JAVA设计模式之门面模式(外观模式)

医院的例子   现代的软件系统都是比较复杂的,设计师处理复杂系统的一个常见方法便是将其“分而治之”,把一个系统划分为几个较小的子系统。如果把医院作为一个子系统,按照部门职能,这个系统可以划分为挂号、门...
  • jason0539
  • jason0539
  • 2014年04月02日 07:16
  • 25273

java/android 设计模式学习笔记(14)---外观模式

这篇博客来介绍外观模式(Facade Pattern),外观模式也称为门面模式,它在开发过程中运用频率非常高,尤其是在现阶段各种第三方 SDK 基本很大概率都会使用外观模式。通过一个外观类使得整个系统...
  • zhao_zepeng
  • zhao_zepeng
  • 2016年07月17日 18:14
  • 3412

设计模式(八)外观模式

当我们开发Android的时候,无论是做SDK还是封装API,我们大多都会用到外观模式,它通过一个外观类使得整个系统的结构只有一个统一的高层接口,这样能降低用户的使用成本。...
  • itachi85
  • itachi85
  • 2016年07月25日 10:26
  • 11799

装饰模式 VS. 外观模式

一、装饰模式         小菜想要和MM约会需要给自己扮靓,而新入住房子之前也需要对每个房间装修一遍,这些事情都有一个共同的特点,就是一个词“装饰”,我们可以把装饰模式应用在这些事情上面。 ...
  • xdd19910505
  • xdd19910505
  • 2014年04月06日 16:44
  • 1898

装饰模式、装饰器模式、代理模式、外观模式区别

装饰器模式关注于在一个对象上动态的添加方法,然而代理模式关注于控制对对象的访问。 用代理模式,代理类可以对它的客户隐藏一个对象的具体信息。因此,当使用代理模式的时候,我们常常在一个代理类中创建一个对象...
  • zhang31jian
  • zhang31jian
  • 2016年01月18日 17:21
  • 2315

装饰者、适配器和外观模式详解

设计模式中,装饰者、适配器和外观模式这三种模式运用的比较多,但三者有一定的相似性,所以比较不好区分,今天我就来详细谈谈这三个模式。 1、装饰者模式      《设计模式》上的定义为:动态地将责任附加到...
  • monkey_D_feilong
  • monkey_D_feilong
  • 2016年07月21日 21:16
  • 334
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:JS设计模式之外观模式
举报原因:
原因补充:

(最多只允许输入30个字)