Singleton Pattern Use Cases and Examples in JavaScript and TypeScript

3.2.4 Use Cases and Examples

The Singleton pattern is a creational design pattern that ensures a class has only one instance and provides a global point of access to it. This pattern is particularly useful in scenarios where a single object needs to coordinate actions across a system. Let’s delve into some real-world use cases and examples where the Singleton pattern shines, especially in JavaScript and TypeScript environments.

Understanding the Singleton Pattern

Before we dive into specific use cases, let’s briefly recap what the Singleton pattern is and why it’s useful. The Singleton pattern restricts the instantiation of a class to one “single” instance. This is beneficial when exactly one object is needed to coordinate actions across the system.

Key Characteristics of the Singleton Pattern

• Single Instance: Only one instance of the class is created.
• Global Access: Provides a global point of access to the instance.
• Lazy Initialization: The instance is created only when it is needed.

Real-World Use Cases

Let’s explore some scenarios where the Singleton pattern is commonly applied:

1. Logging Systems

In many applications, logging is a critical component. A logging system needs to be consistent and accessible throughout the application. Using a Singleton ensures that all parts of the application log messages in a uniform manner.

JavaScript Example:

class Logger {
  constructor() {
    if (Logger.instance) {
      return Logger.instance;
    }
    this.logs = [];
    Logger.instance = this;
  }

  log(message) {
    const timestamp = new Date().toISOString();
    this.logs.push(`${timestamp} - ${message}`);
    console.log(`${timestamp} - ${message}`);
  }

  printLogCount() {
    console.log(`${this.logs.length} logs`);
  }
}

const logger1 = new Logger();
const logger2 = new Logger();

logger1.log("First log message");
logger2.log("Second log message");

logger1.printLogCount(); // Output: 2 logs
logger2.printLogCount(); // Output: 2 logs

TypeScript Example:

class Logger {
  private static instance: Logger;
  private logs: string[] = [];

  private constructor() {}

  public static getInstance(): Logger {
    if (!Logger.instance) {
      Logger.instance = new Logger();
    }
    return Logger.instance;
  }

  public log(message: string): void {
    const timestamp = new Date().toISOString();
    this.logs.push(`${timestamp} - ${message}`);
    console.log(`${timestamp} - ${message}`);
  }

  public printLogCount(): void {
    console.log(`${this.logs.length} logs`);
  }
}

const logger1 = Logger.getInstance();
const logger2 = Logger.getInstance();

logger1.log("First log message");
logger2.log("Second log message");

logger1.printLogCount(); // Output: 2 logs
logger2.printLogCount(); // Output: 2 logs

2. Configuration Managers

Applications often require a centralized configuration manager to handle settings and preferences. A Singleton can ensure that all parts of the application use the same configuration settings.

JavaScript Example:

class ConfigurationManager {
  constructor() {
    if (ConfigurationManager.instance) {
      return ConfigurationManager.instance;
    }
    this.config = {};
    ConfigurationManager.instance = this;
  }

  set(key, value) {
    this.config[key] = value;
  }

  get(key) {
    return this.config[key];
  }
}

const config1 = new ConfigurationManager();
const config2 = new ConfigurationManager();

config1.set('apiUrl', 'https://api.example.com');
console.log(config2.get('apiUrl')); // Output: https://api.example.com

TypeScript Example:

class ConfigurationManager {
  private static instance: ConfigurationManager;
  private config: { [key: string]: any } = {};

  private constructor() {}

  public static getInstance(): ConfigurationManager {
    if (!ConfigurationManager.instance) {
      ConfigurationManager.instance = new ConfigurationManager();
    }
    return ConfigurationManager.instance;
  }

  public set(key: string, value: any): void {
    this.config[key] = value;
  }

  public get(key: string): any {
    return this.config[key];
  }
}

const config1 = ConfigurationManager.getInstance();
const config2 = ConfigurationManager.getInstance();

config1.set('apiUrl', 'https://api.example.com');
console.log(config2.get('apiUrl')); // Output: https://api.example.com

3. Connection Pools

