设计模式 -- 单例模式(传统面向对象与JavaScript 的对比实现)

单例模式 – 传统面向对象与JavaScript 的对比实现

文章目录

  • 单例模式 -- 传统面向对象与JavaScript 的对比实现
    • 传统的面向对象的实现
      • 定义
      • 实现思路
      • 初级实现
        • 缺点
      • 透明的单例模式实现
        • 目的(实现效果)
        • 实现
        • 缺点
      • 用代理实现单例模式
        • 优点
    • JavaScript 中的单例模式实现
      • 实现一:全局变量(不推荐)
        • 缺点
      • 实现二:惰性单例
        • 实现要点
        • JavaScript 的 最终实现
      • 应用场景

传统的面向对象的实现

定义

单例模式的定义是: 保证一个类仅有一个实例,并提供一个访问它的全局访问点。

实现思路

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

初级实现

		var Singleton = function (name) {this.name = name; this.instance = null;};Singleton.prototype.getName = function () {alert(this.name);};Singleton.getInstance = function (name) {if (!this.instance) {this.instance = new Singleton(name);}return this.instance;};const a = Singleton.getInstance('sven1'); const b = Singleton.getInstance('sven2');alert(a === b); // true

缺点

类的不透明性

通过 Singleton.getInstance 来获取 Singleton 类的唯一对象,这种方式相对简单,但有 一个问题,就是增加了这个类的“不透明性”,Singleton 类的使用者必须知道这是一个单例类, 跟以往通过 new XXX 的方式来获取对象不同,这里偏要使用 Singleton.getInstance 来获取对象。


透明的单例模式实现

目的(实现效果)

我们现在的目标是实现一个“透明”的单例类,用户从这个类中创建对象的时候,可以像使 用其他任何普通类一样。


实现

		const Singleton = (function (name) {let instance;function createDiv(name) {if (instance) {return instance;}this.name = name;this.init();return instance = this;}createDiv.prototype.init = function () {const div = document.createElement('div');div.innerHTML = this.name;document.body.appendChild(div);}return createDiv;})();const a = new Singleton('sven1');const b = new Singleton('sven2');

缺点

  1. 为了把 instance 封装起来,我们使用了自执行的匿名函数和闭包,并且让这个匿名函数返回真正的 Singleton 构造方法,这增加了一些程序的复杂度,阅读起来也不是很舒服。
  2. 不符合单一职责,不利于维护。构造函数实际上负责了两件事情。第一是创建对象和执行初始化 init 方法,第二是保证只有一个对象。

用代理实现单例模式

		const CreateDiv = function (name) {this.name = name;this.init();}CreateDiv.prototype.init = function () {const div = document.createElement('div');div.innerHTML = this.name;document.body.appendChild(div);};const ProxySingletonCreateDiv = (function () {let instance;return function (name) {if (!instance) {instance = new CreateDiv(name);}return instance;}})();const a = new ProxySingletonCreateDiv('seven1');const b = new ProxySingletonCreateDiv('seven2');alert(a === b);

优点

跟之前不同的是,现在我们把负责管理单例的逻辑移到了代理类 proxySingletonCreateDiv 中。这样一来,CreateDiv 就变成了 一个普通的类,它跟 proxySingletonCreateDiv 组合起来可以达到单例模式的效果。


JavaScript 中的单例模式实现

以上提到的几种单例模式的实现,更多的是接近传统面向对象语言中的实现,单例对象从 “类”中创建而来。在以类为中心的语言中,这是很自然的做法。比如在 Java 中,如果需要某个对象,就必须先定义一个类,对象总是从类中创建而来的。
但 JavaScript 其实是一门无类(class-free)语言

单例模式的核心是确保只有一个实例,并提供全局访问。


实现一:全局变量(不推荐)

如果 a 变量被声明在全局作用域下, 则我们可以在代码中的任何位置使用这个变量,全局变量提供给全局访问是理所当然的。这样就 满足了单例模式的两个条件。

缺点

全局变量存在很多问题,它很容易造成命名空间污染


实现二:惰性单例

惰性单例指的是在需要的时候才创建对象实例
如 上面初级实现中 instance 实例对象总是在我们调用 Singleton.getInstance 的时候才被创建,而不是在页面加载好 的时候就创建

