javascript设计模式 ? 单例模式原理与应用实例分析


Posted in Javascript onApril 09, 2020

本文实例讲述了javascript设计模式 ? 单例模式。分享给大家供大家参考,具体如下:

介绍:单例模式是结构最简单的设计模式。单例模式用于创建那些在软件系统中独一无二的对象,是一个简单但很实用的设计模式。

定义:确保某一个类只有一个实例,而且自行实例化并向整个系统提供这个实例,这个类称为单例类,它提供全局访问的方法。单例模式是一种对象创建型模式。

场景:日常编码中会有很多需要重用的场景,例如弹窗,键盘输入这类公共组件,我们往往希望它只创建一次,在第二次使用时重复使用之前创建好的实例。为了节约资源,提高性能,需要保证实例对象的唯一性,就可以采用单例模式实现。使用单例模式要注意:1.某个类只能有一个实例 2.它必须自行创建这个实例 3.它必须自行向整个系统提供这个实例

示例:

单利模式有两个分支,饿汉模式单例和懒汉模式单例。我们对比看下区别:

//懒汉模式单例demo
//懒汉模式:只有在我需要实例的时候才会第一次实例化,只有当我第一次调用getInstance时才会去执行init获取实例。
var Singleton = (function () {
  var instantiated; 
  function init(){
    return {
      sayHello: function () {
        console.log('hello');
      }
    };
  }
 
  return {
    getInstance: function () {
      if(!instantiated){
        instantiated = init();
      }
      return instantiated;
    } 
  }
})();
 
//只能通过getInstance方法获取对象实例:
var instance = Singleton.getInstance();
var instance2 = Singleton.getInstance();
instance.sayHello(); //hello
instance2.sayHello(); //hello
console.log(instance === instance2); //true
 
//饿汉模式demo
//饿汉模式:在类初始化时就立刻执行getInstance进行赋值。
var Singleton = (function () {
  var instantiated = init();  //初始化时即对instantiated进行赋值
  function init(){
    return {
      sayHello: function () {
 console.log('hello');
   }
 };
  }
 
  return {
 getInstance: function () {
   return instantiated;
 } 
  }
})();
 
var instance = Singleton.getInstance();
var instance2 = Singleton.getInstance();
instance.sayHello(); //hello
instance2.sayHello(); //hello
console.log(instance === instance2); //true

以上demo思考一个问题,如果init函数是耗时操作,还能保证每个类只有一个实例吗?

在多线程的场景下,会出现init函数执行过程中再次触发getInstance。就会导致一个类存在多个实例。javascript会出现这样的问题吗?

两种单例模式对比下优缺点:饿汉模式在一开始就实例化,在资源合理利用方面落下风,懒汉模式在多线程情况下需要考虑同时初始化带来的影响。

单例模式总结:

优点:
* 严格控制实例的访问
* 节约系统性能,避免重复创建销毁对象,避免资源浪费

缺点:
* 单例模式的扩展必须修改类主体,这和我们前面介绍的开关原则冲突
* 单例模式职责过重,一定程度违背了单一职责原则,因为单例既提供了业务方法,也提供了创建对象的方法,有一定的功能耦合。

适用场景:
* 系统只需要一个实例对象
* 客户调用类的单个实例只允许使用一个公共访问点,除了该公共访问点,不能通过其他途径访问该实例。

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

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

