Module Pattern

What is Module Pattern?

• A design pattern
• Basically a closure wrapped in an IIFE
• Useful for isolating code
• Your code gets:
  • well structured
  • makes scoping easy
  • easier to build
  • readable
  • easier to maintain

Anonymous Module

• Starts with a capital
• Declared in the global scope
• Can be called whenever you want
• Can be passed on to another Module

// Declared in the global scope

var Module = (function () {
  // Place code here
})();

Private methods

• Anything you don't want to be visible outside the scope
   
• Call it outside of your module and you will get an error

var Module = (function () {
  
  // privateMethod is locally declared inside the new scope
  var privateMethod = function () {
    // Do something
  };

})();

Module.privateMethod(); 
//"TypeError: Cannot read property 'privateMethod' of undefined

Return

• By returning an Object to the Module, the Object will be accessible from the Module's namespace.

// Returning an Object with a function as a property

var Module = (function () {
  
  return {
    publicMethod: function () {
      // code
    }
  };

})();

Module.publicMethod();

Return

• Object literal syntax

var myObjectLiteral = {
  name: 'Tiety',
  method: function () {
    console.log(this.name);
  }
};

myObjectLiteral.method();
// console.log: 'Tiety'

Return

• Anonymous Object Literal return

var Module = (function () {

  var privateMethod = function () {};
  
  return {
    publicMethodOne: function () {
        // I can call privateMethod()
    },

    publicMethodTwo: function () {
        // code
    },
  };

})();

Return

• Locally scoped Object Literal

var Module = (function () {

  // locally scoped Object
  var myObject = {};

  // declared using var => stays private
  var privateMethod = function () {};

  myObject.publicMethod = function () {
    // method of the locally scoped Object
  };
  
  return myObject;

})();

Return

• Stacked locally scoped Object Literal

var Module = (function () {

  var privateMethod = function () {};

  var myObject = {
    publicMethodOne:  function () {

    },
    publicMethodTwo:  function () {
      
    }
  };
  
  return myObject;

})();

"Revealing" Module Pattern

What is "Revealing" Module Pattern?

• A design pattern
• Variant on the module pattern
• Reveals public pointers to methods inside the Module’s scope
• Your code gets:
  • good structure
  • readable
  • easier to manage
  • easy to see whats public/private

Revealing Module Pattern

var Module = (function () {

  var privateMethod = function () {
    // private
  };

  var someMethod = function () {
    // public
  };

  var anotherMethod = function () {
    // public
  };
  
  return {
    someMethod: someMethod,
    anotherMethod: anotherMethod
  };

})();

• Syntax

Revealing Module Pattern

var Module = (function () {

  var privateMethod = function (message) {
    console.log(message);
  };

  var publicMethod = function (text) {
    privateMethod(text);
  };
  
  return {
    publicMethod: publicMethod
  };

})();

// Example of passing data into a private method
// the private method will then `console.log()` 'Hello!'
Module.publicMethod('Hello!');

• Using private methods

Revealing Module Pattern

var Module = (function () {

  var privateArray = [];

  var publicMethod = function (somethingOfInterest) {
    privateArray.push(somethingOfInterest);
  };
  
  return {
    publicMethod: publicMethod
  };

})();

• Using private variables

Revealing Module Pattern

var Module = (function () {

  var _privateMethod = function () {
    // private stuff
  };

  var publicMethod = function () {
    _privateMethod();
  };
  
  return {
    publicMethod: publicMethod
  };

})();

• Naming convention private methods/variables

'_' prefix