js单例模式

单例模式是一种常见的设计模式,在JavaScript中也有广泛应用,以下是关于它的详细介绍:

定义

  • 单例模式是一种创建型设计模式,它确保一个类只有一个实例,并提供一个全局访问点来访问该实例。在JavaScript中,虽然没有像传统面向对象语言中的类的概念,但可以通过对象字面量、构造函数、闭包等方式来实现单例模式。

实现方式

对象字面量方式

const singleton = {property: "Some value",method: function() {console.log("This is a method in the singleton object.");}
};
  • 这种方式简单直接,创建了一个包含属性和方法的对象字面量,并且该对象在全局范围内只有一个实例。可以通过 singleton.propertysingleton.method() 来访问和调用其中的成员。

构造函数与闭包结合方式

function Singleton() {if (!Singleton.instance) {Singleton.instance = this;this.property = "Some value";this.method = function() {console.log("This is a method in the singleton instance.");};}return Singleton.instance;
}const instance1 = new Singleton();
const instance2 = new Singleton();console.log(instance1 === instance2); // true
  • 在构造函数 Singleton 内部,通过判断 Singleton.instance 是否存在来确保只有一个实例被创建。如果不存在,则将当前实例赋值给 Singleton.instance ,并添加属性和方法。后续每次调用 new Singleton() 时,都会返回同一个实例。

使用ES6的类和静态属性

class Singleton {constructor() {if (!Singleton.instance) {Singleton.instance = this;this.property = "Some value";this.method = function() {console.log("This is a method in the singleton instance.");};}return Singleton.instance;}static getInstance() {if (!Singleton.instance) {Singleton.instance = new Singleton();}return Singleton.instance;}
}const instance1 = Singleton.getInstance();
const instance2 = Singleton.getInstance();console.log(instance1 === instance2); // true
  • 定义了一个 Singleton 类,在构造函数中同样进行实例的唯一性判断和创建。同时,提供了一个静态方法 getInstance ,用于获取单例实例,这样可以更方便地在其他地方获取单例对象,而不需要直接调用构造函数。

应用场景

全局状态管理

  • 在JavaScript应用中,如Vuex、Redux等状态管理库的核心原理就部分地运用了单例模式。以Vuex为例,整个应用中的状态存储在一个唯一的store实例中,各个组件都可以访问和修改这个store中的状态,确保了状态的一致性和唯一性。
import Vue from 'vue';
import Vuex from 'vuex';Vue.use(Vuex);const store = new Vuex.Store({state: {count: 0},mutations: {increment(state) {state.count++;}}
});export default store;

数据库连接池

  • 在与数据库交互的应用中,为了避免频繁地创建和销毁数据库连接,通常会使用数据库连接池来管理连接。连接池可以设计成单例模式,确保整个应用中只有一个连接池实例,所有需要数据库连接的地方都从这个连接池中获取连接,提高性能和资源利用率。
const mysql = require('mysql');class DatabasePool {constructor() {if (!DatabasePool.instance) {this.pool = mysql.createPool({connectionLimit: 10,host: 'localhost',user: 'root',password: 'password',database: 'mydb'});DatabasePool.instance = this;}return DatabasePool.instance;}getConnection(callback) {this.pool.getConnection(callback);}
}const pool = new DatabasePool();
pool.getConnection((err, connection) => {if (err) throw err;// 使用连接进行数据库操作connection.release();
});

日志记录器

  • 在应用中,通常需要一个统一的日志记录器来记录各种操作和错误信息。单例模式可以确保整个应用中只有一个日志记录器实例,方便对日志进行统一管理和配置,避免多个日志记录器之间的冲突和混乱。
class Logger {constructor() {if (!Logger.instance) {this.logs = [];Logger.instance = this;}return Logger.instance;}log(message) {const timestamp = new Date().toISOString();this.logs.push(`${timestamp} - ${message}`);console.log(message);}getLogs() {return this.logs;}
}const logger = new Logger();
logger.log("This is a log message.");
logger.log("Another log message.");
console.log(logger.getLogs());

