JavaScript设计模式之单例模式详解


Posted in Javascript onJune 09, 2017

最近项目不太忙,难得有时间看看书,平时挺喜欢js这门语言。也看过很多高级教程,觉得自己还是比较热衷于js的设计模式。这一次重温一下《JavaScript设计模式与开发实践》,开篇为单例模式。

/**
 * pre 单例模式
 * 定义:保证一个类仅有一个实例,并提供一个访问它的全局访问点
 * 应用:单例模式是一种常用的模式,有一些对象我们往往只需要一个,
 * 比如线程池、全局缓存、浏览器中的 window 对象等。
 */
//--------------singleton-01-------------
/*写法1*/
var Singleton = function(name){
 this.name = name;
 this.instance = null;
};

Singleton.prototype.getName = function(){
 alert(this.name);
};

Singleton.getInstance = function(){
 if(!this.instance){
  this.instance = new Singleton(name);
 }
 return this.instance;
};

var a = Singleton.getInstance("amy");
var b = Singleton.getInstance("ben");
alert(a === b);

// ------------singleton-02----------------
/*写法2*/
var Singleton = function(name){
 this.name = name;
}
Singleton.prototype.getName = function(){
 return this.name;
}

Singleton.getInstance = (function(){
 var instance = null;
 return function(name){
  if(!instance){
   instance = new Singleton(name);
  }
  return instance;
 }
})();

var a = Singleton.getInstance("amy");
var b = Singleton.getInstance("ben");
alert(a === b);

// ------------singleton03-----------
/*写法3*/
var Singleton = (function(){
 var instance;
 return function(name){
  if(instance){
   return instance;
  }
  this.name = name;
  instance = this;
 }
})();
var a = new Singleton("amy");
var b = new Singleton("ben");
alert(a === b);

//---------------- 示例 ---------------
var getSingleton = function(fn) {
 var result;
 return function() {
  if(!result) {
   result = fn.apply(this, arguments);
  }
  return result;
 }
};

var getSingletonVip = (function() {
 var instance;
 return function(fn) {
  return instance || (instance = fn.apply(this, arguments));
 }
})();

var createLoginUser = function() {
 var div = document.createElement("div");
 div.innerHTML = '这是登录框';
 document.body.appendChild(div);
 return div;
};

var createInfoGrid = function() {
 var div = document.createElement("div");
 div.innerHTML = '这是列表信息框';
 document.body.appendChild(div);
 return div;
};
//--执行singleton1 
var createUserDiv = getSingleton(createLoginUser);
createUserDiv();
createUserDiv();

//--执行singleton2
getSingletonVip(createLoginUser);
getSingletonVip(createLoginUser);

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js url传值中文乱码之解决之道
Nov 20 Javascript
jQuery)扩展jQuery系列之一 模拟alert,confirm(一)
Dec 04 Javascript
JS 无限级 Select效果实现代码(json格式)
Aug 30 Javascript
JS实现侧悬浮浮动实例代码
Nov 29 Javascript
jquery live()调用不存在的解决方法
Feb 26 Javascript
每天一篇javascript学习小结(Date对象)
Nov 13 Javascript
Vue入门之数据绑定(小结)
Jan 08 Javascript
关于HTTP传输中gzip压缩的秘密探索分析
Jan 12 Javascript
jQuery实现的3D版图片轮播示例【滑动轮播】
Jan 18 jQuery
基于vue通用表单解决方案的思考与分析
Mar 16 Javascript
Vue实现微信支付功能遇到的坑
Jun 05 Javascript
对vue生命周期的深入理解
Dec 03 Vue.js
Bootstrap Table使用整理(四)之工具栏
Jun 09 #Javascript
JavaScript设计模式之策略模式详解
Jun 09 #Javascript
Bootstrap Table使用整理(三)
Jun 09 #Javascript
Bootstrap Table使用整理(二)
Jun 09 #Javascript
Bootstrap Table使用整理(一)
Jun 09 #Javascript
Bootstrap Table使用整理(五)之分页组合查询
Jun 09 #Javascript
JS实现简易的图片拖拽排序实例代码
Jun 09 #Javascript
You might like
PHP&MYSQL服务器配置说明
2006/10/09 PHP
PHP数据过滤的方法
2013/10/30 PHP
windows7下安装php的imagick和imagemagick扩展教程
2014/07/04 PHP
php使用fullcalendar日历插件详解
2019/03/06 PHP
用javascript来实现动画导航效果的代码
2007/12/16 Javascript
Jquery图片滚动与幻灯片的实例代码
2013/04/08 Javascript
枚举的实现求得1-1000所有出现1的数字并计算出现1的个数
2013/09/10 Javascript
js函数返回多个返回值的示例代码
2013/11/05 Javascript
jquery通过select列表选择框对表格数据进行过滤示例
2014/05/07 Javascript
基于javascript实现图片左右切换效果
2016/01/25 Javascript
jQuery中deferred对象使用方法详解
2016/07/14 Javascript
第一次接触神奇的Bootstrap基础排版
2016/07/26 Javascript
完美的js div拖拽实例代码
2016/09/24 Javascript
JS自定义混合Mixin函数示例
2016/11/26 Javascript
javascript基本数据类型和转换
2017/03/17 Javascript
使用JS编写的随机抽取号码的小程序
2017/08/11 Javascript
原生JavaScript实现remove()和recover()功能示例
2018/07/24 Javascript
微信小程序实现日历效果
2018/12/28 Javascript
Ajax请求时无法重定向的问题解决代码详解
2019/06/21 Javascript
openlayers实现地图测距测面
2020/09/25 Javascript
Python实现的简单万年历例子分享
2014/04/25 Python
使用Python编写提取日志中的中文的脚本的方法
2015/04/30 Python
Python实现计算文件MD5和SHA1的方法示例
2019/06/11 Python
使用Filter过滤python中的日志输出的实现方法
2019/07/17 Python
Python如何实现FTP功能
2020/05/28 Python
python画图时设置分辨率和画布大小的实现(plt.figure())
2021/01/08 Python
桥梁与隧道工程专业本科生求职信
2013/10/08 职场文书
土木工程毕业生推荐信
2013/10/28 职场文书
加拿大探亲邀请信
2014/01/28 职场文书
企业办公室岗位职责
2014/03/12 职场文书
歌唱比赛策划方案
2014/06/06 职场文书
老人再婚离婚协议书范本
2014/10/27 职场文书
2019新学期家长会工作计划
2019/08/21 职场文书
浅谈Python数学建模之整数规划
2021/06/23 Python
mybatis中sql语句CDATA标签的用法说明
2021/06/30 Java/Android
Redis官方可视化工具RedisInsight安装使用教程
2022/04/19 Redis