JavaScript单例模式详解与实现方法

有志者，事竟成！如果你在学习文章，那么本文《JavaScript单例模式实现方法【教程】》，就很适合你！文章讲解的知识点主要包括，若是你对本文感兴趣，或者是想搞懂其中某个知识点，就请你继续往下看吧~

JavaScript单例需手动控制唯一实例，不能依赖new；正确做法是用闭包、静态属性或模块导出缓存实例，避免构造函数内return无效拦截，注意延迟初始化、参数处理及HMR/测试兼容性。

JavaScript 中没有原生的“单例类”语法，所谓单例，本质是**手动控制一个构造函数只返回同一个实例对象**；它不是靠语言机制保证，而是靠开发者用闭包、静态属性或模块作用域来实现。

为什么 new Singleton() 每次都返回新对象？

因为 JavaScript 的 new 关键字默认总会创建新实例。单例必须绕过这个行为——要么不暴露构造函数，要么在构造函数内部拦截重复初始化逻辑。

• 直接写 class Singleton { constructor() { this.id = Math.random(); } }，每次 new Singleton() 都是全新对象
• 常见错误：在构造函数里加 if (instance) return instance —— 无效，return 对 new 的返回值无影响
• 正确思路：把实例缓存到外部作用域，对外只暴露获取实例的方法（如静态 getInstance）

三种可靠实现方式及适用场景

选择哪种取决于你是否需要延迟初始化、是否要支持参数传入、以及是否在模块化环境里运行。

• 闭包 + 静态方法：最经典，兼容所有环境
  const Singleton = (function() { let instance; return { getInstance() { if (!instance) instance = { data: [] }; return instance; } }; })();
• ES6 class + 静态属性：语义清晰，但首次加载即初始化（非懒加载）
  class Singleton { static instance = new Singleton(); constructor() { if (Singleton.instance) return Singleton.instance; Object.assign(this, { id: Date.now() }); } }
• 模块顶层导出：现代项目首选，利用 ES 模块的单例天然性
  // singleton.js
export const instance = { data: [], init() { /* only runs once */ } };，任何地方 import { instance } 都拿到同一引用

getInstance() 带参数时怎么处理？

如果单例需要初始化配置（比如 API 地址），不能让后续调用覆盖已初始化的状态，否则破坏单例语义。

• 第一次调用 getInstance(config) 才真正初始化，之后再调用忽略参数
• 避免把 config 存在实例上后又被改写：用 Object.freeze() 锁定配置对象
• 更稳妥做法：把配置提取到工厂函数中，单例本身保持无参，例如：const createApiSingleton = (baseUrl) => ({ request() { /* use baseUrl */ } });，然后缓存该函数返回的对象

最容易被忽略的是：单例和模块热更新（HMR）、测试隔离、多实例需求之间的冲突。比如在 Jest 测试中反复 require 模块，若用模块顶层导出，可能拿到旧实例；这时得配合 jest.resetModules() 或改用工厂封装。

今天带大家了解了的相关知识，希望对你有所帮助；关于文章的技术知识我们会一点点深入介绍，欢迎大家关注golang学习网公众号，一起学习编程~