单体模式的优势

用了这么久的单体模式,竟全然不知!用它具体有哪些好处呢?

1.可以用它来划分命名空间(这个就是就是经常用的了)

2.利用分支技术来封装浏览器之间的差异(这个还真没用过,挺新鲜)

3.借助单体模式,可以把代码组织的更为一致,方便阅读与维护(这个也用过了)

最基本的单体模式

最简单的单体其实就是一个对象字面量。它把一批有一定关联的方法和属性组织在一起。

var Singleton={
name: nimei,
age: 2,
walk: function(){
...
},
eat: function(){
...
}
}

这个对象可以被修改。你可以添加属性和方法。你也可以用delete运算符删除现有成员。这实际上违背了面向对象设计的一条原则:类可以被扩展,但不应该被修改。如果某些变量需要保护,那么可以将其定义在闭包中。

对象字面量只是创建单体的方法之一。也并非所有的对象字面量都是单体,那些只是用来模仿关联数组或容纳数据的对象字面量显然不是单体。

用作划分命名空间

防止全局声明的修改

/*using a namespace*/
var common = {
findProduct: function(){ },
...
}
var findProduct = true;

这样以来,即使我们在外面声明了相同的变量,也能在一定程度上防止findProduct的被修改。

防止其它来源代码的修改

现在网页上的JavaScript代码往往不止用一个来源,什么库代码、广告代码和徽章代码。为了避免与自己代码的冲突,可以定义一个包含自己所有代码的对象。

var JChen = {};
JChen.Common = {
//A singleton with common methods used by all objects and modules
}
JChen.ErrorCodes = {
//An object literal used to store data
}
JChen.PageHandler = {
//A singleton with page specific methods and attributes.
}

用作专用代码包装器

在拥有许多网页的网站中,有些代码是所有网页都要用到的,他们通常被存放在独立的文件中;而有些代码则是某个网页专用的,不会被用到其他地方。最好把这两种代码分别包装在自己的单体对象中。

我们经常要用Javascript为表单添加功能。出于平稳退化方面的考虑,通常先创建一个不依赖于Javascript的、使用普通提交机制完成任务的纯HTML网页。

JChen.RegPage = {
FORM_ID: 'reg-form',
OUTPUT_ID: 'reg-result', handleSubmit: function(e){
e.preventDefault(); //stop the normal form submission var data = {};
var inputs = JChen.RegPage.formEl.getElementByTagName('input'); for(var i=0, len=inputs.length; i<len; i++){
data[inputs[i].name] = inputs[i].value;
} JChen.RegPage.sendRegistration(data);
},
sendRegistration: function(data){
//make an xhr request and call displayResult() when response is recieved
...
},
displayResult: function(response){
JChen.RegPage.outputEl.innerHTML = response;
},
init: function(){
JChen.RegPage.formEl =$(JChen.RegPage.Form_ID);
JChen.RegPage.outputEl = $(JChen.RegPage.OUTPUT_ID);
//hijack the form submission
addEvent(JChen.RegPage.formEl, 'submit', JChen.RegPage.handleSubmit);
}
}
//invoke initialization method after the page load
addLoadEvent(JChen.RegPage.init);

拥有私有成员的单体

第3章介绍的创建类的私有成员的做法的缺点在于它们比较耗费内存,因为每个实例都有方法的一份新副本。

不过,由于单体对象只会被实例化一次,因此为其定义私用方法是不必考虑内存方面的问题。

使用下划线表示法

这个方法就不介绍了,太简单了。

使用闭包

JChen.DataParser = (function(){
//private members
var whitespaceRegex = /\s+/; function stripWhitespace(str){
return str.replace(whitespaceRegex, '');
}
function stringSplit(str, delimiter){
return str.split(delimiter);
} return {
//public members
stringToArray: function(str, delimiter, stripWS){
if(stripWS){
str = stripWhitespace(str);
}
var outputArray = stringSplit(str, delimiter);
return outputArray;
}
}
})();

这种单体模式又称模块模式,指的是它可以把一批相关的方法和属性组织为模块并起到划分命名空间的作用。

现在这些私用方法和属性可以直接用其名来访问,不必在其前面加上this.或JChen.DataParser,这些前缀只适用于访问单体对象的公用成员。

惰性实例化技术

前面所讲的单体模式又一个共同点:单体对象都是在脚本加载时被创建出来。对于资源密集的或配置开销甚大的单体,更合理的做法是将其实例化推迟到需要使用他的时候。

这种技术就是惰性加载(lazy loading)。

实现步骤如下:

1.将所有代码移到constructor方法中

2.全权控制调用时机(正是getInstance所要做的)

JChen.lazyLoading = (function(){
var uniqInstance; function constructor(){
var attr = false;
function method(){ } return {
attrp: true,
methodp: function(){ }
}
} return {
getInstance: function(){
if(!uniqInstance){
uniqInstance = constructor();
}
return uniqInstance;
}
}
})();

分支技术

分支是一种用来把浏览器间的差异封装在运行期间进行设置的动态方法中的技术。

比如说,如果网站中要频繁使用xhr,每次调用都要再次运行浏览器嗅探代码,这样会严重缺乏效率。

更有效的做法是在脚本加载时一次性地确定针对浏览器的代码。这正是分支技术所做的事情。

当然,分支技术并不总是更高效的选择,在两个或者多个分支中只有一个分支被用到了,其他分支就占用了内存。