优点

  • 确保唯一性:保证一个类只有一个实例存在,避免了因创建多个实例而导致的资源浪费和数据不一致等问题。
  • 全局访问点:提供了一个全局可访问的点来获取该实例,方便在不同的模块和代码位置共享和使用该实例,提高了代码的可维护性和可扩展性。

缺点

  • 违反单一职责原则:单例类可能会承担过多的职责,因为它既要负责自身的实例化和管理,又要提供各种业务方法和属性,导致类的职责不单一,不利于代码的维护和测试。
  • 隐藏依赖关系:由于单例模式通常提供全局访问点,使得代码中对单例实例的依赖关系变得不明显,可能会导致代码的耦合度增加,不利于代码的解耦和重构。

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

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

相关文章

【Golang 面试题】每日 3 题(六)

✍个人博客:Pandaconda-CSDN博客 📣专栏地址:http://t.csdnimg.cn/UWz06 📚专栏简介:在这个专栏中,我将会分享 Golang 面试中常见的面试题给大家~ ❤️如果有收获的话,欢迎点赞👍收藏…

SQL Server数据库多主模式解决方案

SQL Server 本身并不直接支持多主模式(Multi-Master Replication),即多个数据库实例可以同时进行写操作,并且这些更改会自动同步到其他实例。不过,SQL Server 提供了多种高可用性和复制解决方案,可以实现类似多主模式的功能。以下是几种常见的方法: 1. Always On 可用性…

连锁餐饮行业数据可视化分析方案

引言 随着连锁餐饮行业的迅速发展,市场竞争日益激烈。企业需要更加精准地把握运营状况、消费者需求和市场趋势,以制定科学合理的决策,提升竞争力和盈利能力。可视化数据分析可以帮助连锁餐饮企业整合多源数据,通过直观、动态的可…

Zookeeper JavaAPI操作(Curator API常用操作)

构建项目 zk版本:3.5.7,引入4.0.0的curator版本,Curator依赖的版本只能比zookeeper依赖的版本高。 Curator简单介绍 Curator是Netflix公司开源的一套zookeeper客户端框架,解决了很多Zookeeper客户端非常底层的细节开发工作&…

可搜索的下拉选择框:filterable属性详解

在前端开发中,下拉选择框(Dropdown Select)是一个常见的UI组件,它允许用户从一组预定义的选项中选择一个或多个值。然而,当选项数量较多时,手动查找特定的选项可能会变得繁琐。为了解决这个问题&#xff0c…

精选9个自动化任务的Python脚本精选

大家好,我是老邓,今天我们来一起学习如何用Python进行一些常见的自动化操作,涉及文件处理、网络交互等实用技巧。即使你没有任何Python基础也没关系,我会用最通俗易懂的语言来讲解。 1. 对目录中的文件进行排序 import osdef so…

滑动窗口 + 算法复习

维护一个满足条件的窗口大小&#xff0c;然后进行双指针移动 1.最长子串 题目链接&#xff1a;1.最长子串 - 蓝桥云课 #include<bits/stdc.h> #define int long long using namespace std; string s; int k; signed main() {int max_len0,left0;cin>>s>>k;…

PDF书籍《手写调用链监控APM系统-Java版》第9章 插件与链路的结合:Mysql插件实现

本人阅读了 Skywalking 的大部分核心代码&#xff0c;也了解了相关的文献&#xff0c;对此深有感悟&#xff0c;特此借助巨人的思想自己手动用JAVA语言实现了一个 “调用链监控APM” 系统。本书采用边讲解实现原理边编写代码的方式&#xff0c;看本书时一定要跟着敲代码。 作者…

关于Vue的子组件改变父组件传来的值

一、组件直接传值 大家都知道父子组件传值的方案&#xff0c;有以下几个&#xff0c;不再详细敖述 Props&#xff1a;父组件向子组件传递数据 $emit&#xff1a;子组件通过自定义事件向父组件传递数据 .sync修饰符&#xff1a;一个方便且强大的工具&#xff0c;可以简化父子组…

Flink的Watermark水位线详解

一、Flink的时间语义 Flink有如下三种时间语义&#xff1a; Flink的三种时间语义-CSDN博客 在实际应用中&#xff0c;一般会采用事件时间语义。而正如前面所说的&#xff0c;事件时间语义需要等窗口的数据全部到齐了&#xff0c;才能进行窗口计算。那么&#xff0c;什么时候数…

