js单例模式详解实例


Posted in Javascript onNovember 21, 2013

什么是单例?

单例要求一个类有且只有一个实例,提供一个全局的访问点。因此它要绕过常规的控制器,使其只能有一个实例,供使用者使用,而使用着不关心有几个实例,因此这是设计者的责任

In JavaScript, Singletons serve as a shared resource namespace which isolate implementation code from the global namespace so as to provide a single point of access for functions.

在javascript中,单例被当做一个全局的命名空间,提供一个访问该对象的一个点。

使用场景

In practice, the Singleton pattern is useful when exactly one object is needed to coordinate others across a system.

单例比较适用于一个对象和其他系统进行交互。

类比

单例有点类似于一个小组的小组长,在一段时间内只有一个小组长,有小组长来指定组员的工作,分配和协调和组员的工作。

实例1:这个是最简单的单例,通过key,value的形式存储属性和方法

var A = {
   xx:3,
   yy:4,
   B:function(el){   },
   C:function(el){
   },
   D:function(el){
   },
   E:function(el){
   }
}

实例2:首先创建一个实例的引用,然后判断这个实例是否存在,如果不存在那么就创建,存在的话,就直接返回,保证有且只有一个。

var mySingleton = (function () {
// Instance 存储一个单例实例的引用
var instance;
function init() {
// Singleton
// 私有的方法和变量
function privateMethod(){
    console.log( "I am private" );
}
var privateVariable = "Im also private";
return {
  // 共有的方法和变量
  publicMethod: function () {
    console.log( "The public can see me!" );
  },
  publicProperty: "I am also public"
};
};
return {
// 如果实例不存在,那么创建一个
getInstance: function () {
  if ( !instance ) {
    instance = init();
  }
  return instance;
}
};
})();
var singleA = mySingleton;
var singleB = mySingleton;
console.log( singleA === singleB ); // true

实例3:

var SingletonTester = (function () {
  // options: an object containing configuration options for the singleton
  // e.g var options = { name: "test", pointX: 5}; 
  function Singleton( options )  {
    // set options to the options supplied
    // or an empty object if none are provided
    options = options || {};
    // set some properties for our singleton
    this.name = "SingletonTester";
    this.pointX = options.pointX || 6;
    this.pointY = options.pointY || ; 
  }
  // our instance holder 
  var instance;
  // an emulation of static variables and methods
  var _static  = {  
    name:  "SingletonTester",
    // Method for getting an instance. It returns
    // a singleton instance of a singleton object
    getInstance:  function( options ) {   
      if( instance  ===  undefined )  {    
        instance = new Singleton( options );   
      }   
        return  instance;      
    } 
  }; 
  return  _static;
})();
var singletonTest  =  SingletonTester.getInstance({
  pointX:  5
});
// Log the output of pointX just to verify it is correct
// Outputs: 5
console.log( singletonTest.pointX );
Javascript 相关文章推荐
40款非常有用的 jQuery 插件推荐(系列一)
Dec 21 Javascript
javascript实现继承的简单实例
Jul 26 Javascript
WebPack基础知识详解
Jan 16 Javascript
JavaScript与JQUERY获取元素的宽、高和位置
Feb 26 Javascript
利用jQuery解析获取JSON数据
Apr 08 jQuery
Angular.Js中ng-include指令的使用与实现
May 07 Javascript
javascript基于牛顿迭代法实现求浮点数的平方根【递归原理】
Sep 28 Javascript
vue .sync修饰符的使用详解
Jun 15 Javascript
微信小程序网络封装(简单高效)
Aug 06 Javascript
公众号SVG动画交互实战代码
May 31 Javascript
浅析JavaScript中的事件委托机制跟深浅拷贝
Jan 20 Javascript
如何使用CocosCreator对象池
Apr 14 Javascript
Ajax同步与异步传输的示例代码
Nov 21 #Javascript
jquery与prototype框架的详细对比
Nov 21 #Javascript
Tab切换组件(选项卡功能)实例代码
Nov 21 #Javascript
JS仿百度搜索自动提示框匹配查询功能
Nov 21 #Javascript
探讨javascript是不是面向对象的语言
Nov 21 #Javascript
JS中把字符转成ASCII值的函数示例代码
Nov 21 #Javascript
Javascript对象属性方法汇总
Nov 21 #Javascript
You might like
Yii2框架配置文件(Application属性)与调试技巧实例分析
2019/05/27 PHP
原生js实现fadein 和 fadeout淡入淡出效果
2014/06/05 Javascript
JavaScript实现的使用键盘控制人物走动实例
2014/08/27 Javascript
jQuery背景插件backstretch使用指南
2015/04/21 Javascript
javascript实现点击商品列表checkbox实时统计金额的方法
2015/05/15 Javascript
js闭包所用的场合以及优缺点分析
2015/06/22 Javascript
jquery实现实时改变网页字体大小、字体背景色和颜色的方法
2015/08/05 Javascript
基于JavaScript如何实现私有成员的语法特征及私有成员的实现方式
2015/10/28 Javascript
Javascript中apply、call、bind的巧妙使用
2016/08/18 Javascript
html中通过JS获取JSON数据并加载的方法
2017/11/30 Javascript
Vue和React组件之间的传值方式详解
2019/01/31 Javascript
JavaScript工具库之Lodash详解
2019/06/15 Javascript
JS实现水平遍历和嵌套递归操作示例
2019/08/15 Javascript
[02:16]DOTA2英雄基础教程 干扰者
2014/01/15 DOTA
python 实现对文件夹内的文件排序编号
2018/04/12 Python
详解如何将python3.6软件的py文件打包成exe程序
2018/10/09 Python
Python实现点阵字体读取与转换的方法
2019/01/29 Python
pyqt5 实现 下拉菜单 + 打开文件的示例代码
2019/06/20 Python
django云端留言板实例详解
2019/07/22 Python
python 利用pywifi模块实现连接网络破解wifi密码实时监控网络
2019/09/16 Python
python web框架Flask实现图形验证码及验证码的动态刷新实例
2019/10/14 Python
Python warning警告出现的原因及忽略方法
2020/01/31 Python
在pycharm中实现删除bookmark
2020/02/14 Python
python 链接sqlserver 写接口实例
2020/03/11 Python
用python写一个带有gui界面的密码生成器
2020/11/06 Python
Django celery异步任务实现代码示例
2020/11/26 Python
使用python实现学生信息管理系统
2021/02/25 Python
css3类选择器之结合元素选择器和多类选择器用法
2017/03/09 HTML / CSS
《九色鹿》教学反思
2014/02/27 职场文书
《晚上的太阳》教学反思
2014/04/23 职场文书
建筑施工安全生产责任书
2014/07/22 职场文书
房屋租赁协议书(标准版)
2014/10/02 职场文书
2014年教研组工作总结
2014/11/26 职场文书
专项资金申请报告
2015/05/15 职场文书
电影焦裕禄观后感
2015/06/09 职场文书
windows安装python超详细图文教程
2021/05/21 Python