单体模式

1. js最简单的单体模式

对象字面量:把一批有一定关联的方法和属性组织在一起

// 对象字面量
var Singleton = {
attr1: true,
attr2: 10,
method1: function() {},
method2: function(arg) {}
} // 配合命名空间
var GiantCorp = {}
GiantCorp.Singleton = {...}

2. 拥有私有成员的单体

2.1 使用下划线

下面实现一个单体用于对字符串进行分割并返回分割后字符串组成的数组,它有三个参数:(要分割的字符串, 分割的标志字符串, [是否先对字符串进行去空格符处理]),这个例子下面也会用到

GiantCrop.DataParser = {
// private methods
_stripWitespace: function(str) { // 去空格符处理
return str.replace(/\s+/g, '');
},
_stringSplit: function(str, delimiter) { // 字符串分割处理
return str.split(delimiter);
}, // public method
stringToArray: function(str, delimiter, stripWS) {
if(stripWS) {
str = this._stripWitespace(str)
}
var outputArray = this._stringSplit(str, delimiter);
return outputArray
}
} // 里面使用 this 来访问私有方法有一定风险,因为 this 不一定是指向 GiantCrop.DataParser,所以最好使用 GiantCrop.DataParser 来访问私有方法

2.2 使用闭包

GiantCrop.DataParser = (function() {
// private attribute
var whilespaceRegex = /\s+/g;
// private methods
function stripWitespace(str) {
return str.replace(whilespaceRegex, '');
}
function stringSplit(str, delimiter) {
return str.split(delimiter);
} return {
// public method
stringToArray: function(str, delimiter, stripWS) {
if(stripWS) {
str = stripWitespace(str)
}
var outputArray = stringSplit(str, delimiter);
return outputArray
}
}
})()

3. 惰性实例化

GiantCrop.DataParser = (function() {

    var uniqueInstance = null;

    function constructor() {        //控制实例化函数,外部无法访问到
// private attribute
var whilespaceRegex = /\s+/g;
// private methods
function stripWitespace(str) {
return str.replace(whilespaceRegex, '');
}
function stringSplit(str, delimiter) {
return str.split(delimiter);
} return {
// public method
stringToArray: function(str, delimiter, stripWS) {
if(stripWS) {
str = stripWitespace(str)
}
var outputArray = stringSplit(str, delimiter);
return outputArray
}
}
} return {
getInstance: function() {
if(!uniqueInstance) { // 判断是否已初始化实例
uniqueInstance = constructor()
}
return uniqueInstance
}
} })() // usage
GiantCrop.DataParser.getInstance().stringToArray('ss sabb bb', 'a', true)

4. 分支

在前端开发中,有时实现同一个功能需要去设配不同浏览器,比如进行 Ajax 请求,下面这个例子就是通过分支技术设配不同浏览器获得 XMLHttpRequest 对象

// 一起来就立即执行获得对应浏览器支持的 xhr 对象
var SimpleXhrFactory = (function() {
// 三个分支
var standard = {
createXhrObject: function() {
return new XMLHttpRequest();
}
}
var activeXNew = {
createXhrObject: function() {
return new ActiveXObject('Msxml2.XMLHTTP');
}
}
var activeXOld = {
createXhrObject: function() {
return new ActiveXObject('Microsoft.XMLHTTP')
}
} // 使用 try catch 检查每个分支,并返回不报错的分支
var testObject = null;
try {
testObject = standard.createXhrObject();
return standard
}catch(err) {
try{
testObject = activeXNew.createXhrObject();
return activeXNew
}catch(err) {
try{
testObject = activeXOld.createXhrObject();
return activeXOld
}catch(err) {
throw new Error('No XHR object found in this environment')
}
}
}
})() // usage
SimpleXhrFactory.createXhrObject()

5. 单体的利弊

1. 利

  • 不会被多次实例化
  • 使代码的调试和维护变的轻松
  • 描述性的命名空间可以增强代码的自我说明性,有利于新手阅读和理解
  • 可防止你的方法被其他程序员误改
  • 使用惰性实例化技术可提升性能
  • 使用分支技术可以创建出为特定环境量身定做的方法,这种方法不会在每次调用时再浪费时间去检查运行环境

2. 弊

  • 单点访问,它有可能导致模块间的强耦合(有时创建一个可实例化的类比较可取,哪怕它只有被实例化一次)
  • 强耦合不利于单元测试
  • 当体最好留给定义命名空间和实现分支型方法这些用途
  • 有时某些更高级的模式会更符合任务的需要,不能因为单体够用了就不适用其他模式

注意

转载、引用,但请标明作者和原文地址

