外观模式笔记
   1. 为一组复杂的子系统接口提供一个更高级的统一接口, 通过这个接口使得对子系统接口的访问更容易;

2. 简化底层接口的复杂性,解决浏览器兼容性问题。

3.也会用于对底层结构兼容性做统一封装来简化用户使用

以事件方法作为demo实例

添加元素事件有三种:addEventListener,attachEvent,DOM0级事件如onclick

DOM0级事件有被覆盖的风险,应使用DOM2级事件处理程序提供的方法addEventListener来实现,但IE(低于9)不支持,其次考虑使用attachEvent,最后DOM0级事件

            function addEvent(dom,type,fn){
//对于支持dom2级事件处理程序 addEventListener方法的浏览器
if(dom.addEventListener){
dom.addEventListener(type,fn,false);
//对于不支持addEventListener方法但支持attachEvent方法的浏览器
}else if(dom.attachEvent){
dom.attachEvent('on'+type,fn);
//不支持attachEvent方法的浏览器
}else{
dom['on'+type] = fn;
}
}

javascript-外观模式的更多相关文章

  1. javascript设计模式-外观模式

    也可译为门面模式.它为子系统中的一组接口提供一个一致的界面, Facade模式定义了一个高层接口,这个接口使得这一子系统更加容易使用.引入外观角色之后,使用者只需要直接与外观角色交互,使用者与子系统之 ...

  2. 再起航,我的学习笔记之JavaScript设计模式11(外观模式)

    经过一段时间的学习与分享,我们对创建型设计模式已经有了一定的认识,未来的一段时间里我们将展开新的篇章,开始迈入结构性设计模式的学习. 结构性设计模式与创建型设计模式不同,结构性设计模式更偏向于关注如何 ...

  3. 深入理解JavaScript系列(30):设计模式之外观模式

    介绍 外观模式(Facade)为子系统中的一组接口提供了一个一致的界面,此模块定义了一个高层接口,这个接口值得这一子系统更加容易使用. 正文 外观模式不仅简化类中的接口,而且对接口与调用者也进行了解耦 ...

  4. javascript 设计模式-----外观模式

    外观模式是为外部提供简单的接口一种方式,由于模块内部方法庞杂,不能一一对外公开,那么我们需要一个统一的和简单的对外方法(API)来调用这些内在的函数.这时候我们可以用到外观模式: var module ...

  5. [设计模式] Javascript 之 外观模式

    外观模式说明 说明:外观模式是用于由于子系统或程序组成较复杂而提供的一个高层界面接口,使用客户端更容易访问底层的程序或系统接口; 外观模式是我们经常使用遇到的模式,我们经常涉及到的功能,可能需要涉及到 ...

  6. javascript设计模式之外观模式

    /* * 外观模式 * 外观模式的主要意义在于简化类的接口,使其易于调用 */ // 你常常在不经意中使用了外观模式,尤其类库中更多(处理兼容性问题) var addEvent = function ...

  7. javascript设计模式(张容铭)学习笔记 - 外观模式绑定事件

    有一个需求要为document对象绑定click事件来是想隐藏提示框的交互功能,于是小白写了如下代码: document.onclick = function(e) { e.preventDefaul ...

  8. js原生设计模式——9外观模式封装

    1.事件处理程序兼容性封装 <!DOCTYPE html><html lang="en"><head>    <meta charset= ...

  9. 设计模式(八): 从“小弟”中来类比"外观模式"(Facade Pattern)

    在此先容我拿“小弟”这个词来扯一下淡.什么是小弟呢,所谓小弟就是可以帮你做一些琐碎的事情,在此我们就拿“小弟”来类比“外观模式”.在上面一篇博文我们完整的介绍了“适配器模式”,接下来我们将要在这篇博客 ...

  10. 设计模式(十一)外观模式(Facade Pattern)

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

随机推荐

  1. 【C#】第3章学习要点(一)--整体把握

    分类:C#.VS2015 创建日期:2016-06-18 使用教材:(十二五国家级规划教材)<C#程序设计及应用教程>(第3版) 一.使用别人已经设计好的类简化你的代码编写工作量 当让你去 ...

  2. 【Java每日一题】20161102

    package Nov2016; public class Ques1102 implements Parent{ @Override public void method() { } } inter ...

  3. 禅道PMS兼容redmine用户认证接口

    项目地址:https://github.com/web3d/zentao-redmine-userauth zentao-redmine-userauth 做了一个基本的用户认证接口,兼容redmin ...

  4. sso demo 取消https (cas)

    基本配置 参考之前得随笔  http://www.cnblogs.com/rocky-fang/p/5354947.html 1. 修改tomcat-cas 配置 1.1 在 D:\test\sso\ ...

  5. Genymotion无法下载OVA文件

    百度 下载Genymotion离线OVA文件(http://pan.baidu.com/s/1jIe5pjC ) 将OVA离线文件放到这个目录下:C:\Users\Administrator\AppD ...

  6. ubuntu 下安装redis 以及php扩展

      下载redis wget http://download.redis.io/redis-stable.tar.gz   tar xzf redis-stable.tar.gz cd redis-s ...

  7. easyui datagrid 点击表头的事件

    在用datagrid的时候我们可能要用到点击表头来触发一个function,这里有个简单的例子. 首先你得有个能用的datagrid. <div>    <table id=&quo ...

  8. ArcGIS Server 开发实践之【Search类】

    开发中整理的.不足之处还请谅解! ----------------------------------------------- Class:Search 调用方式:require(["es ...

  9. ENVI软件操作之【数据的显示操作】

    数据的显示操作主要包括以下的一些简单窗口操作 1.文件列表管理 1)可用的波段列表Available Bands List,使用于存取ENVI图像文件和显示图像文件的主要控制对话框.无论何时何地打开一 ...

  10. 如何在没有安装微软Excel环境下操作Excel文件?

    在以前接触的项目中,由于很多客户对微软Excel的操作比较熟练,客户经常要求系统支持对Excel文件的读写.用.NET传统方法对Excel进行读写时,往往会涉及到不同版本兼容的问题,导致在本地测试一切 ...