Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Using the Module Pattern for larger projects

I'm interested in using the Module Pattern to better organize my future projects. Unfortunately, there are only a few brief tutorials and proof-of-concept examples of the Module Pattern.

Using the module pattern, I would like to organize projects into this sort of structure:

project.arm.object.method();

Where "project" is my global project name, "arm" is a sub-section or branch of the project, "object" is an individual object, and so on to the methods and properties.

However, I'm not sure how I should be declaring and organizing multiple "arms" and "objects" under "project".

var project = window.project || {};
project.arm = project.arm || {};

project.arm.object = (function() {

    var privateVar = "Private contents.";

    function privateMethod() {
        alert(privateVar);
    }

    return {
        method: privateMethod
    };

}());

Are there any best practices or conventions when defining a complex module structure? Should I just declare a new arm/object underneath the last?

like image 487
Rob Gibbons Avatar asked Apr 27 '10 01:04

Rob Gibbons


People also ask

Why is it important to use the module pattern in JavaScript?

The Module pattern is used to mimic the concept of classes (since JavaScript doesn't natively support classes) so that we can store both public and private methods and variables inside a single object — similar to how classes are used in other programming languages like Java or Python.

When would you use the revealing module pattern?

Revealing module pattern is a design pattern, which let you organise your javascript code in modules, and gives better code structure. It gives you power to create public/private variables/methods (using closure), and avoids polluting global scope (If you know how to avoid that).

What is modular design pattern?

In software engineering, the module pattern is a design pattern used to implement the concept of software modules, defined by modular programming, in a programming language with incomplete direct support for the concept.

Which access levels are available in module design pattern?

The module pattern allows for public and private (plus the lesser-know protected and privileged) access levels. Notice that callChangeHTML binds to the returned object and can be referenced within the HTMLChanger namespace. However, when outside the module, contents are unable to be referenced.


2 Answers

Here's a good write-up on what you're after; http://www.adequatelygood.com/2010/3/JavaScript-Module-Pattern-In-Depth

like image 95
Jonathan Avatar answered Sep 29 '22 12:09

Jonathan


Dojo's dojo.declare is great for this kind of thing since it

Create a constructor using a compact notation for inheritance and prototype extension.

It's also really convenient if even for just removing this kind of boiler plate:

var project = window.project || {};
project.arm = project.arm || {};

If you just want that feature, then you could use dojo.setObject, but of course, writing something to do the same is trivial.

dojo.setObject("project.arm.object" (function() {
    var privateVar = "Private contents.";

    function privateMethod() {
        alert(privateVar);
    }

    return {
        method: privateMethod
    };
}()));

I recently used dojo.declare/dojo.setObject for a large JavaScript project (86 files, 7K+ lines (not counting comments and blank lines)), and it was a breeze to keep everything organized and manageable, especially when you have an inclusion mechanism like dojo.require and dojo.provide.

like image 21
Justin Johnson Avatar answered Sep 29 '22 10:09

Justin Johnson