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获取元素值的方法(常见的表单元素)
Nov 15 Javascript
JavaScript中对象属性的添加和删除示例
May 12 Javascript
JS+CSS模拟可以无刷新显示内容的留言板实例
Mar 03 Javascript
JS实现的N多简单无缝滚动代码(包含图文效果)
Nov 06 Javascript
AngularJS自定义插件实现网站用户引导功能示例
Nov 07 Javascript
jQuery插件DataTable使用方法详解(.Net平台)
Dec 22 Javascript
JS求Number类型数组中最大元素方法
Apr 08 Javascript
jQuery each和js forEach用法比较
Feb 27 jQuery
vue实现搜索功能
May 28 Javascript
el-table树形表格表单验证(列表生成序号)
May 31 Javascript
Jquery如何使用animation动画效果改变背景色的代码
Jul 20 jQuery
详解Vue2的diff算法
Jan 06 Vue.js
微信小程序纯文本实现@功能
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
[FAQ]PHP中的一些常识:类篇
2006/10/09 PHP
php 指定范围内多个随机数代码实例
2016/07/18 PHP
javascript 流畅动画实现原理
2009/09/08 Javascript
jquery last-child 列表最后一项的样式
2010/01/22 Javascript
javascript小数四舍五入多种方法实现
2012/12/23 Javascript
jQuery性能优化28条建议你值得借鉴
2013/02/16 Javascript
js模拟hashtable的简单实例
2014/03/06 Javascript
JS实现图片的不间断连续滚动的简单实例
2016/06/03 Javascript
HTML5基于Tomcat 7.0实现WebSocket连接并实现简单的实时聊天
2016/10/31 Javascript
解决jQuery ajax动态新增节点无法触发点击事件的问题
2017/05/24 jQuery
详解nodeJS之路径PATH模块
2017/05/31 NodeJs
以BootStrap Tab为例写一个前端组件
2017/07/25 Javascript
jQuery Easyui Treegrid实现显示checkbox功能
2017/08/08 jQuery
从setTimeout看js函数执行过程
2017/12/19 Javascript
vue2 mint-ui loadmore实现下拉刷新,上拉更多功能
2018/03/21 Javascript
vue 不使用select实现下拉框功能(推荐)
2018/05/17 Javascript
jQuery实现的简单日历组件定义与用法示例
2018/12/24 jQuery
vue+高德地图写地图选址组件的方法
2019/05/18 Javascript
jquery 键盘事件 keypress() keydown() keyup()用法总结
2019/10/23 jQuery
Python3数据库操作包pymysql的操作方法
2018/07/16 Python
python set内置函数的具体使用
2019/07/02 Python
Python 在 VSCode 中使用 IPython Kernel 的方法详解
2020/09/05 Python
7款设计巧妙的css3飘带状3D立体效果的导航菜单和表单窗口
2013/02/04 HTML / CSS
css3中单位px,em,rem,vh,vw,vmin,vmax的区别及浏览器支持情况
2016/12/06 HTML / CSS
Shopee新加坡:东南亚与台湾电商平台
2019/01/25 全球购物
人事专员职责
2014/02/22 职场文书
8和9的加减法教学反思
2014/05/01 职场文书
2014年计生协会工作总结
2014/11/21 职场文书
爱牙日宣传活动总结
2015/02/05 职场文书
写给导师的自荐信
2015/03/06 职场文书
幼儿园班级工作总结2015
2015/05/25 职场文书
2016医师资格考试考生诚信考试承诺书
2016/03/25 职场文书
2019年健身俱乐部的创业计划书
2019/08/26 职场文书
Django框架中表单的用法
2022/06/10 Python
MySQL控制流函数(-if ,elseif,else,case...when)
2022/07/07 MySQL
OpenFeign实现远程调用
2022/08/14 Java/Android