Regarding Module Pattern in JavaScript

Question

i just read a small article on code project for Module Pattern in Java Script. after reading javascript code few area was not very clear the way code has been written. i wrote javascript but i am not familiar with writing javascript in advance way. here is the url which i read from codeproject http://www.codeproject.com/Articles/619747/Module-Pattern-in-Java-Script-in-Depth

1) // A function that generates a new function for adding numbers

function addGenerator(num) {
    // Return a simple function for adding two numbers
    // with the first number borrowed from the generator
    return function (toAdd) {
        return num + toAdd
    };
}
// addFive now contains a function that takes one argument,
// adds five to it, and returns the resulting number
var addFive = addGenerator(5);
// We can see here that the result of the addFive function is 9,
// when passed an argument of 4
alert(addFive(4) == 9);   // Which return true

when addGenerator is calling then 5 has been passed as argument but i just do not understand this line that how it works

return function (toAdd) {
        return num + toAdd
    };

what addGenerator(5) will return ?

how this will return true --> alert(addFive(4) == 9); // Which return true

2)

var EmployeeModule = (function (my) {
                my.anotherFunction = function () {
                    return alert('this is another function.');
                };
            } (EmployeeModule));

how the above code will work & will be invoke ? please expalin in detail what they are trying to do?

3)

var EmployeeModule = (function (my) {
    // add functionality...
    return my;
}(EmployeeModule || {}));

i just do not understand this line (EmployeeModule || {})) please explain the meaning of this line.

4) Global Import in Module Pattern

We can also import other java script libraries in our Module

(function ($, Y) {
    // now have access to globals jQuery (as $) and YAHOO (as Y) in this code
}(jQuery, YAHOO));

Sub-modules in Module Pattern

There are many cases where we can create sub-modules. It is just like creating a regular module Collapse | Copy Code

EmployeeModule.subModule = (function () {
    var my = {};
    // ...
    return my;
}());

looking for good explanation for the above code point wise with more example for better explanation. thanks

Answer 1

I don't use the module pattern often, so I am not able to answer all of your questions on this subject. I want to address your question regarding EmployeeModule || {}

I think it is easier to understand what that means in a regular context not using the module pattern. Consider this.

var foo = foo || {};

This is checking to see if foo exists already. If so, we don't overwrite, we just set it equal to itself...the same as this:

var foo = {bar:'value'};
var foo = foo;

If foo doesn't exists, then we're creating a new object, like this:

var foo = {};

So, the code says "foo equals the previous foo (if foo is already something) OR a new object (if foo ISN'T already something)"

In your example, EmployeeModule || {} is being passed into the instantly invoked function expression as a parameter called my. If EmployeeModule is something, that gets set to my. If EmployeeModule is nothing, then the value of my is a new object.