基于JavaScript实现单例模式


Posted in Javascript onOctober 30, 2019

首先,了解一下什么是单例模式,这里我直接把菜鸟教程中的定义给copy过来:

单例模式(Singleton Pattern)是 Java 中最简单的设计模式之一。这种类型的设计模式属于创建型模式,它提供了一种创建对象的最佳方式。

这种模式涉及到一个单一的类,该类负责创建自己的对象,同时确保只有单个对象被创建。这个类提供了一种访问其唯一的对象的方式,可以直接访问,不需要实例化该类的对象。

注意:

1、单例类只能有一个实例。

2、单例类必须自己创建自己的唯一实例。

3、单例类必须给所有其他对象提供这一实例。

用一句话来总结就是:在单例模式中,一个类仅有一个实例,并提供一个访问它的全局访问点。这无非是用一个变量来标志当前是否已经为某个类创建过对象,如果是,则在下一次获取该类的实例时,直接返回之前创建的对象,在JavaScript我们很自然而然就会想到用闭包来解决这个问题。

比如说需要生成一个页面登录框,因为有且只可能有一个登录框,那么你就可以用单例的思想去实现他,代码如下:

let createLoginWindow = function(title) {
  this.title= title;
  this.init();
}

createLoginWindow.prototype.init = function() {
  // some code
  
}
let proxySingleton = (function() {
  var instance;
  return function(title) {
    if (!instance) {
      instance = new createLoginWindow(title);
    }
    return instance;
  }
})();
let windowA = new proxySingleton('login1');
let windowB = new proxySingleton('login2');

console.log(windowA === windowB); // true

可以看到,上述代码中createLoginWindow负责构造对象,然后通过代理proxySingleton来判断是构造新的对象还是返回已有对象。

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

Javascript 相关文章推荐
javascript背投广告代码的完善
Apr 08 Javascript
关于跨站脚本攻击问题
Dec 22 Javascript
javaScript中的this示例学习详解及工作原理
Jan 13 Javascript
JS中frameset框架弹出层实例代码
Apr 01 Javascript
Vue2.0实现1.0的搜索过滤器功能实例代码
Mar 20 Javascript
微信小程序新增的拖动组件movable-view使用教程
May 20 Javascript
Angular2+国际化方案(ngx-translate)的示例代码
Aug 23 Javascript
JS获取当前地理位置的方法
Oct 25 Javascript
如何重置vue打印变量的显示方式
Dec 06 Javascript
微信小程序实现文字跑马灯效果
May 26 Javascript
谈谈JavaScript中super(props)的重要性
Feb 12 Javascript
Vue ECharts实现机舱座位选择展示功能
May 15 Vue.js
vue解决使用$http获取数据时报错的问题
Oct 30 #Javascript
茶余饭后聊聊Vue3.0响应式数据那些事儿
Oct 30 #Javascript
vue请求服务器数据后绑定不上的解决方法
Oct 30 #Javascript
vue中的mescroll搜索运用及各种填坑处理
Oct 30 #Javascript
vue解决花括号数据绑定不成功的问题
Oct 30 #Javascript
vue中使用rem布局代码详解
Oct 30 #Javascript
vue进入页面时不在顶部,检测滚动返回顶部按钮问题及解决方法
Oct 30 #Javascript
You might like
各种战术和打法的原创者
2020/03/04 星际争霸
PHP中source #N问题的解决方法
2014/01/27 PHP
PHP static局部静态变量和全局静态变量总结
2014/03/02 PHP
IE浏览器兼容Firefox的JS脚本的代码
2008/10/23 Javascript
Iframe thickbox2.0使用的方法
2009/03/05 Javascript
基于MVC3方式实现下拉列表联动(JQuery)
2013/09/02 Javascript
javascript代码运行不出来执行错误的可能情况整理
2013/10/18 Javascript
Extjs4中tree的拖拽功能(可以两棵树之间拖拽) 简单实例
2013/12/08 Javascript
Jquery实现仿京东商城省市联动菜单
2015/11/19 Javascript
js流动式效果显示当前系统时间
2016/05/16 Javascript
jQuery包裹节点用法完整示例
2016/09/13 Javascript
JavaScript实现解析INI文件内容的方法
2016/11/17 Javascript
浅谈Angular的$q, defer, promise
2016/12/20 Javascript
backbone简介_动力节点Java学院整理
2017/07/14 Javascript
js模块加载方式浅析
2017/08/12 Javascript
移动端效果之Swiper详解
2017/10/09 Javascript
Vue实现点击时间获取时间段查询功能
2020/08/21 Javascript
详解Vue实战指南之依赖注入(provide/inject)
2018/11/13 Javascript
微信小程序 textarea 层级过高问题简单解决方案
2019/10/14 Javascript
分享一款超好用的JavaScript 打包压缩工具
2020/04/26 Javascript
在ubuntu16.04中将python3设置为默认的命令写法
2018/10/31 Python
python接口自动化(十七)--Json 数据处理---一次爬坑记(详解)
2019/04/18 Python
python多线程共享变量的使用和效率方法
2019/07/16 Python
Python高级特性 切片 迭代解析
2019/08/23 Python
Python3 assert断言实现原理解析
2020/03/02 Python
利用CSS3实现开门效果实例源码
2016/08/22 HTML / CSS
HTML5 body设置自适应全屏
2020/05/07 HTML / CSS
蔻驰法国官网:COACH法国
2018/11/14 全球购物
Rowdy Gentleman服装和配饰:美好时光
2019/09/24 全球购物
莫斯科大型旅游休闲商品超市:Camping.ru
2020/09/16 全球购物
静心口服夜广告词
2014/03/20 职场文书
学习雷锋活动总结
2014/04/29 职场文书
关于企业的执行力标语大全
2020/01/06 职场文书
Nginx内网单机反向代理的实现
2021/11/07 Servers
无线电知识基础入门篇
2022/02/18 无线电
《月歌。》宣布制作10周年纪念剧场版《RABBITS KINGDOM THE MOVIE》
2022/04/02 日漫