当前位置： 首页 > news >正文

JS设计模式（一）单例模式

news 2026/2/8 2:33:13

注释很详细，直接上代码

本文建立在已有JS面向对象基础的前提下，若无，请移步以下博客先行了解

JS面向对象（一）类与对象写法

特点和用途：
  • 全局访问点：通过单例模式可以在整个应用程序中访问同一个对象实例，而不要每次使用时都创建新的对象。
  • 节省资源：特别是在需要频繁创建和销毁对象时，单例模式可以减少内存和资源占用。
  • 数据共享：由于单例模式只有一个实例，可以确保数据在各个部分共享使用。

单例模式在开发中广泛应用，例如管理全局状态、配置信息、日志记录器等场景，确保整个应用程序中某个类只有一个实例是非常有用的

源码：

index.html

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title></head><body></body><script>class LoginForm {constructor() {this.state = "hide";}show() {if (this.state === "show") {alert("已经显示");return;}this.state = "show";console.log("登录框显示成功");}hide() {if (this.state === "hide") {alert("已经隐藏");return;}this.state = "hide";console.log("登录框隐藏成功");}}LoginForm.getInstance = (function () {let instance; //因为是闭包，这个标识可以存储在函数内部，所以这里可以保证实例的唯一性return function () {if (!instance) {instance = new LoginForm();}return instance;};})();let obj1 = LoginForm.getInstance();obj1.show();let obj2 = LoginForm.getInstance();//两次获取的实例是同一个obj2.hide();console.log(obj1 === obj2);//这里演示一下闭包的应用//--------------------------------------------------/*function myTest() {let sum = 0;return function add(num) {sum += num;console.log(sum);};}let add = myTest();add(1);add(2);let add2 = myTest();add2(5);add2(6);*/</script>
</html>

相关文章：

JS设计模式（一）单例模式

注释很详细&#xff0c;直接上代码 本文建立在已有JS面向对象基础的前提下&#xff0c;若无&#xff0c;请移步以下博客先行了解 JS面向对象&#xff08;一&#xff09;类与对象写法 特点和用途&#xff1a; 全局访问点&#xff1a;通过单例模式可以在整个应用程序中访问同一个…...

编程日记 2024/7/21 17:13:43

uniapp动态计算并设置元素高度

<template><view><scroll-view id"sv-box" :scroll-y"true" :style"{height:navHeightpx}"></scroll-view><view id"btn-box"><button>取消</button><button>确认</button><…...

编程日记 2024/7/21 17:11:41

直播架构如何设计核心节点和边缘节点

在直播架构中&#xff0c;核心节点和边缘节点的分工及主要服务是确保直播服务稳定、高效和可扩展的关键。以下是对这些节点的详细描述&#xff1a; 核心节点 核心节点通常位于数据中心&#xff0c;负责处理直播的主要逻辑和数据处理。其主要服务包括&#xff1a; 直播管理后…...

编程日记 2024/7/21 17:09:39

自动驾驶-预测概览

通过生成一条路径来预测一个物体的行为&#xff0c;在每一个时间段内&#xff0c;为每一辆汽车重新计算预测他们新生成的路径&#xff0c;这些预测路径为规划阶段做出决策提供了必要信息 预测路径有实时性的要求&#xff0c;预测模块能够学习新的行为。我们可以使用多源的数据…...

编程日记 2024/7/21 17:04:35

基于PSO算法优化PID参数的一些问题

目录 前言 Q1&#xff1a;惯性权重ω如何设置比较好&#xff1f;学习因子C1和C2如何设置&#xff1f; Q2&#xff1a;迭代速度边界设定一定能够遍历&#xff08;/覆盖&#xff09;整个PID参数二维空间范围吗&#xff1f;还是说需要与迭代次数相关&#xff1f;迭代次数越高&a…...

编程日记 2024/7/21 17:03:34

什么是决策树？

1. 什么是决策树&#xff1f; 决策树&#xff08;Decision Tree&#xff09;是一种常用的机器学习算法&#xff0c;用于解决分类和回归问题。它通过构建树结构来表示决策过程&#xff0c;分支节点表示特征选择&#xff0c;叶节点表示类别或回归值。 2. 决策树的组成部分 决策…...

编程日记 2024/7/21 16:59:28

ASP 快速参考

ASP 快速参考 概述 ASP&#xff08;Active Server Pages&#xff09;是一种由微软开发的服务器端脚本环境&#xff0c;用于动态网页设计和开发。它允许开发者创建和运行动态交互性网页&#xff0c;如访问数据库、发送电子邮件等。ASP页面通常以.asp为文件扩展名&#xff0c;并…...

编程日记 2024/7/21 16:57:26

(二)原生js案例之数码时钟计时

原生js实现的数字时间上下切换显示时间的效果&#xff0c;有参考相关设计&#xff0c;思路比较难&#xff0c;代码其实很简单 效果 代码实现 必要的样式 <style>* {padding: 0;margin: 0;}.content{/* text-align: center; */display: flex;align-items: center;justif…...

编程日记 2024/7/21 16:56:26

[CSS] 浮动布局的深入理解与应用

文章目录 浮动的简介元素浮动后的特点解决浮动产生的影响浮动后的影响解决浮动产生的影响 浮动相关属性实际应用示例示例1&#xff1a;图片与文字环绕示例2&#xff1a;多列布局示例3&#xff1a;响应式布局 总结 浮动布局是CSS中一种非常强大的布局方式&#xff0c;最初设计用…...

编程日记 2024/7/21 16:52:22

Linux云计算 |【第一阶段】ENGINEER-DAY2

主要内容&#xff1a; 磁盘空间管理fdisk、parted工具、开机自动挂载、文件系统、交换空间 KVM虚拟化 实操前骤&#xff1a; 1&#xff09;添加一块硬盘&#xff08;磁盘&#xff09;&#xff0c;需要关机才能进行操作&#xff0c;点击左下角【添加硬件】 2&#xff09;选择2…...

编程日记 2024/7/21 16:51:21

9.11和9.9哪个大？

没问题 文心一言 通义千问...

编程日记 2024/7/21 16:50:20

学懂C语言（十二）：C语言中的二进制原理及应用

目录 1. 二进制原理 1.1 什么是二进制&#xff1f; 1.2 如何在C语言中表示二进制&#xff1f; 2. 二进制的表示 2.1 二进制和其他进制的转换 2.2 C语言中的二进制表示 3. 二进制运算 3.1 位运算符 3.2 计算过程示例 4. 应用示例 4.1 使用位运算实现开关 5. 总结 C语…...

编程日记 2024/7/21 16:49:19

科研绘图系列：R语言雨云图（Raincloud plot）

介绍 雨云图（Raincloud plot）是一种数据可视化工具，它结合了多种数据展示方式，旨在提供对数据集的全面了解。雨云图通常包括以下几个部分： 密度图（Density plot）：表示数据的分布情况，密度图的曲线可以展示数据在不同数值区间的密度。箱线图（Box plot）：显示数据的中…...

编程日记 2024/7/21 16:48:17

优化教学流程和架构：构建高效学习环境的关键步骤

在教育领域&#xff0c;设计和优化教学流程和架构是提高学习效果和学生参与度的关键。本文将探讨如何通过合理的教学流程和有效的架构来构建一个高效的学习环境。 ### 1. 理解教学流程和架构的重要性 教学流程指的是教学活动的组织和顺序&#xff0c;而教学架构则是指支持教学…...

编程日记 2024/7/21 16:45:14

js | this 指向问题

https://juejin.cn/post/6844904083707396109 任何函数运行的时候&#xff0c;都会创建一个context对象&#xff0c;context对象有一个this对象&#xff0c;在运行的时候决定。任何函数都对应一个reference类结构体&#xff08;具体叫啥有点忘了&#xff09;&#xff0c;简单就…...

编程日记 2024/7/21 16:43:12

《昇思 25 天学习打卡营第 15 天 | 基于MindNLP+MusicGen生成自己的个性化音乐 》

《昇思 25 天学习打卡营第 15 天 | 基于MindNLPMusicGen生成自己的个性化音乐 》 活动地址&#xff1a;https://xihe.mindspore.cn/events/mindspore-training-camp 签名&#xff1a;Sam9029 MusicGen概述 MusicGen是由Meta AI的Jade Copet等人提出的一种基于单个语言模型&…...

编程日记 2024/7/21 16:38:04

Gitee 使用教程1-SSH 公钥设置

一、生成 SSH 公钥 1、打开终端&#xff08;Windows PowerShell 或 Git Bash&#xff09;&#xff0c;通过命令 ssh-keygen 生成 SSH Key&#xff1a; ssh-keygen -t ed25519 -C "Gitee SSH Key" 随后摁三次回车键&#xff08;Enter&#xff09; 2、查看生成的 SSH…...

编程日记 2024/7/21 16:37:03

理解Cookie、Session和Token

在现代Web开发中&#xff0c;用户身份认证和会话管理是至关重要的部分。理解Cookie、Session和Token的区别和应用场景&#xff0c;有助于我们设计出更加安全和高效的Web应用。本文将详细探讨这三者的工作原理、优缺点以及使用场景。 1. Cookie 1.1 什么是Cookie&#xff1f; …...

编程日记 2024/7/21 16:31:59

概率论原理精解【1】

文章目录 测度概述集类笛卡尔积定义例子 多集合的笛卡尔积定义计算方法注意事项 有限笛卡尔积的性质1. 定义2. 性质2.1 基数性质2.2 空集性质2.3 不满足交换律2.4 不满足结合律2.5 对并和交运算满足分配律 3. 示例4. 结论 参考链接 测度 概述 所谓测度&#xff0c;通俗的讲就…...

编程日记 2024/7/21 16:23:49

数据结构（二叉树-1）

文章目录 一、树 1.1 树的概念与结构 1.2 树的相关术语 1.3 树的表示 二、二叉树 2.1 二叉树的概念与结构 2.2特殊的二叉树 满二叉树 完全二叉树 2.3 二叉树的存储结构 三、实现顺序结构二叉树 3.1 堆的概念与结构 3.2 堆的实现 Heap.h Heap.c 默认初始化堆 堆的销毁 堆的插入 …...

编程日记 2024/7/21 16:22:47

Vue记事本应用实现教程

文章目录 1. 项目介绍2. 开发环境准备3. 设计应用界面4. 创建Vue实例和数据模型5. 实现记事本功能5.1 添加新记事项5.2 删除记事项5.3 清空所有记事 6. 添加样式7. 功能扩展&#xff1a;显示创建时间8. 功能扩展&#xff1a;记事项搜索9. 完整代码10. Vue知识点解析10.1 数据绑…...

编程新知 2025/9/20 5:20:12

7.4.分块查找

一.分块查找的算法思想&#xff1a; 1.实例&#xff1a; 以上述图片的顺序表为例&#xff0c; 该顺序表的数据元素从整体来看是乱序的&#xff0c;但如果把这些数据元素分成一块一块的小区间&#xff0c; 第一个区间[0,1]索引上的数据元素都是小于等于10的&#xff0c; 第二…...

编程新知 2026/1/27 18:11:42

8k长序列建模，蛋白质语言模型Prot42仅利用目标蛋白序列即可生成高亲和力结合剂

蛋白质结合剂&#xff08;如抗体、抑制肽&#xff09;在疾病诊断、成像分析及靶向药物递送等关键场景中发挥着不可替代的作用。传统上&#xff0c;高特异性蛋白质结合剂的开发高度依赖噬菌体展示、定向进化等实验技术&#xff0c;但这类方法普遍面临资源消耗巨大、研发周期冗长…...

编程新知 2026/1/25 13:18:12

【HarmonyOS 5.0】DevEco Testing：鸿蒙应用质量保障的终极武器

——全方位测试解决方案与代码实战 一、工具定位与核心能力 DevEco Testing是HarmonyOS官方推出的​​一体化测试平台​​&#xff0c;覆盖应用全生命周期测试需求&#xff0c;主要提供五大核心能力&#xff1a; ​​测试类型​​​​检测目标​​​​关键指标​​功能体验基…...

编程新知 2026/1/28 8:17:53

大数据零基础学习day1之环境准备和大数据初步理解

学习大数据会使用到多台Linux服务器。 一、环境准备 1、VMware 基于VMware构建Linux虚拟机 是大数据从业者或者IT从业者的必备技能之一也是成本低廉的方案 所以VMware虚拟机方案是必须要学习的。 &#xff08;1&#xff09;设置网关 打开VMware虚拟机&#xff0c;点击编辑…...

编程新知 2026/1/25 14:43:07

汽车生产虚拟实训中的技能提升与生产优化​

在制造业蓬勃发展的大背景下&#xff0c;虚拟教学实训宛如一颗璀璨的新星&#xff0c;正发挥着不可或缺且日益凸显的关键作用&#xff0c;源源不断地为企业的稳健前行与创新发展注入磅礴强大的动力。就以汽车制造企业这一极具代表性的行业主体为例&#xff0c;汽车生产线上各类…...

编程新知 2026/1/27 7:46:36

vue3 定时器-定义全局方法 vue+ts

1.创建ts文件 路径&#xff1a;src/utils/timer.ts 完整代码&#xff1a; import { onUnmounted } from vuetype TimerCallback (...args: any[]) > voidexport function useGlobalTimer() {const timers: Map<number, NodeJS.Timeout> new Map()// 创建定时器con…...

编程新知 2025/8/9 0:31:20

今日科技热点速览

&#x1f525; 今日科技热点速览 &#x1f3ae; 任天堂Switch 2 正式发售 任天堂新一代游戏主机 Switch 2 今日正式上线发售&#xff0c;主打更强图形性能与沉浸式体验&#xff0c;支持多模态交互&#xff0c;受到全球玩家热捧 。 &#x1f916; 人工智能持续突破 DeepSeek-R1&…...

编程新知 2025/11/20 14:26:29

第 86 场周赛：矩阵中的幻方、钥匙和房间、将数组拆分成斐波那契序列、猜猜这个单词

Q1、[中等] 矩阵中的幻方 1、题目描述 3 x 3 的幻方是一个填充有 从 1 到 9 的不同数字的 3 x 3 矩阵&#xff0c;其中每行&#xff0c;每列以及两条对角线上的各数之和都相等。 给定一个由整数组成的row x col 的 grid&#xff0c;其中有多少个 3 3 的 “幻方” 子矩阵&am…...

编程新知 2026/2/7 13:27:36

有限自动机到正规文法转换器v1.0

1 项目简介 这是一个功能强大的有限自动机&#xff08;Finite Automaton, FA&#xff09;到正规文法&#xff08;Regular Grammar&#xff09;转换器&#xff0c;它配备了一个直观且完整的图形用户界面&#xff0c;使用户能够轻松地进行操作和观察。该程序基于编译原理中的经典…...

编程新知 2026/1/31 13:13:32