一文读懂JS闭包与单例模式，让你的代码更加稳健

前端

2023-10-31 16:26:51

JavaScript闭包和单例模式：代码设计的利刃

在JavaScript的世界里，闭包和单例模式是两把锋利的刀刃，帮助你打造稳健而灵活的代码。本文将深入探究这两种模式的奥秘，并指导你将其应用于你的项目中。

闭包：超越时间的变量

闭包是一种神奇的技术，让你访问函数内部的变量，即使函数已执行完毕。它通过嵌套函数来实现，内层函数可以访问外层函数的作用域，包括变量和参数。

闭包的用途广泛，比如：

保存状态： 闭包可以保存函数执行过程中的状态，即使函数已执行完毕。这使得实现计数器或计时器之类的功能成为可能。
创建私有变量： 闭包可以创建私有变量，只能由函数内部访问。这样可以保护敏感数据或实现封装。
实现延迟执行： 闭包可以实现延迟执行，即函数在一段时间后执行。这适用于实现动画或滚动事件处理程序之类的功能。

单例模式：只有一个就好

单例模式是一种设计模式，确保一个类只有一个实例。它通过使用静态变量实现，该变量在类的所有实例之间共享，只有一个实例可以访问它。

单例模式的应用范围也很广，例如：

创建全局对象： 单例模式可以创建全局对象，可以在应用程序的任何位置访问。这有助于实现日志记录或配置之类的功能。
实现资源池： 单例模式可以实现资源池，由应用程序中的多个对象共享。这可以提高性能并防止资源泄漏。
实现线程安全： 单例模式可以实现线程安全，即确保一个对象只能由一个线程访问。这可以防止数据损坏或竞争条件。

将闭包和单例模式应用到你的代码中

闭包和单例模式可以应用于各种场景。以下是一些具体示例：

闭包：保存表单数据

// 闭包来保存表单数据
const saveFormData = (formId) => {
  const form = document.getElementById(formId);
  const data = {};

  const inputs = form.querySelectorAll('input, select, textarea');
  for (const input of inputs) {
    data[input.name] = input.value;
  }

  return data;
};

单例模式：创建全局配置对象

// 单例模式：全局配置对象
class Configuration {
  static instance = null;

  constructor() {
    if (Configuration.instance) {
      return Configuration.instance;
    }

    Configuration.instance = this;

    this.settings = {
      // 你的配置设置
    };
  }

  getSetting(key) {
    return this.settings[key];
  }

  setSetting(key, value) {
    this.settings[key] = value;
  }
}