Javascript设计模式(2)-单体模式的更多相关文章

  1. javascript设计模式之单体模式

    一入前端深似海,刚入前端,以为前端只是div+css布局外加jquery操作DOM树辣么简单.伴随着对前端学习的深入,发现前端也是博大精深,而且懂得越多,才发现自己越无知,所以一定不能停下脚步的学习. ...

  2. javascript --- 设计模式之单体模式(一)

    单体是一个用来划分命名空间并将一些相关的属性与方法组织在一起的对象,如果她可以被实例化的话,那她只能被实例化一次(她只能嫁一次,不能二婚). 单体模式是javascript里面最基本但也是最有用的模式 ...

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

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

  4. javascript --- 设计模式之单体模式(二)

    在JavaScript里,实现单例的方式有很多种,其中最简单的一个方式是使用对象字面量的方法,其字面量里可以包含大量的属性和方法: var her = { property1: 'someing', ...

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

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

  6. JavaScript设计模式之----组合模式

    javascript设计模式之组合模式 介绍 组合模式是一种专门为创建Web上的动态用户界面而量身制定的模式.使用这种模式可以用一条命令在多个对象上激发复杂的或递归的行为.这可以简化粘合性代码,使其更 ...

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

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

  8. 从ES6重新认识JavaScript设计模式(三): 建造者模式

    1 什么是建造者模式? 建造者模式(Builder)是将一个复杂对象的构建层与其表示层相互分离,同样的构建过程可采用不同的表示. 建造者模式的特点是分步构建一个复杂的对象,可以用不同组合或顺序建造出不 ...

  9. JavaScript 设计模式之----单体(单例)模式

    设计模式之--单体(单例)模式 1.介绍 从本章开始,我们会逐步介绍在JavaScript里使用的各种设计模式实现,在这里我不会过多地介绍模式本身的理论,而只会关注实现.OK,正式开始. 在传统开发工 ...

随机推荐

  1. CocosCreator游戏开发---菜鸟学习之路(二)SocketIO简易教程

    请先参考教程司令部-SocketIO教程进行相关操作 开发完成后部分用户会出现持续输出 a userConnected的BUG 如下图所示 经过一段时间的BUG检查终于发现了问题所在.每个人碰到的情况 ...

  2. httping:测量网站延迟

    遇到网络问题的时候,我们一般会先通过 ping 这个工具来了解基本的情况.httping 与 ping 类似,不过它不是发送 ICMP 请求,而是发送 HTTP 请求.利用 httping,我们可以测 ...

  3. Spring Boot - Font Awesome OTS parsing error: Failed to convert 字体加载失败

    字体文件,加载不出来 解决方案  一 问题是Maven正在过滤字体文件并破坏它们. <resource> <directory>${project.basedir}/src/m ...

  4. 工作中代码笔记 -- adb命令篇

    1.抓log方法 (bat文件) mkdir D:\logcatset /p miaoshu=请描述操作:adb logcat -v threadtime > D:\logcat\%miaosh ...

  5. InputStream中通过mark和reset方法重复利用缓存

    通过缓存InputStream可重复利用一个InputStream,但是要缓存一整个InputStream内存压力可能是比较大的.如果第一次读取InputStream是用来判断文件流类型,文件编码等用 ...

  6. C++11 左值、右值、右值引用详解

    C++11 左值.右值.右值引用详解 左值.右值 在C++11中所有的值必属于左值.右值两者之一,右值又可以细分为纯右值.将亡值. 在C++11中可以取地址的.有名字的就是左值,反之,不能取地址的.没 ...

  7. vim插件安装总结

    vim插件安装总结 vim 插件 vundle 插件对于vim来说是一个杀手级别的神器助手,能自动补全,语法高亮,文件搜索等等,有效地提升了编程效率.下面就个人的一些安装和使用进行一个总结. 自动管理 ...

  8. 【2016北京集训测试赛(十六)】 River (最大流)

    Description  Special Judge Hint 注意是全程不能经过两个相同的景点,并且一天的开始和结束不能用同样的交通方式. 题解 题目大意:给定两组点,每组有$n$个点,有若干条跨组 ...

  9. MyCat 枚举分片设计思考,查询命中条件

    Mycat多租户实现的两种方式 MyCat,各种分片规则,仅保证插入的时候分片.表关联,join,查询怎么命中分片条件,还是需要设计. 今天稍微测了一下. ER 分片,此方式,插入的时候能分片,但是查 ...

  10. Redis进阶实践之十四 Redis-cli命令行工具使用详解第一部分

    一.介绍       redis学了有一段时间了,以前都是看视频,看教程,很少看官方的东西.现在redis的东西要看的都差不多看完了.网上的东西也不多了.剩下来就看看官网的东西吧,一遍翻译,一遍测试. ...