Javascript 相关文章推荐
jquery 图片Silhouette Fadeins渐显效果
Feb 07 Javascript
精通Javascript系列之Javascript基础篇
Jun 07 Javascript
div拖拽插件——JQ.MoveBox.js(自制JQ插件)
May 17 Javascript
JavaScript中this的使用详解
Nov 08 Javascript
多种方法实现load加载完成后把图片一次性显示出来
Feb 19 Javascript
jQuery带时间的日期控件代码分享
Aug 26 Javascript
微信小程序删除处理详解
Aug 16 Javascript
前端必备插件之纯原生JS的瀑布流插件Macy.js
Nov 22 Javascript
JavaScript基于对象方法实现数组去重及排序操作示例
Jul 10 Javascript
ajaxfileupload.js实现上传文件功能
Apr 19 Javascript
JavaScript实现随机点名器实例详解
May 07 Javascript
VUE+node(express)实现前后端分离
Oct 13 Javascript
微信小程序纯文本实现@功能
Apr 08 #Javascript
JavaScript 俄罗斯方块游戏实现方法与代码解释
Apr 08 #Javascript
vue与iframe之间的信息交互的实现
Apr 08 #Javascript
Javascript摸拟自由落体与上抛运动原理与实现方法详解
Apr 08 #Javascript
antd-mobile ListView长列表的数据更新遇到的坑
Apr 08 #Javascript
详解element上传组件before-remove钩子问题解决
Apr 08 #Javascript
javascript 设计模式之享元模式原理与应用详解
Apr 08 #Javascript
You might like
咖啡的传说和历史
2021/03/03 新手入门
php简单图像创建入门实例
2015/06/10 PHP
php 升级到 5.3+ 后出现的一些错误,如 ereg(); ereg_replace(); 函数报错
2015/12/07 PHP
php提交post数组参数实例分析
2015/12/17 PHP
CI框架简单邮件发送类实例
2016/05/18 PHP
PHP实现移除数组中为空或为某值元素的方法
2017/01/07 PHP
thinkphp5.0整合phpsocketio完整攻略(绕坑)
2018/10/12 PHP
初学js插入节点appendChild insertBefore使用方法
2011/07/04 Javascript
JavaScript中的私有/静态属性介绍
2012/07/26 Javascript
JS动态修改iframe内嵌网页地址的方法
2015/04/01 Javascript
jQuery插件之jQuery.Form.js用法实例分析(附demo示例源码)
2016/01/04 Javascript
jquery延迟对象解析
2016/10/26 Javascript
JS实现选定指定HTML元素对象中指定文本内容功能示例
2017/02/13 Javascript
微信小程序动画组件使用解析,类似vue,且更强大
2019/08/01 Javascript
JS使用正则表达式实现常用的表单验证功能分析
2020/04/30 Javascript
js实现九宫格布局效果
2020/05/28 Javascript
使用AutoJs实现微信抢红包的代码
2020/12/31 Javascript
[59:00]OG vs TNC 2018国际邀请赛小组赛BO2 第一场 8.19
2018/08/21 DOTA
windows下wxPython开发环境安装与配置方法
2014/06/28 Python
Scrapy框架使用的基本知识
2018/10/21 Python
Python中的X[:,0]、X[:,1]、X[:,:,0]、X[:,:,1]、X[:,m:n]和X[:,:,m:n]
2020/02/13 Python
python GUI库图形界面开发之PyQt5滚动条控件QScrollBar详细使用方法与实例
2020/03/06 Python
tensorflow安装成功import tensorflow 出现问题
2020/04/16 Python
使用CSS3和Checkbox实现JQuery的一些效果
2015/08/03 HTML / CSS
HTML文本属性&颜色控制属性的实现
2019/12/17 HTML / CSS
美国顶级品牌男士大码服装店:DXL
2017/08/30 全球购物
应届生求职推荐信
2013/10/28 职场文书
安全生产汇报材料
2014/02/17 职场文书
小学先进集体事迹材料
2014/05/31 职场文书
解放思想大讨论活动心得体会
2014/09/11 职场文书
乡镇党的群众路线教育实践活动制度建设计划
2014/11/03 职场文书
2014年煤矿安全工作总结
2014/12/04 职场文书
刑事上诉状(量刑过重)
2015/05/23 职场文书
房贷工资证明范本
2015/06/12 职场文书
2019新员工心得体会
2019/06/25 职场文书
浅析python中特殊文件和特殊函数
2022/02/24 Python