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

JS设计模式(一)单例模式

注释很详细,直接上代码

本文建立在已有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;通过单例模式可以在整个应用程序中访问同一个…...

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

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

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

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

自动驾驶-预测概览

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

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

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

什么是决策树?

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

ASP 快速参考

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

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

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

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

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

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

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

9.11和9.9哪个大?

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

学懂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语…...

科研绘图系列:R语言雨云图(Raincloud plot)

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

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

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

js | this 指向问题

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

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

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

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…...

理解Cookie、Session和Token

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

概率论原理精解【1】

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

数据结构(二叉树-1)

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

CocoaPods终极版本管理指南:掌握语义化版本控制与依赖锁定策略

CocoaPods终极版本管理指南&#xff1a;掌握语义化版本控制与依赖锁定策略 【免费下载链接】CocoaPods The Cocoa Dependency Manager. 项目地址: https://gitcode.com/gh_mirrors/co/CocoaPods CocoaPods是iOS和macOS开发中最受欢迎的依赖管理器&#xff0c;它通过智能…...

收藏!小白程序员必看:详解7种RAG分块策略,轻松提升大模型检索效果

收藏&#xff01;小白程序员必看&#xff1a;详解7种RAG分块策略&#xff0c;轻松提升大模型检索效果 本文深入解析了RAG系统中7种主流分块策略&#xff0c;包括固定大小、语义、递归、文档结构、智能体、句子和段落分块。强调了分块策略对检索增强生成&#xff08;RAG&#xf…...

MegaParse:一站式文档解析库的设计原理与工程实践

1. 项目概述&#xff1a;从“MegaParse”看文档解析的“大”与“全”在信息爆炸的时代&#xff0c;我们每天都要处理海量的文档——PDF报告、Word合同、Excel表格、PPT演示稿&#xff0c;甚至网页截图和扫描件。对于开发者、数据分析师和知识管理从业者来说&#xff0c;如何将这…...

AI时代工程师的超能力进化

好的&#xff0c;这是一篇关于AI时代工程师能力进化的技术文章大纲&#xff1a; 标题&#xff1a; AI时代工程师的“超能力”进化论&#xff1a;从工具使用者到智能架构师 导言&#xff1a; 简述AI技术的迅猛发展及其对各行业的深刻影响。提出问题&#xff1a;在AI成为强大“…...

OpenClaw引发AI Agent狂欢,深圳机密计算科技打造全链路安全基座

OpenClaw&#xff1a;AI Agent狂欢的导火索当AI Agent从实验室走向产业爆发&#xff0c;技术革命与安全危机正同步抵达临界点。2026年初&#xff0c;OpenClaw横空出世&#xff0c;彻底点燃了全球AI Agent的狂欢。它仅用60天&#xff0c;便打破React保持十年的GitHub Star纪录&a…...

中国半导体产业崛起:资本驱动下的存储器攻坚与全产业链布局

1. 行业格局的十字路口&#xff1a;当西方整合遇上东方崛起最近几年&#xff0c;半导体行业的头条新闻几乎被一系列重磅并购案所占据&#xff1a;恩智浦收购飞思卡尔、安华高并购博通、英特尔鲸吞阿尔特拉。这些动辄数百亿美元的巨无霸交易&#xff0c;背后传递出一个清晰的信号…...

Python 爬虫高级实战:爬虫接口限流自适应调节

前言 网络目标站点普遍具备严格的接口访问限流、频率校验、IP 频次风控、接口令牌校验等防护机制&#xff0c;常规固定延时、固定并发的爬虫模式极易触发封禁、接口 429 限流、会话失效、IP 拉黑等问题。人工配置延时、手动调整并发阈值的传统方式&#xff0c;无法适配站点动态…...

【Oracle数据库指南】第06篇:Oracle DML语句与事务控制——数据操作与ACID特性深度解析

上一篇【第05篇】Oracle子查询与集合操作——嵌套查询与结果合并全解析 下一篇【第07篇】SQL*Plus基础——登录、环境设置与缓冲区操作 摘要 本文全面讲解Oracle DML&#xff08;数据操作语言&#xff09;语句&#xff0c;包括INSERT、UPDATE、DELETE和MERGE的详细用法&#x…...

书匠策AI课程论文一键生成?我替你们踩了一遍,真香预警!

各位论文困难户们&#xff0c;先别划走&#xff01; 今天不聊别的&#xff0c;就聊一个让我这个老博主都直呼"离谱"的东西——书匠策AI的课程论文功能。我知道你们一看到AI写论文就条件反射觉得是割韭菜&#xff0c;但这次&#xff0c;我是真的被圈粉了。 先说结论…...

雨夜便利店的光,刚好够照亮你这一秒的疲惫

雨声比闹钟更懂你凌晨一点十七分&#xff0c;耳机里循环着一首没名字的 lo-fi beat&#xff0c;窗外的雨没停&#xff0c;也没下大&#xff0c;就那么轻轻敲着空调外机和生锈的铁皮棚。你站在楼道口犹豫要不要出门买泡面&#xff0c;其实不是饿&#xff0c;是心里空了一小块&am…...