JavaScript Patterns 4.7 Init-Time Branching
When you know that a certain condition will not change throughout the life of the program, it makes sense to test the condition only once. Browser sniffing (or feature detection) is a typical example.
// BEFORE
var utils = {
addListener : function(el, type, fn) {
if ( typeof window.addEventListener === 'function') {
el.addEventListener(type, fn, false);
} else if ( typeof document.attachEvent === 'function') {// IE
el.attachEvent('on' + type, fn);
} else {// older browsers
el['on' + type] = fn;
}
},
removeListener : function(el, type, fn) {
// pretty much the same...
}
};
// AFTER
// the interface
var utils = {
addListener : null,
removeListener : null
};
// the implementation
if ( typeof window.addEventListener === 'function') {
utils.addListener = function(el, type, fn) {
el.addEventListener(type, fn, false);
};
utils.removeListener = function(el, type, fn) {
el.removeEventListener(type, fn, false);
};
} else if ( typeof document.attachEvent === 'function') {// IE
utils.addListener = function(el, type, fn) {
el.attachEvent('on' + type, fn);
};
utils.removeListener = function(el, type, fn) {
el.detachEvent('on' + type, fn);
};
} else {// older browsers
utils.addListener = function(el, type, fn) {
el['on' + type] = fn;
};
utils.removeListener = function(el, type, fn) {
el['on' + type] = null;
};
}
References:
JavaScript Patterns - by Stoyan Stefanov (O`Reilly)
JavaScript Patterns 4.7 Init-Time Branching的更多相关文章
- JavaScript Patterns 5.4 Module Pattern
MYAPP.namespace('MYAPP.utilities.array'); MYAPP.utilities.array = (function () { // dependencies var ...
- JavaScript Patterns 7.1 Singleton
7.1 Singleton The idea of the singleton pattern is to have only one instance of a specific class. Th ...
- JavaScript Patterns 6.7 Borrowing Methods
Scenario You want to use just the methods you like, without inheriting all the other methods that yo ...
- JavaScript Patterns 6.6 Mix-ins
Loop through arguments and copy every property of every object passed to the function. And the resul ...
- JavaScript Patterns 6.5 Inheritance by Copying Properties
Shallow copy pattern function extend(parent, child) { var i; child = child || {}; for (i in parent) ...
- JavaScript Patterns 6.4 Prototypal Inheritance
No classes involved; Objects inherit from other objects. Use an empty temporary constructor function ...
- JavaScript Patterns 6.3 Klass
Commonalities • There’s a convention on how to name a method, which is to be considered the construc ...
- JavaScript Patterns 6.2 Expected Outcome When Using Classical Inheritance
// the parent constructor function Parent(name) { this.name = name || 'Adam'; } // adding functional ...
- JavaScript Patterns 6.1 Classical Versus Modern Inheritance Patterns
In Java you could do something like: Person adam = new Person(); In JavaScript you would do: var ada ...
随机推荐
- ASP.NET 让无码编程不在是梦 -.NET通用平台、通用权限、易扩展、多语言、多平台架构框架
先拿出我半前年前平台的设计初稿,经过半年的努力我已经完成了该设计稿的所有功能.并且理念已经远远超出该设计稿. 下面是一些博友对我贴子的评价: 1.楼主,想法很美好,现实很骨感,我们公司就有一套你说的这 ...
- UWP开发入门（十五）——在FlipView中通过手势操作图片
本篇的最终目的,是模拟系统的照片APP可以左右滑动,缩放图片的操作.在实现的过程中,我们会逐步分析UWP编写UI的一些思路和技巧. 首先我们先实现一个横向的可以浏览图片的功能,也是大部分APP中的实现 ...
- sublime 插件zen coding
sublime的插件Zen Coding是一个编写html的神器,现在已经更名为Emmet了. 在sublime中的package需要搜索的是Emmet 相关网站: 官网 Zen Coding: 一种 ...
- AutoTransformHandler
public static ObservableCollection<F> Transform<T, F>(List<T> target) where F : ne ...
- "数学口袋精灵"bug（团队）
团队名:MY-HR 成员: 学号 博客园 团队贡献分 丘惠敏(组长) 201406114203 http://www.cnblogs.com/qiuhuimin/ 5 郭明茵 201406114204 ...
- DecimalFormat 中的 # 与 0 的区别（中文帮助文档中翻译可能是错误的）
想对数字进行格式化的时候,可能会使用到 java.text.DecimalFormat 类.中文帮助文档中,有如下符号 位置 本地化 含义 0 数字 是 阿拉伯数字 # 数字 是 阿拉伯数字,如果不存 ...
- Struts 2常用的Ajax标签
Struts 2对Ajax的支持 •Struts 2对Ajax提供了很好的支持 –Struts 2.1提供了基于Dojo的Ajax标签,对Ajax操作进行了进步封装,可以更快捷容易的使用Ajax ...
- 2016校招内推 -- 腾讯SNG前端 -- 面试经历
也是让某湿兄帮忙内推,然后过了四五天,电话打来了 一面: 1.首先是简单的自我介绍 2.你觉得一个前端工程师应该具备什么技能 比如用户体验这个方面他就贵问你具体的例子 3.让你设计一个web站点,假如 ...
- C#创建服务及使用程序自动安装服务，.NET创建一个即是可执行程序又是Windows服务的exe
不得不说,.NET中安装服务很麻烦,即要创建Service,又要创建ServiceInstall,最后还要弄一堆命令来安装和卸载. 今天给大家提供一种方式,直接使用我们的程序来安装/卸载服务,并且可以 ...
- 【Bootstrap基础学习】03 Bootstrap插件示例
模态框 <h2>创建模态框(Modal)</h2> <!-- 按钮触发模态框 --> <button class="btn btn-primary ...