实现要点

  1. 使用惰性单例:需要的时候才创建
  2. 把不变的部分隔离出来。先不考虑创建一个 div 和创建一个 iframe 有多少差异,抽离管理单例的逻辑,这个逻辑始终是一样的: 用一个变量来标志是否创建过对象,如果是,则在下次直接返回这个已经创建好的对象:

JavaScript 的 最终实现

		var getSingle = function (fn) {var result;return function () {return result || (result = fn.apply(this, arguments));}};var createSingleIframe = getSingle(function () {var iframe = document.createElement('iframe');document.body.appendChild(iframe);return iframe; 6});document.getElementById('loginBtn').onclick = function () {var loginLayer = createSingleIframe();loginLayer.src = 'http://baidu.com';};

把创建实例对象的职责和管理单例的职责分别放置在两个方法里,这两 个方法可以独立变化而互不影响,当它们连接在一起的时候,就完成了创建唯一实例对象的功能。


应用场景

  • 线程池、全局缓存、浏览器中的 window 对象等
  • 创建单一实例

参考文献:
JavaScript 设计模式与开发实践 (by 曾探)

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/46267.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

git回退操作

1. 在工作区回退: 此时文件没有经过任何提交 git checkout -- filename2. git add之后回退 git reset HEAD3. git commit 之后回退 git reset --hard commit_id(前4位)其中,commit_id可通过git log查看,例如: qzcryqz MINGW6…

npm install ffi各种失败,换命令npm i ffi-napi成功

网上各种帖子安装ffi,基本上到了windows build tools这里会卡住。 使用命令npm install --global --production windows-build-tools 安装报错信息如下: PS E:\codes\nodejsPath\tcpTest> npm install --global --production windows-build-tools …

成为创作者的第512天——创作纪念日

​ 📚文章目录 📨官方致信 🎯我的第一篇文章 🧩机缘 🧩收获 🧩成就 🧩憧憬与目标 📨官方致信 ​ 🎯我的第一篇文章 2022 年 03 月 26 日,那一天我在C…

centos 安装防火墙,并开启对应端口号

1.查看防火墙状态: 命令:systemctl status firewalld.service 开启防火墙时,提示没有安装防火墙 [rootlocalhost ~]# systemctl start firewalld.service Failed to start firewalld.service: Unit not found.2.安装防火墙 [rootlocalhost …

阿里云ECS服务器企业级和共享型介绍_企业级常见问题解答FAQ

阿里云企业级服务器是什么?企业级和共享型有什么区别?企业级服务器具有独享且稳定的计算、存储、网络资源,如ECS计算型c6、通用型g8等都是企业级实例,阿里云百科分享什么是企业级云服务器、企业级实例的优势、企业级和共享型云服务…

电脑远程接入软件可以进行文件传输吗?快解析内网穿透

电脑远程接入软件的出现,让我们可以在两台电脑之间进行交互和操作。但是,很多人对于这些软件能否进行文件传输还存在一些疑问。下面的文章将解答这个问题。 1.电脑远程接入软件可以进行文件传输。传统上,我们可能会通过传输线或者移动存储设…

R语言实现非等比例风险生存资料分析(1)

#非等比例风险的生存资料分析 ###1 生成模拟数据### library(flexsurv) set.seed(123) # 生成样本数量 n <- 100 # 生成时间数据 time <- sample(1:1000,n,replaceF) # 调整shape和scale参数以控制生存曲线形状 # 生成事件数据&#xff08;假设按比例风险模型&#xff0…

mqtt开关实现

这个项目的主要需求其实并不复杂&#xff0c;只是需要让用户可以在小程序上控制预约后的自习室座位的灯和柜子等的开关。这里的关键是需要通过一个网络应用来转发用户对智能硬件的控制请求。 物联网应用的主要几个难点及对应的思路如下&#xff1a; 通信数据量小、通信环境不…

Qt下拉菜单

1&#xff0c;QComboBox 2&#xff0c;setMenu()---设置下拉菜单 AI对话未来丨智能写作对话: setMenu()是QWidget类的一个成员函数&#xff0c;在Qt中用于将一个菜单作为一个控件的下拉菜单设置。具体来说&#xff0c;它会把相应的菜单对象与该控件关联&#xff0c;并在控件上…

阿里云无影云电脑/云桌面收费价格表_使用申请方法