In database-driven applications, managing connections efficiently is crucial. A Singleton can manage a pool of connections, ensuring that connections are reused and not created unnecessarily.

JavaScript Example:

class ConnectionPool {
  constructor() {
    if (ConnectionPool.instance) {
      return ConnectionPool.instance;
    }
    this.connections = [];
    ConnectionPool.instance = this;
  }

  getConnection() {
    if (this.connections.length === 0) {
      const newConnection = {}; // Simulate a new connection
      this.connections.push(newConnection);
      return newConnection;
    }
    return this.connections.pop();
  }

  releaseConnection(connection) {
    this.connections.push(connection);
  }
}

const pool1 = new ConnectionPool();
const pool2 = new ConnectionPool();

const conn1 = pool1.getConnection();
pool2.releaseConnection(conn1);

console.log(pool1 === pool2); // Output: true

TypeScript Example:

class ConnectionPool {
  private static instance: ConnectionPool;
  private connections: any[] = [];

  private constructor() {}

  public static getInstance(): ConnectionPool {
    if (!ConnectionPool.instance) {
      ConnectionPool.instance = new ConnectionPool();
    }
    return ConnectionPool.instance;
  }

  public getConnection(): any {
    if (this.connections.length === 0) {
      const newConnection = {}; // Simulate a new connection
      this.connections.push(newConnection);
      return newConnection;
    }
    return this.connections.pop();
  }

  public releaseConnection(connection: any): void {
    this.connections.push(connection);
  }
}

const pool1 = ConnectionPool.getInstance();
const pool2 = ConnectionPool.getInstance();

const conn1 = pool1.getConnection();
pool2.releaseConnection(conn1);

console.log(pool1 === pool2); // Output: true

Implications of Using Singletons

While the Singleton pattern is useful, it comes with certain implications, especially in multi-threaded or asynchronous environments.

Multi-threaded Environments

In multi-threaded environments, ensuring that only one instance of a Singleton is created can be challenging. This is because multiple threads might attempt to create an instance simultaneously. To address this, consider using locks or other synchronization mechanisms.

Asynchronous Environments

JavaScript and TypeScript often operate in asynchronous environments, such as web applications. In such cases, ensure that the Singleton instance is initialized before it is accessed. This can be achieved using promises or async/await patterns.

When to Use the Singleton Pattern

The Singleton pattern is best used when:

• A single instance is required: When only one instance of a class is needed to control actions across the system.
• Global access is necessary: When a global point of access is required.
• Resource management: When managing resources like connections or configurations that should be shared across the application.

Alternatives to the Singleton Pattern

While the Singleton pattern is useful, it’s not always the best choice. Consider alternatives when:

• Testing is a priority: Singletons can make unit testing challenging due to their global state.
• Flexibility is needed: If you need multiple instances in the future, a Singleton might limit flexibility.
• Dependency injection: Using dependency injection can provide more flexibility and testability compared to Singletons.

Visualizing Singleton Pattern

To better understand how the Singleton pattern works, let’s visualize it using a class diagram.

    classDiagram
	    class Singleton {
	        -static instance: Singleton
	        -constructor()
	        +static getInstance(): Singleton
	        +operation()
	    }
	    Singleton o-- Singleton : uses

Diagram Description: The diagram illustrates a Singleton class with a static instance variable and a private constructor. The getInstance method ensures that only one instance of the Singleton class is created.

Try It Yourself

Experiment with the Singleton pattern by modifying the code examples provided:

• Add new methods: Extend the Singleton classes with additional methods to see how they behave.
• Simulate multi-threading: Use JavaScript’s setTimeout or setInterval to simulate concurrent access to the Singleton instance.
• Implement a new use case: Try implementing a Singleton for a different use case, such as a cache manager or a user session manager.

Knowledge Check

• Question: Why is the Singleton pattern useful in logging systems?
• Exercise: Modify the ConfigurationManager example to include a method that returns all configuration keys.

Embrace the Journey

Remember, mastering design patterns like the Singleton is just the beginning. As you progress, you’ll build more complex and efficient applications. Keep experimenting, stay curious, and enjoy the journey!

Quiz Time!