Javascript设计模式(2)-单体模式
单体模式
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)-单体模式的更多相关文章
- javascript设计模式之单体模式
一入前端深似海,刚入前端,以为前端只是div+css布局外加jquery操作DOM树辣么简单.伴随着对前端学习的深入,发现前端也是博大精深,而且懂得越多,才发现自己越无知,所以一定不能停下脚步的学习. ...
- javascript --- 设计模式之单体模式(一)
单体是一个用来划分命名空间并将一些相关的属性与方法组织在一起的对象,如果她可以被实例化的话,那她只能被实例化一次(她只能嫁一次,不能二婚). 单体模式是javascript里面最基本但也是最有用的模式 ...
- javascript设计模式(单体模式)
主要内容: js中最基本.应用最广的模式就是单体模式,实现原理是将代码组织为一个逻辑单元,这个逻辑单元中的代码可以通过单一的变更进行访问,确保对象只存在一份实例. 单体模式的特点: 在网页中使用全局变 ...
- javascript --- 设计模式之单体模式(二)
在JavaScript里,实现单例的方式有很多种,其中最简单的一个方式是使用对象字面量的方法,其字面量里可以包含大量的属性和方法: var her = { property1: 'someing', ...
- JS设计模式——5.单体模式
JS设计模式——5.单体模式 http://www.cnblogs.com/JChen666/p/3610585.html 单体模式的优势 用了这么久的单体模式,竟全然不知!用它具体有哪些好处呢? ...
- JavaScript设计模式之----组合模式
javascript设计模式之组合模式 介绍 组合模式是一种专门为创建Web上的动态用户界面而量身制定的模式.使用这种模式可以用一条命令在多个对象上激发复杂的或递归的行为.这可以简化粘合性代码,使其更 ...
- JS设计模式之单体模式(Singleton)
单体模式作为一种软件开发模式在众多面向对象语言中得到了广泛的使用,在javascript中,单体模式也是使用非常广泛的,但是由于javascript语言拥有其独特的面向对象方式,导致其和一些传统面向对 ...
- 从ES6重新认识JavaScript设计模式(三): 建造者模式
1 什么是建造者模式? 建造者模式(Builder)是将一个复杂对象的构建层与其表示层相互分离,同样的构建过程可采用不同的表示. 建造者模式的特点是分步构建一个复杂的对象,可以用不同组合或顺序建造出不 ...
- JavaScript 设计模式之----单体(单例)模式
设计模式之--单体(单例)模式 1.介绍 从本章开始,我们会逐步介绍在JavaScript里使用的各种设计模式实现,在这里我不会过多地介绍模式本身的理论,而只会关注实现.OK,正式开始. 在传统开发工 ...
随机推荐
- HDU 4333 Revolving Digits [扩展KMP]【学习笔记】
题意:给一个数字,每一次把它的最后一位拿到最前面,一直那样下去,分别求形成的数字小于,等于和大于原来数的个数. SAM乱搞失败 当然要先变SS了 然后考虑每个后缀前长为n个字符,把它跟S比较就行了 如 ...
- 剑指offer得意之作——顺时针打印矩阵
题目: 输入一个矩阵,按照从外向里以顺时针的顺序依次打印出每一个数字,例如,如果输入如下矩阵: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 则依次打印出数字1,2,3 ...
- python中常见的三种句型if,while,for
1.if语句: 特别说明:条件后面的冒号不能少,同样必须是英文字符. 特别特别说明:if内部的语句需要有一个统一的缩进,一般用4个空格.python用这种方法替代了其他很多编程语言中的{}. num= ...
- ansible实践-1
不需要安装客户端,通过sshd去通信 基于模块工作,模块可以由任何语言开发 不仅支持命令行使用模块,也支持编写yaml格式的playbook 支持sudo 有提供UI(浏览器图形化)www.ans ...
- ps删除或覆盖内容
除了选区删除.复制选区内容覆盖之外另外一种方法. 删掉字母"PS": 1. 矩形框选工具在字母上方画出选区 2. Ctrl+T,并拖拽底部以覆盖字母 3. 完成
- neo-thinsdk-cs 之 thinWallet 接入私链
neo-thinsdk-cs 之 thinWallet 接入私链 2017年底刚开始接触区块链,目前在被 NEO 折磨. 一开始被官方文档和 NEO-GUI 搞得体无完肤(尤其是传说中的 F12),也 ...
- iOS实现微信外部H5支付完成后返回原APP
看到微信最近放开了微信H5支付,公司决定把H5集成到多款APP上.下面记录下了开发过程. 由于是微信新推出的支付方式,在网上搜索到的相关资料并不多,其中有一篇文件(点此跳转)对我的整个开发过程起到了很 ...
- 韩信点兵(hanxin)
相传韩信才智过人,从不直接清点自己军队的人数,只要让士兵先后以三人一排.五人一排.七人一排地变换队形,而他每次只掠一眼队伍的排尾就知道总人数了.输入包含多组数据,每组数据包含3个非负整数a,b,c,表 ...
- 机器学习实战 之 KNN算法
现在 机器学习 这么火,小编也忍不住想学习一把.注意,小编是零基础哦. 所以,第一步,推荐买一本机器学习的书,我选的是Peter harrigton 的<机器学习实战>.这本书是基于pyt ...
- mysql4 - 高级操作
一.联结(使用 where(早) 和 join(晚) 都可以完成联结) 1.1 从 Teacher 表和 Profession 表中,查询出老师的名字和所属专业的名称. SELECT t.`l_nam ...