在考虑是否使用分支技术的时候,必须在缩短时间和占用更多内存这一利一弊之间权衡一下。

下面利用分支技术实现XHR:

var XHR = (function(){
var standard = {
createXhrObj: function(){
return new XMLHttpRequest();
}
};
var activeXNew = {
createXhrObj: function(){
return new ActiveXObject('Msxml2.XMLHTTP');
}
};
var activeXOld = {
createXhrObj: function(){
return new ActiveXObject('Microsoft.XMLHTTP');
}
}; var testObj;
try{
testObj = standard.createXhrObj();
return testObj;
}catch(e){
try{
testObj = activeXNew.createXhrObj();
return testObj;
}catch(e){
try{
testObj = activeXOld.createXhrObj();
return testObj;
}catch(e){
throw new Error('No XHR object found in this environment.');
}
}
}
})();

单体模式的弊端

了解了这么多关于单体的知识,我们再来看看它的弊端。

由于单体模式提供的是一种单点访问,所以它有可能导致模块间的强耦合。因此也就不利于单元测试了。

综上,单体还是留给定义命名空间和实现分支型方法这些用途。

JS设计模式——5.单体模式(用了这么久,竟全然不知!)的更多相关文章

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

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

  2. JS设计模式之单体模式(Singleton)

    单体模式作为一种软件开发模式在众多面向对象语言中得到了广泛的使用,在javascript中,单体模式也是使用非常广泛的,但是由于javascript语言拥有其独特的面向对象方式,导致其和一些传统面向对 ...

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

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

  4. js设计模式——6.模板方法模式与职责链模式

    js设计模式——6.模板方法模式与职责链模式 职责链模式

  5. js设计模式——5.状态模式

    js设计模式——5.状态模式 代码演示 /*js设计模式——状态模式*/ // 状态(红灯,黄灯,绿灯) class State { constructor(color) { this.color = ...

  6. js设计模式——4.迭代器模式

    js设计模式——4.迭代器模式 代码演示 /*js设计模式——迭代器模式*/ class Iterator { constructor(container) { this.list = contain ...

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

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

  8. js设计模式——1.代理模式

    js设计模式——1.代理模式 以下是代码示例 /*js设计模式——代理模式*/ class ReadImg { constructor(fileName) { this.fileName = file ...

  9. javascript设计模式(单体模式)

    主要内容: js中最基本.应用最广的模式就是单体模式,实现原理是将代码组织为一个逻辑单元,这个逻辑单元中的代码可以通过单一的变更进行访问,确保对象只存在一份实例. 单体模式的特点: 在网页中使用全局变 ...

随机推荐

  1. java和mysql的length()区别及char_length()

    一. mysql里面的有length和char_length两个长度函数,区别在于: length: 一个汉字是算三个字符,一个数字或字母算一个字符. char_length: 不管汉字还是数字或者是 ...

  2. python之enumerate()学习

    X = 'abcdefghijklmn' for (index,char) in enumerate(X): print (index, char) 利用enumerate()函数,可以在每次循环中同 ...

  3. display:table的几个妙用:垂直居中、浮动……

    一.为什么不用table系表格元素? 目前,在大多数开发环境中,已经基本不用table元素来做网页布局了,取而代之的是div+css,那么为什么不用table系表格元素呢? 1.用DIV+CSS编写出 ...

  4. 【Python】Python基础教程系列目录

    Python是一个高层次的结合了解释性.编译性.互动性和面向对象的脚本语言. 在现在的工作及开发当中,Python的使用越来越广泛,为了方便大家的学习,Linux大学 特推出了 <Python基 ...

  5. 【uoj#310】[UNR #2]黎明前的巧克力 FWT

    题目描述 给出 $n$ 个数,从中选出两个互不相交的集合,使得第一个集合与第二个集合内的数的异或和相等.求总方案数. 输入 第一行一个正整数 $n$ ,表示巧克力的个数.第二行 $n$ 个整数 $a_ ...

  6. 2月4日 考试——迟到的 ACX

    迟到的 ACX 时限:1s 内存限制:128MB题目描述: 今天长沙下雪了,小 ACX 在上学路上欣赏雪景,导致上学迟到,愤怒的佘总给 ACX 巨佬出了一个题目想考考他,现在他找到你,希望你能帮帮他. ...

  7. 【刷题】洛谷 P4716 【模板】最小树形图

    题目背景 这是一道模板题. 题目描述 给定包含 \(n\) 个结点, \(m\) 条有向边的一个图.试求一棵以结点 \(r\) 为根的最小树形图,并输出最小树形图每条边的权值之和,如果没有以 \(r\ ...

  8. 【BZOJ3105】新Nim游戏(线性基)

    [BZOJ3105]新Nim游戏(线性基) 题面 BZOJ Description 传统的Nim游戏是这样的:有一些火柴堆,每堆都有若干根火柴(不同堆的火柴数量可以不同).两个游戏者轮流操作,每次可以 ...

  9. Linux内核设计第二周学习总结 完成一个简单的时间片轮转多道程序内核代码

    陈巧然 原创作品 转载请注明出处 <Linux内核分析>MOOC课程http://mooc.study.163.com/course/USTC-1000029000 一.使用实验楼的虚拟机 ...

  10. python基础(3)

    使用list和tuple list Python内置的一种数据类型是列表:list.list是一种有序的集合,可以随时添加和删除其中的元素. 比如,列出班里所有同学的名字,就可以用一个list表示: ...