3
    var AppName = (function (parent, $) {
      var controller = parent.controller = parent.controller || {};

      controller.index_page = function (parent) {
        var createPage = parent.createPage = parent.createPage || {};

        createPage.init = function () {
          alert('javascript initialized');
        };
        return createPage;
      }(controller);

      return parent;
    }(AppName || {}, jQuery));  

Which type of Javascript Pattern is it? Where can I find more info about it?

2
  • @Bergi before you add this as duplicate check the date on which the question is asked.
    – Saanch
    Oct 28, 2014 at 8:46
  • How does the date matter for whether a question is about the same topic and the quality of the answers?
    – Bergi
    Oct 28, 2014 at 13:02

4 Answers 4

8

This is called the module pattern (at least thats the name I know it by).

http://www.adequatelygood.com/JavaScript-Module-Pattern-In-Depth.html

Some benefits of this pattern include:

  • Encapsulation, giving you the ability to define private fields in your closure.

  • You can make sure that the undefined value is always correct by specifying a third parameter of undefined and passing nothing to it (this is because undefined can actually be overwritten in javascript.)

  • Javascript namespacing for clearer separation of concerns.

And example of using the undefined method is this:

var AppName = (function (parent, $, undefined) { //add parameter for undefined here
  var controller = parent.controller = parent.controller || {};

  controller.index_page = function (parent) {
    var createPage = parent.createPage = parent.createPage || {};

    createPage.init = function () {
      alert('javascript initialized');
    };
    return createPage;
  }(controller);

  return parent;
}(AppName || {}, jQuery)); //do not define anything for the undefined parameter here.

The purpose of the parenthesis at the end of the function is to invoke your function immediately and form a closure, giving you access to public variables/functions whilst hiding private variables/functions. This is known as an immediately invoked function expression(IIFE) sometimes called an iffy.

5
  • 1
    Seems like the right link. +1
    – Saanch
    Sep 17, 2013 at 14:39
  • You can also add terms like self calling (immediately invoked) functions, defaulting with || Sep 17, 2013 at 14:39
  • @Saanch This pattern is extremely useful when implemented correctly and is a pattern that any serious javascript developer should research and employ where appropriate.
    – BenM
    Sep 17, 2013 at 14:44
  • @BenM Is it better than the revealing module patter?
    – Saanch
    Sep 17, 2013 at 14:47
  • @Saanch There are probably cases where it may be better but overall I would say no. The module patter allows techniques such as overwriting public functions.
    – BenM
    Sep 17, 2013 at 14:49
3

It is called the module pattern.

In particular this is an immediately invoked function

var Module = (function(parameters) {

})(parameters)

I advice to have a look at the whole book by Addy Osmani, not just the section I linked above.

1

Answers here are correct.

So this is great book where you can find a lot about patterns in javascript and also lot about module pattern:

http://addyosmani.com/resources/essentialjsdesignpatterns/book/#modulepatternjavascript

-1

Where can I find more info about it?

I saw this pattern in a book called Object-Oriented Javascript by Stoyan Stefanov.

http://www.amazon.co.uk/Object-Oriented-Javascript-Stoyan-Stefanov/dp/1847194141

2
  • Note exactly correct answer.
    – Saanch
    Sep 17, 2013 at 14:39
  • no its not..... but it answers one of your questions
    – Dave Haigh
    Sep 17, 2013 at 14:40

Not the answer you're looking for? Browse other questions tagged or ask your own question.