The javascript module pattern

Please do not confuse this with modules that you import or export!

Key background knowledge :

• use of _ for private methods/properties
• IIFE
• factory functions (see part1)

What is the javascript module pattern?

The module is very similar to a factory function where instead you make lots of objects, the module is wrapped in an IIFE and is given closure.

So how do we create a module?

(function() {
    // Any code here
  // All function and variables are scoped to this function
})();

This function is immediately invoked(called)

Lets create a usuable module.

const jsModule = (function() {
      const publicMethod = () =>  console.log('Hello World!');
    return {publicMethod}
})();

jsModule.publicMethod(); // outputs 'Hello World'

Even though it is immediately invoked we can still access its methods (via the return)

However a real good use of these IIFE type modules is make methods private.

const myModule = (function() {
  const _privateProperty = 'Hello World';

  const _privateMethod =() => console.log(_privateProperty);

  const publicMethod = () =>_privateMethod()
    return {publicMethod}

})();

myModule.publicMethod(); // outputs 'Hello World'
console.log(myModule._privateProperty); // is undefined protected by the module closure
myModule._privateMethod(); // is TypeError protected by the module closure

Even though the public method uses private methods we can any methods we return.

However see what happens when we try to access private properties and methods!

This gives us a way to create private methods and state!

The revealing module pattern

This is a popular way to use modules to organise code and to reveal properties and methods we want to make public

Example of the revealing module pattern:

const myModule = (function() {
  const _privateProperty = 'Hello World, I am a very private property';
  const publicProperty = 'I am a public property';

  const _privateMethod =() =>  console.log(_privateProperty)   

  const publicMethod = ()=> _privateMethod()
  return {publicMethod,publicProperty};
})();

myModule.publicMethod(); // 'Hello World....'
console.log(myModule.publicProperty); // 'I am a public property'
console.log(myModule._privateProperty); // is undefined protected by the module closure
myModule._privateMethod(); // is TypeError protected by the module closure

You can have as many private/public methods you want.

So when do we use these modules?

Well if you were making a game, you would use the module pattern to load up anything you only wanted loading up once. For example any battle rules , the board game etc..

Then you would use factory functions/constructors for anything you need to make various copies of, say the players or the battles

Another added benefit

Since all the methods are nicely organised in the IIFE, they are also namespaced too.

For example if you had a method called battle, to call 'battle' you would have to use start.battle() or boss.battle() etc so these methods would not get confused

Conclusion

The module pattern is another great tool to have in your organising javascript box

• Immediately invoked when loading (good for API!)

• We can still access any methods that are returned in the module

• Can be used to make method/properties private

• Helps with the naming of methods/functions