0.前言

早上好,今天天气不错,估计有35度吧,坐在空调室里相当惬意,那么酒足饭饱之后就应该干些正事了。

1. 为什么使用外观模式

外观模式提供了一个高层接口,封装一些复杂操作或繁琐行为,方便调用。门面模式第一可以简化类的接口,第二可以消除类与使用它的客户代码之间的耦合。其实就是为了图方便,在很多js库中都使用了该模式,主要用于兼容多浏览器。

2. 具体说明

var addEvent = function(ele,type,fn){

    if(window.addEventListener){
ele.addEventListener(type,fn,false);
}else if(window.attachEvent){
ele.attachEvent('on'+type,fn);
}else{
ele['on'+type] = fn;
} }

这就是一个常见的时间监听函数,这个函数就是一个基本的门面,使用该函数就可以方面为DOM节点添加事件处理函数。

3.个人理解

3.1 门面模式(外观模式)就是提供一个高层接口,封装一些复杂或繁琐行为,方便对这些代码的调用;

3.2 很多js库用到了该模式,在多浏览器兼容方面非常有用;

3.3 这个模式其实就是为了图方面,是一种组织性的模式。

js设计模式(5)---外观模式的更多相关文章

  1. js设计模式——2.外观模式

    js设计模式——2.外观模式

  2. JS 设计模式七 -- 外观模式

    概念 为子系统中的一组接口提供一个一致的界面,定义一个高层接口,这个接口使子系统更加容易使用. 外观模式在JS中,可以认为是一组函数的集合. 实现 // 三个处理函数 function start() ...

  3. 每天一个设计模式-2 外观模式(Facade)

    每天一个设计模式-2  外观模式(Facade) 1.生活中的示例 客户想要购买一台电脑,一般有两种方法: 1.自己DIY,客户需要知道组成电脑的所有电子器件,并且需要熟悉那些配件,对客户要求较高. ...

  4. C#设计模式(11)——外观模式(Facade Pattern)

    一.引言 在软件开发过程中,客户端程序经常会与复杂系统的内部子系统进行耦合,从而导致客户端程序随着子系统的变化而变化,然而为了将复杂系统的内部子系统与客户端之间的依赖解耦,从而就有了外观模式,也称作 ...

  5. JS设计模式——5.单体模式

    JS设计模式——5.单体模式 http://www.cnblogs.com/JChen666/p/3610585.html   单体模式的优势 用了这么久的单体模式,竟全然不知!用它具体有哪些好处呢? ...

  6. 乐在其中设计模式(C#) - 外观模式(Facade Pattern)

    原文:乐在其中设计模式(C#) - 外观模式(Facade Pattern) [索引页][源码下载] 乐在其中设计模式(C#) - 外观模式(Facade Pattern) 作者:webabcd 介绍 ...

  7. 设计模式之 外观模式详解(Service第三者插足,让action与dao分手)

    作者:zuoxiaolong8810(左潇龙),转载请注明出处,特别说明:本博文来自博主原博客,为保证新博客中博文的完整性,特复制到此留存,如需转载请注明新博客地址即可. 各位好,LZ今天给各位分享一 ...

  8. 8.4 GOF设计模式三: 外观模式 Facade

    GOF设计模式三: 外观模式 Facade  “现有系统”功能强大.复杂,开发“新系统”需要用到其中一部分,但又要增加一部 分新功能,该怎么办?4.1 Facade Pattern: Key Fea ...

  9. 北风设计模式课程---外观模式(Facade)总结

    北风设计模式课程---外观模式(Facade)总结 一.总结 一句话总结: 不仅要通过视频学,还要看别的博客里面的介绍,搜讲解,搜作用,搜实例 设计模式都是对生活的抽象,比如用户获得装备,我可以先装备 ...

  10. js设计模式——7.备忘录模式

    js设计模式——7.备忘录模式 /*js设计模式——备忘录模式*/ // 备忘类 class Memento { constructor(content) { this.content = conte ...

随机推荐

  1. Apple Tree(需要预处理的树状数组)

    Apple Tree Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 20335   Accepted: 6182 Descr ...

  2. 每天一道面试题(2):实现strncpy

    目录 0. 为何要写strncpy? 1. 源码及测试结果 2. 面试注意事项 3. 小结

  3. vs2010 MFC Opengl实现

    有的人说,学习要按部就班,学了几年的编程稍有点感悟,个人觉得面对技术的不断变化,以及需求的不断变更,如果按部就班的来搞,人生0.5的时间就浪费了,很多时候问自己,why I do need to le ...

  4. Linux常用命令之seq

    标题:seq命令的使用 作用:seq命令用于以指定增量从首数开始打印数字到尾数,即产生从某个数到另外一个数之间的所有整数,并且可以对整数的格式.宽度.分割符号进行控制 语法: [1] seq [选项] ...

  5. POJ 1308 Is It A Tree? (并查集)

    Is It A Tree? Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 24237   Accepted: 8311 De ...

  6. jQuery图片提示和文字提示

    图片提示: 效果如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:/ ...

  7. 转: ios app架构设计

    http://keeganlee.me/post/architecture/20160107 看完这一系列文章后就知道怎么回答这类问题了: App架构设计经验谈:接口的设计 App架构设计经验谈:技术 ...

  8. 【PHP基础】常用mySQL语句以及WampServer2.2设置数据库默认编码

    一.WampServer2.2设置数据库默认编码(此部分转自http://www.cnsecer.com/5984.html) wamp下MySQL的默认编码是Latin1,不支持中文,要支持中文的话 ...

  9. Ext js中CheckBoxGroup的动态绑定

    <script type="text/jscript"> var WinXianCode; function SearchGetXianLuF(Type) { if(! ...

  10. asp动态生成google的sitemap地图的代码

    本来使用那些网站生成google网站地图,时间久了,感觉太麻烦了:先打开他们的网站,输入我的网址,然后点击生成,等待一段时间后,下载生成后的文件,再将它通过ftp上传到空间上了.实在太麻烦了,还不如自 ...