阿里云无影云电脑配置具体收费价格表&#xff0c;4核8G企业办公型云电脑可以免费使用3个月&#xff0c;无影云电脑地域不同价格不同&#xff0c;无影云电脑费用是由云桌面配置、云盘、互联网访问带宽、AD Connector 、桌面组共用桌面session 等费用组成&#xff0c;阿里云百科分…

Django的模型

定义模型 from django.db import models class User(models.Model):# 类属性是表示表的字段username models.CharField(max_length50,uniqueTrue)password models.CharField(max_length200)create_time models.DateTimeField(auto_now_addTrue) # auto_now_add新增数据时间…

计算机竞赛 垃圾邮件(短信)分类算法实现 机器学习 深度学习

文章目录 0 前言2 垃圾短信/邮件 分类算法 原理2.1 常用的分类器 - 贝叶斯分类器 3 数据集介绍4 数据预处理5 特征提取6 训练分类器7 综合测试结果8 其他模型方法9 最后 0 前言 &#x1f525; 优质竞赛项目系列&#xff0c;今天要分享的是 &#x1f6a9; 垃圾邮件(短信)分类算…

NPM 创建和管理组织

目录 1、创建一个组织 2、将用户帐户转换为组织 3、组织中开启双因素身份验证 3.1 关于组织的双因素身份验证 3.2 先决条件 3.3 在您的组织中要求双因素身份验证 3.4 帮助已删除的成员和外部协作者重新加入您的组织 4、重命名组织 5、删除组织 1、创建一个组织 任何n…

Win7 x86 家庭版SP1 配置 Python 开发环境

1 Win7 下载地址 来源于 MSDN, 我告诉你 - 做一个安静的工具站 ed2k://|file|cn_windows_7_home_basic_with_sp1_x86_dvd_u_676500.iso|2653276160|843E7A78F2126FAC726CF5342710082D|/ 2 Python 版本选择 Python 3.7.9 Python Release Python 3.7.9 | Python.org 3 Pychar…

Shepherd: A Critic for Language Model Generation

本文是LLM系列的相关文章&#xff0c;针对《Shepherd: A Critic for Language Model Generation》的翻译。 Shepherd&#xff1a;语言模型生成的评价 摘要1 引言2 数据收集3 Shepherd模型4 评估反馈5 结果6 相关工作7 结论不足 摘要 随着大型语言模型的改进&#xff0c;人们对…

ChatGPT和Claude的能力全测评

创造性思维/语言 提示&#xff1a;“写一首 4 行诗&#xff0c;每行只有 3 个词&#xff0c;描写重庆” ChatGPT写诗&#x1f447; Claude写诗&#x1f447; 仁者见仁&#xff0c;您怎么看谁更强&#xff1f; 提示&#xff1a; "如果你随机选择这个问题的答案&#xff0c;…

“维度削减+逻辑回归”:如何使用PCA大幅提升乳腺癌的预测成功率?

一、引言 乳腺癌是女性中最常见的恶性肿瘤之一&#xff0c;也影响着全球范围内许多人们的健康。据世界卫生组织&#xff08;WHO&#xff09;的数据&#xff0c;乳腺癌是全球癌症发病率和死亡率最高的肿瘤之一&#xff0c;其对个体和社会的危害不可忽视。因此&#xff0c;早期乳…

线性回归+基础优化算法

案例代码用法 torch.tensor(data, dtypeNone, deviceNone, requires_gradFalse) # data&#xff1a;表示要转换为张量的数据。可以是列表、NumPy 数组、标量值或其他可转换为张量的对象。 # dtype&#xff1a;可选参数&#xff0c;用于指定输出张量的数据类型。如果不指定&…

leetcode:字符串相乘(两种方法)

题目&#xff1a; 给定两个以字符串形式表示的非负整数 num1 和 num2&#xff0c;返回 num1 和 num2 的乘积&#xff0c;它们的乘积也表示为字符串形式。 注意&#xff1a;不能使用任何内置的 BigInteger 库或直接将输入转换为整数。 示例 1: 输入: num1 "2", nu…

【生态经济学】利用R语言进行经济学研究技术——从数据的收集与清洗、综合建模评价、数据的分析与可视化、因果推断等方面入手

查看原文>>>如何快速掌握利用R语言进行经济学研究技术——从数据的收集与清洗、综合建模评价、数据的分析与可视化、因果推断等方面入手 近年来&#xff0c;人工智能领域已经取得突破性进展&#xff0c;对经济社会各个领域都产生了重大影响&#xff0c;结合了统计学、…