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 相关文章推荐
一个简单的JavaScript 日期计算算法
Sep 11 Javascript
js网页中的(运行代码)功能实现思路
Feb 04 Javascript
JQuery表格内容过滤的实现方法
Jul 05 Javascript
javascript的渐进增强与平稳退化浅谈
Nov 12 Javascript
JS简单编号生成器实现方法(附demo源码下载)
Apr 05 Javascript
JavaScript中利用for循环遍历数组
Jan 15 Javascript
vant(ZanUi)结合async-validator实现表单验证的方法
Dec 06 Javascript
Vue源码解析之Template转化为AST的实现方法
Dec 14 Javascript
JS隐藏号码中间4位代码实例
Apr 09 Javascript
基于vue实现圆形菜单栏组件
Jul 05 Javascript
Element-UI中关于table表格的那些骚操作(小结)
Aug 15 Javascript
基于p5.js 2D图像接口的扩展(交互实现)
Nov 30 Javascript
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(4) php 函数 补充2
2010/02/15 PHP
Linux下php5.4启动脚本
2014/08/03 PHP
详解php与ethereum客户端交互
2018/04/28 PHP
thinkphp5使html5实现动态跳转的例子
2019/10/16 PHP
表单填写时用回车代替TAB的实现方法
2007/10/09 Javascript
js判断变量是否空值的代码
2008/10/26 Javascript
JS 进度条效果实现代码整理
2011/05/21 Javascript
jquery解析XML字符串和XML文件的方法说明
2014/02/21 Javascript
Windows 系统下安装和部署Egret的开发环境
2014/07/31 Javascript
JS+CSS实现美化的下拉列表框效果
2015/08/11 Javascript
利用jQuery中的ajax分页实现代码
2016/02/25 Javascript
微信小程序实现锚点定位楼层跳跃的实例
2017/05/18 Javascript
NodeJS自定义模块写法(详解)
2017/06/27 NodeJs
jquery实现一个全局计时器(商城可用)
2017/06/30 jQuery
jQuery实现节点的追加、替换、删除、复制功能示例
2017/07/11 jQuery
vue slot与传参实例代码讲解
2019/04/28 Javascript
微信小程序版本自动更新的方法
2019/06/14 Javascript
js实现消灭星星(web简易版)
2020/03/24 Javascript
Python实现统计单词出现的个数
2015/05/28 Python
Python实现将xml导入至excel
2015/11/20 Python
Python内置模块ConfigParser实现配置读写功能的方法
2018/02/12 Python
Pycharm取消py脚本中SQL识别的方法
2018/11/29 Python
浅谈Python中的全局锁(GIL)问题
2019/01/11 Python
win10下python2和python3共存问题解决方法
2019/12/23 Python
python 操作mysql数据中fetchone()和fetchall()方式
2020/05/15 Python
基于Python爬取fofa网页端数据过程解析
2020/07/13 Python
详解Scrapy Redis入门实战
2020/11/18 Python
咖啡店的创业计划书,让你hold不住
2014/01/03 职场文书
社区端午节活动方案
2014/01/28 职场文书
剪枝的学问教学反思
2014/02/07 职场文书
人事专员的职责
2014/02/26 职场文书
模特职业生涯规划范文
2014/02/26 职场文书
园艺师求职信
2014/03/10 职场文书
员工安全生产责任书
2014/07/22 职场文书
优秀教师申报材料
2014/12/16 职场文书
Mysql存储过程、触发器、事件调度器使用入门指南
2022/01/22 MySQL