外观模式笔记
   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. Eclipse导入Java项目时“No projects are found to import”错误的处理

    用Eclipse导入Java项目时,经常会出现“No projects are found to import”错误(尤其是导入网上下载的项目时),这是因为文件夹里面没有.project和.class ...

  2. Scalaz(15)- Monad:依赖注入-Reader besides Cake

    我们可以用Monad Reader来实现依赖注入(dependency injection DI or IOC)功能.Scala界中比较常用的不附加任何Framework的依赖注入方式可以说是Cake ...

  3. php中的字符串常用函数(五) explode 妙用

    // 示例 2 $data = "foo:*:1023:1000::/home/foo:/bin/sh" ; list( $user , $pass , $uid , $gid , ...

  4. hash简单介绍

    hash也称"散列", 是一种基于映射关系的存储方式,将任意长度的二进制值输出为固定长度的较小的二进制值,这种输出的小的固定长度的值为hash值: 1. 散列技术是在关键字key与 ...

  5. PHP内核探索之变量(6)- 后续内核探索系列大纲备忘

    年前因为工作比较饱和,现在又忙着换工作的事情,基本停止了对博文的更新.后续的博文,还是慢慢补上吧. 为了不至于过于发散,先搞个未成形的大纲,如下: PHP内核探索之变量  不平凡的字符串 PHP内核探 ...

  6. Bug管理工具之Mantis_配置篇

    角色管理员.经理.开发人员.修改人员.报告人员.查看人员,权限从大到小递减.分配: My View Settings 'assigned' => '1', 'unassigned' => ...

  7. 七个结构模式之享元模式(Flyweight Pattern)

    定义: 运用共享技术对大量细粒度对象的复用,这要求这些对象都很相似,状态变化很小.将这些对象的内部状态和外部状态进行区分,对于内部状态相同的只存储一个对象,而对不同的外部状态则采用不同的操作. 结构图 ...

  8. HTML学习总结

    首先,我们要问,什么是html?官方的解释是:超文本标记语言.什么意思呢?简单的来说,就是一种用来制作网页的特殊语言.那么,什么是网页呢?我们说,网页是一个在浏览器窗口下显示的页面,实质上是一个文档. ...

  9. Gogs - 基于 Go 语言的自助 Git 服务

    Gogs(Go Git Service) 是一个基于 Go 语言的自助 Git 服务.Gogs 的目标是打造一个最简单.最快速和最轻松的方式搭建自助 Git 服务.使用 Go 语言开发使得 Gogs ...

  10. ThinkPHP3.2 G函数代码及 使用方法

    ThinkPHP3.2 G函数代码及 使用方法 代码: // 内存是否可调用 define('MEMORY_LIMIT_ON',function_exists('memory_get_usage')) ...