Module:module mode is a very common pattern in JavaScript programming.
Window.onload = function () {
1. Basic use:
var myfn = function () {
var = 24,sex = "Boy";//Private variable
var action = function () {//private behavior
Console.log ("it Man");
};
return {//Exposed public member
Work: "Ordermonkey",
Action2:function () {
Console.log ("it developer!");
}
}
};
var newmyfn = new Myfn ();
Console.log (Newmyfn.action2 ());
Console.log ("===============================");
The disadvantage of basic usage: Use the new keyword generation each time, so that in memory every time copy a copy, memory, using closures can avoid memory problems, implement self-execution. It is also possible to extend the functionality.
2. Module Method:
var MyFn2 = (function () {
var my = {};//object returned outward
var = 25,name = "Assassin";
var action = function () {
Console.log ("Internal private member");
};
My. Englishname = "WANGHF";
My.action2 = function () {
Console.log ("Major in javascript!");
};//Public Code State
return my;
/*return my = {//Outward returned objects
Work: "It developer",
Action2:function () {
Console.log ("external member variable");
}
}*/
})();
Console.log (Myfn2.action2 ());//call to avoid generation, reduce memory footprint
Console.log ("===============================");
Module method The introduction of global variables and jquery design thinking the same as the use of global parameters
var MyFn3 = (function ($) {
Ditto
}) (JQuery);
3, the expansion of the module:
For large-scale projects need to expand their own, based on the above thought, the same as the parameter value, to expand
var MyFn2 = (function (my) {//var is not required to be written, for unification.
My.addname = "INTELWISD";
My.addaction3 = function () {
Console.log ("New method of Extension ...");
};
/*var my1 = {
AddName: "INTELWISD",
Addaction3:function () {
Console.log ("external member variable");
}
};*///objects are copied in the form of objects before they overwrite the previous
return my;
}) (MYFN2);
Console.log (Myfn2.action2 ());
Console.log ("===============================");
4. Loosely coupled expansion and tight coupling expansion
Loosely coupled extension leverages var MyFn2 = MyFn2 | | {};
var MyFn2 = (function (my) {
my.addname1 = "INTELWISD1";
My.addaction4 = function () {
Console.log ("New method of loose coupling extension ...");
};
/*var my = {
AddName: "intelwisd111",
Addaction3:function () {
Console.log ("external member variable");
}
};*/
return my;
}) (MyFn2 | | {});
Console.log (Myfn2.englishname);
Console.log (MYFN2.ADDNAME1);
Console.log (Myfn2.action2 ());
Console.log (Myfn2.addaction4 ());
Advantages of loose coupling: Ensure that the object is used directly when it exists, and is directly assigned to {} When it does not exist.
Console.log ("===============================");
Tightly coupled extensions can implement overloaded functionality, but ensure that the load sequence
var MyFn2 = (function (my) {
var addAction4 = My.newaddaction4;
My.newaddaction4 = function () {//Overload function, previous function can continue to use
Console.log ("tightly coupled extension ....");
};
return my;
}) (MYFN2);
Console.log (Myfn2.addaction4 ());
Console.log (Myfn2.newaddaction4 ());
Console.log ("===============================");
5, cloning and inheritance (on the basis of tight coupling inheritance, in fact, the object's Property object or function is not copied at all, but the same object more than a reference, so if the old object to change it, the object of the clone after the property or function functions will also be changed. )
var MyFn2 = (function (my) {
var my1 = {}, key;
For (key in my) {
if (My.hasownproperty (key)) {
My1[key] = My[key];
}
}
var addAction4 = My1.newaddaction4;
My1.newaddaction4 = function () {//Overload function, previous function can continue to use
Console.log ("Tight coupling extension 2 ....");
After cloning, it was rewritten, and of course it was possible to continue invoking the previous
};
return my1;
}) (MYFN2);
Console.log (Myfn2.addaction4 ());
Console.log (Myfn2.newaddaction4 ());
Console.log ("===============================");
6. Sharing of private members across files
var MyFn3 = (function (my) {
var _private = My._private = My._private | | {},
_seal = My._seal = My._seal | | function () {
Delete my._private;
Delete my._seal;
Delete my._unseal;
},
_unseal = My._unseal = My._unseal | | function () {
My._private = _private;
My._seal = _seal;
My._unseal = _unseal;
};
return my;
} (MyFn2 | | {}));
Any file can have properties for their local variable _private, and the settings will take effect immediately for other files. Once this module is loaded, the application calls Blogmodule._seal () "locked", which prevents external access to the internal _private. If the module needs to proliferate again, any file can call _unseal () "Unlock" during the lifetime of the application and then load the new file. Call _seal () "Locked" again after loading.
Member creation common to Submodules
Myfn2.commentsubmodule = (function () {
var my = {};
// ...
return my;
} ());
eg
Myfn3.commentsubmodule = (function () {
var my = {
Name: "Assassin",
Fn1:function () {
Alert (0);
}
};
// ...
return my;
} ());
}
Learning source Tom Uncle Javascript--module
Javascript--module mode