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 06 Javascript
JS 如何获取radio选中后的值及不选择取radio的值
Oct 28 Javascript
JavaScript 实现鼠标拖动元素实例代码
Feb 24 Javascript
jquery+CSS实现的水平布局多级网页菜单效果
Aug 24 Javascript
IE和Firefox之间在JavaScript语法上的差异
Apr 22 Javascript
检查表单元素的值是否为空的实例代码
Jun 16 Javascript
微信小程序 Storage API实例详解
Oct 02 Javascript
js 只比较时间大小的实例
Oct 26 Javascript
JS排序算法之冒泡排序,选择排序与插入排序实例分析
Dec 13 Javascript
vue主动刷新页面及列表数据删除后的刷新实例
Sep 16 Javascript
深入剖析JavaScript instanceof 运算符
Jun 14 Javascript
layui 实现表格某一列显示图标
Sep 19 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.ini中文版
2006/10/09 PHP
php防止网站被攻击的应急代码
2015/10/21 PHP
PHP中strcmp()和strcasecmp()函数字符串比较用法分析
2016/01/07 PHP
Sample script that displays all of the users in a given SQL Server DB
2007/06/16 Javascript
Javascript根据指定下标或对象删除数组元素
2012/12/21 Javascript
判断ie的两种简单方法
2013/08/12 Javascript
javascript window.open打开新窗口后无法再次打开该窗口问题的解决方法
2014/04/12 Javascript
jQuery功能函数详解
2015/02/01 Javascript
JavaScript实现添加及删除事件的方法小结
2015/08/04 Javascript
jquery实现先淡出再折叠收起的动画效果
2015/08/07 Javascript
CSS3+JavaScript实现翻页幻灯片效果
2017/06/28 Javascript
删除table表格行的实例讲解
2017/09/21 Javascript
解析vue中的$mount
2017/12/21 Javascript
简单了解微信小程序的目录结构
2019/07/01 Javascript
浅谈Vue使用Elementui修改默认的最快方法
2020/12/05 Vue.js
python脚本实现分析dns日志并对受访域名排行
2014/09/18 Python
深入理解python try异常处理机制
2016/06/01 Python
用yum安装MySQLdb模块的步骤方法
2016/12/15 Python
树莓派实现移动拍照
2019/06/22 Python
django fernet fields字段加密实践详解
2019/08/12 Python
python实现简单坦克大战
2020/03/27 Python
在tensorflow实现直接读取网络的参数(weight and bias)的值
2020/06/24 Python
Python+unittest+requests+excel实现接口自动化测试框架
2020/12/23 Python
html5 Canvas画图教程(8)—canvas里画曲线之bezierCurveTo方法
2013/01/09 HTML / CSS
详解Canvas实用库Fabric.js使用手册
2019/01/07 HTML / CSS
英国家用电器购物网站:Hughes
2018/02/23 全球购物
Saucony澳大利亚官网:美国跑鞋品牌,运动鞋中的劳斯莱斯
2018/05/05 全球购物
加拿大专业美发产品购物网站:Chatters
2021/02/28 全球购物
开会迟到检讨书
2014/01/08 职场文书
十佳大学生事迹材料
2014/01/29 职场文书
《花的勇气》教后反思
2014/02/12 职场文书
我的中国梦演讲稿小学篇
2014/08/19 职场文书
党员对照检查材料思想汇报(党的群众路线)
2014/09/24 职场文书
2014年小学数学教师工作总结
2014/12/03 职场文书
详解在SQLPlus中实现上下键翻查历史命令的功能
2022/03/18 SQL Server
python库Tsmoothie模块数据平滑化异常点抓取
2022/06/10 Python