ES学习Promise对象(九)

这里写目录标题 一、概念二、示例基本使用使用 Promise 对象封装Ajaxthen() 方法catch() 方法 一、概念 简单说就是一个容器&#xff0c;里面保存着某个未来才会结束的事件&#xff08;通常是一个异步操作&#xff09;的结果。Promise 是一个对象&#xff0c;Promise 提供统一…

Kibana:LINUX_X86_64 和 DEB_X86_64两种可选下载方式的区别

最近需要在vm&#xff08;操作系统是 Ubuntu 22.04.4 LTS&#xff0c;代号 Jammy。这是一个基于 x86_64 架构的 Linux 发行版&#xff09;上安装一个7.17.8版本的Kibana&#xff0c;并且不采用docker方式。 在下载的时候发现有以下两个选项&#xff0c;分别是 LINUX_X86_64 和 …

CMake 构建项目并整理头文件和库文件

本文将介绍如何使用 CMake 构建项目、编译生成库文件&#xff0c;并将头文件和库文件整理到统一的目录中以便在其他项目中使用。 1. 项目结构 假设我们正在构建一个名为 rttr 的开源库&#xff0c;初始的项目结构如下&#xff1a; D:\WorkCode\Demo\rttr-master\|- src\ …

【FAQ】HarmonyOS SDK 闭源开放能力 — Vision Kit(2)

1.问题描述&#xff1a; 人脸活体检测返回上一页App由沉浸式变为非沉浸式多了上下安全区域。 解决方案&#xff1a; 检测结束后需要自己去设置沉浸式配置。 2.问题描述&#xff1a; Vision Kit文字识别是本地识别&#xff0c;还是上传至服务器&#xff0c;由服务器来识别文…

AIA - IMSIC之二(附IMSIC处理流程图)

本文属于《 RISC-V指令集基础系列教程》之一,欢迎查看其它文章。 1 ​​​​​​​通过IMSIC接收外部中断的CSR 软件通过《AIA - 新增的CSR》描述的CSR来访问IMSIC。 machine level 的 CSR 与 IMSIC 的 machine level interrupt file 可相互互动;而 supervisor level 的 CSR…

Vue单页应用的配置

前面通过几篇文章了解并掌握了 Vue 项目构建及运行的前期工作 。接下来我们可以走进 Vue 项目的内部&#xff0c;一探其内部配置的基本构成。 1. 路由配置 由于 Vue 这类型的框架都是以一个或多个单页构成&#xff0c;在单页内部跳转并不会重新渲染 HTML 文件&#xff0c;其路…

CocosCreator-引擎案例-TS:spine

工程1&#xff1a;LoadSpine&#xff1a;简单加载spine资源 建立工程&#xff0c;在层级上建立一个空对象&#xff0c;改名spine 在spine上添加spine组件&#xff1a; 添加组件>渲染组件>spine 在spine上挂上脚本loadspine onLoad () {cc.resources.load(loadSpine/ali…

使用FreeNAS软件部署ISCSI的SAN架构存储(IP-SAN)练习题

一&#xff0c;实验用到工具分别为&#xff1a; VMware虚拟机&#xff0c;安装教程&#xff1a;VMware Workstation Pro 17 安装图文教程 FreeNAS系统&#xff0c;安装教程&#xff1a;FreeNAS-11.2-U4.1安装教程2024&#xff08;图文教程&#xff09; 二&#xff0c;新建虚…

【ANGULAR网站开发】初始环境搭建

1. 初始化angular项目 1.1 创建angular项目 需要安装npm和nodejs&#xff0c;这边不在重新安装 直接安装最新版本的angular npm install -g angular/cli安装指定大版本的angular npm install -g angular/cli181.2 启动angular 使用idea启动 控制台启动 ng serve启动成功…

lua debug相关方法详解

lua debug相关方法详解 1. debug.debug()2. debug.getinfo(func | level [, what])3. debug.getlocal(func-or-level, localindex)4. debug.setlocal(level, local_number, value)5. debug.getupvalue(func, upvalue_index)6. debug.setupvalue(func, upvalue_index, value)7. …