paint-brush
A Quick Module Design Pattern Example in JavaScriptby@sirius93
5,544 reads
5,544 reads

A Quick Module Design Pattern Example in JavaScript

by Nandan KumarAugust 30th, 2023
Read on Terminal Reader
Read this story w/o Javascript
tldt arrow

Too Long; Didn't Read

Module Design Pattern is a way to encapsulate and organize code in a self-containing module that can expose certain functionalities.
featured image - A Quick Module Design Pattern Example in JavaScript
Nandan Kumar HackerNoon profile picture


Module Design Pattern is a way to encapsulate and organize code in a self-containing module that can expose certain functionalities while keeping the rest of the code private.


This helps prevent variable and function name clashes, improves code maintainability, and promotes the concept of separation of concerns.


Here's an example of how you can implement the Module Design Pattern in JavaScript:

// Module using the Module Design Pattern
var Module = (function() {
  // Private variable
  var privateVariable = "I am a private variable";

  // Private function
  var privateFunction = function privateFunction() {
    console.log("This is a private function");
  }

  // Public function
  var publicFunction = function() {
      console.log("This is a public function");
  }
  // Public interface
  return {
    publicFunction:publicFunction,
    // Public variable accessing private variable
    publicVariable: privateVariable
  };
})();

// Usage of the module
console.log(Module.publicVariable); // Output: "I am a private variable"
Module.publicFunction(); // Output: "This is a public function"

// Trying to access private members directly (will result in an error)
console.log(Module.privateVariable); // Output: undefined
Module.privateFunction(); // Output: Uncaught TypeError: MyModule.privateFunction is not a function


In the above example, we've created a module called Module using an Immediately Invoked Function Expression (IIFE). Inside the IIFE, we define private variables and functions that are not accessible from outside the module. We then return an object containing the public members (functions and variables) that we want to expose.


Benefits of the Module Design Pattern:


  1. Encapsulation: Private members are not accessible from outside the module, which helps prevent unintended modifications or conflicts with other parts of the codebase.


  2. Organization: Code is organized into logical modules, making it easier to manage and understand.


  3. Namespacing: The module acts as a namespace, reducing the chances of naming collisions in a global scope.


  4. Reusability: Modules can be easily reused in different parts of your application or different projects.


  5. Maintenance: Separation of concerns and encapsulation make it easier to maintain and refactor code.


That's a concise explanation of the module design pattern in Javascript.


Feel free to comment on how you like my blog or shoot me an email at [email protected] If you have any queries, and I will try to answer.


You can also visit my website to read some of the articles at nandan.dev


Stay tuned & connect with me on my social media channels. Make sure to subscribe to my newsletter to get regular updates on my upcoming posts.


Twitter | Instagram | Github | Website


Also published here.