I also talk about JavaScript Modular-AMD specification

Recently, read a lot about JS modular programming aspects of the article, I also have some small understanding, but still have to rely on other people's summary, on this basis to talk about their understanding it!
Reference: http://www.ruanyifeng.com/blog/2012/10/javascript_module.html
1. Why should the Web JS program be modularized?
Before, some websites, or Web pages, are basically a HTML+CSS implementation layout, content display mainly. As for some forms of validation logic, as well as to give the page to implement some special effects (such as Click to play a window out, animation ah, etc.), is nothing more than to write some JS script in the corresponding page, which page to what function, write some JS script to this page is good. The whole site down, each page has a corresponding JS file, feel bad management, no systematization. And, for some of the page features more, it is possible that the page JS file is more, the code may be more complicated. Further, if you want to do more in one page more functions, more interaction, it is obvious that the page JS code is very much.   to implement features like our client software in an HTML Web page, our site, or Web page, is called the SPA--singal page Application single page app.
At this time the JS code is very much, and the JS code between the inevitable interdependence between the first execution and after the implementation of the relationship exists. This time, there is the need to manage our JS files.
2, therefore, out of this situation, there is a JS module.

module, a module is a set of methods for implementing a specific function.
Simply put the different functions (and the variables that record the state) together, even if it is a module.

First, the original wording
function M1 () {
//...
}
function m2 () {
//....
}
The above functions M1 () and M2 (), which make up a module, can be called directly when used.
The disadvantage of this approach is that it "pollutes global variables", which can easily lead to naming conflicts, and global variables
persists, does not destroy, consumes memory, and can easily cause memory leaks. And the members of the module are not directly visible
A direct relationship.

Ii. the wording of the object
In order to solve the above shortcomings, the module can be written as an object, all the module members are placed in this object.
var module1 = new Object ({
_count:0,
M1:function () {
//...
},
M2:function () {
//...
}
});
The above functions, M1 () and M2 (), are encapsulated in the Module1 object and are used to invoke the object's properties.
MODULE1.M1 ();
However, such a notation exposes all module members, and the internal state can be overridden externally. For example, external code can
Directly overwrites the value of the internal counter,
Module1._count = 5;

Iii. immediate execution of function notation

var Module1 = (function () {
var _count = 0;
var m1 = function () {
//..
};
var m2 = function () {
//...
};
return {
M1:M1,
M2:m2
}
})();
Using this notation, the external code simply reads the value of the internal _count variable.
Console.info (module._count);//undefined

Module1 is the basic way of writing JavaScript modules. Below, we are working on this notation.

Four, amplification mode

If a module is large, it must be divided into several parts, or one module needs to inherit another module, it is necessary
Use magnification mode (sugmentation)

var Module1 = (function (mod) {
MOD.M3 = function () {
//...
};
}) (Module1);
The above code adds a new method M3 () to the Module1 module, and then returns the new Module1 module;

Five, wide magnification mode (Loose augmentation)

In a browser environment, parts of the module are usually taken from the web, and there is no way to know which one will load first.
If you use the previous section, the first part of the execution may load a nonexistent empty object, which is to use the
"Wide magnification mode"
var Module1 = (function (mod) {
return mod;
}) (Window.module1 | | {});
In contrast to Loupe mode, the wide magnification mode is the parameter to execute function immediately, which can be an empty object.

VI. Input Global Variables

Independence is an important feature of the module, it is best not to directly interact with other parts of the program.
In order to call global variables inside a module, other variables must be entered into the module.
var Module1 = (function ($, YAHOO) {
//...
}) (JQuery, YAHOO);
The above Module1 module needs to use the jquery library and Yui Library, the two libraries (actually two modules) as a parameter
Incoming Module1, so that the independence of the module is ensured, or the dependency between the modules becomes obvious. The discussion in this regard
Refer to Ben Cherry's famous article, "Javascript Module pattern:in-depth".

I also talk about JavaScript Modular-AMD specification