学习JavaScript设计模式之单例模式


Posted in Javascript onJanuary 19, 2016

一、定义

保证一个类仅有一个实例,并提供一个访问它的全局访问点。
当单击登陆按钮,页面中出现一个登陆浮窗,这个登陆浮窗是唯一的,无论单击多少次登陆按钮,这个浮窗都只会被创建一次,那么这个登陆浮窗就适合用单例模式来创建。

二、实现原理

要实现单例并不复杂,使用一个变量来标志当前是否已经为某个类创建过对象,如果是,则在下一次获取该类的实例时,直接返回之前创建的对象。

三、假单例

全局变量不是单例模式,但在JavaScript开发中,我们经常会把全局变量当成单例来使用。

var a = {};

降低全局变量带来的命名污染
(1)使用命名空间

var namespace1 = {
  a: function(){},
  b: 2
}

(2)使用闭包封装私有变量

var user = (function() {
  var _name = 'lee',
    _age = '25';
  return {
    getUserInfo: function() {
      return _name + ":" + _age;
    }
  };
})();

四、惰性单例:在需要的时候才能创建对象实例

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

// 测试
function testSingle(){}
getSingle(testSingle)() === getSingle(testSingle)();  // true

五、补充:

(1)懒加载

var lazyload = function() {
  console.log(1);
  lazyload = function() {
    console.log(2);
  }
  return lazyload();
}

lazyload();

(2)预加载

var preload = (function() {
  console.log(1);
  preload = function() {
    console.log(2);
  };
  return preload;
})();

preload();

希望本文所述对大家学习javascript程序设计有所帮助。

Javascript 相关文章推荐
解决IE下select标签innerHTML插入option的BUG(兼容IE,FF,Opera,Chrome,Safari)
May 13 Javascript
jQuery调用RESTful WCF示例代码(GET方法/POST方法)
Jan 26 Javascript
js中用window.open()打开多个窗口的name问题
Mar 13 Javascript
node.js中的http.response.writeHead方法使用说明
Dec 14 Javascript
node.js中的fs.chmodSync方法使用说明
Dec 18 Javascript
jquery中animate的stop()方法作用实例分析
Jan 30 Javascript
jQuery实现最简单实用的分秒倒计时
Feb 05 Javascript
vue中axios的封装问题(简易版拦截,get,post)
Jun 15 Javascript
vue App.vue中的公共组件改变值触发其他组件或.vue页面监听
May 31 Javascript
jQuery实现轮播图效果
Nov 26 jQuery
JavaScript命令模式原理与用法实例详解
Mar 10 Javascript
vue 通过base64实现图片下载功能
Dec 19 Vue.js
jQuery中bind(),live(),delegate(),on()绑定事件方法实例详解
Jan 19 #Javascript
学习JavaScript设计模式之装饰者模式
Jan 19 #Javascript
jQuery事件绑定用法详解(附bind和live的区别)
Jan 19 #Javascript
浏览器环境下JavaScript脚本加载与执行探析之动态脚本与Ajax脚本注入
Jan 19 #Javascript
js实现有过渡渐变效果的图片轮播相册(兼容IE,ff)
Jan 19 #Javascript
jquery 重写 ajax提交并判断权限后 使用load方法报错解决方法
Jan 19 #Javascript
学习JavaScript设计模式之享元模式
Jan 18 #Javascript
You might like
留言板翻页的实现详解
2006/10/09 PHP
php实现文件编码批量转换
2014/03/10 PHP
yii使用bootstrap分页样式的实例
2017/01/17 PHP
PHP添加PNG图片背景透明水印操作类定义与用法示例
2019/03/12 PHP
JavaScript语句可以不以;结尾的烦恼
2007/03/08 Javascript
超简单的jquery的AJAX用法
2010/05/10 Javascript
jQuery aminate方法定位到页面具体位置
2013/12/26 Javascript
jQuery插件EasyUI校验规则 validatebox验证框
2015/11/29 Javascript
JS+CSS实现的漂亮渐变背景特效代码(6个渐变效果)
2016/03/25 Javascript
js中常用的Math方法总结
2017/01/12 Javascript
JavaScript闭包_动力节点Java学院整理
2017/06/27 Javascript
详解React之父子组件传递和其它一些要点
2018/06/25 Javascript
Bootstrap标签页(Tab)插件切换echarts不显示问题的解决
2018/07/13 Javascript
Bootstrap Table实现定时刷新数据的方法
2018/08/13 Javascript
vue1.0和vue2.0的watch监听事件写法详解
2018/09/11 Javascript
js获取form表单中name属性的值
2019/02/27 Javascript
Angular+Ionic使用queryParams实现跳转页传值的方法
2020/09/05 Javascript
[01:04:05]Mineski vs TNC 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/16 DOTA
Python深入学习之对象的属性
2014/08/31 Python
Windows和Linux下使用Python访问SqlServer的方法介绍
2015/03/10 Python
python 爬虫出现403禁止访问错误详解
2017/03/11 Python
在Python中执行系统命令的方法示例详解
2017/09/14 Python
Python实现多条件筛选目标数据功能【测试可用】
2018/06/13 Python
python调用百度语音识别实现大音频文件语音识别功能
2018/08/30 Python
Python使用try except处理程序异常的三种常用方法分析
2018/09/05 Python
python变量赋值方法(可变与不可变)
2019/01/12 Python
Python选择网卡发包及接收数据包
2019/04/04 Python
Python如何使用k-means方法将列表中相似的句子归类
2019/08/08 Python
python读写csv文件的方法
2019/08/13 Python
HTML5 Canvas玩转酷炫大波浪进度图效果实例(附demo)
2016/12/14 HTML / CSS
美国女士内衣在线折扣商店:One Hanes Place
2019/03/24 全球购物
爽歪歪广告词
2014/03/20 职场文书
就业协议书怎么填
2014/04/11 职场文书
综艺节目策划方案
2014/06/13 职场文书
客户答谢会活动方案
2014/08/31 职场文书
优秀大学生自荐信
2015/03/26 职场文书