//module: Module模式是JavaScript编程中一个非常通用的模式
1 window.onload = function() { 2 //1、基本使用: 3 var MyFn = function() { 4 var age = 24,sex = "boy";//私有变量 5 var action = function() {//私有行为 6 console.log("it man"); 7 }; 8 return {//暴露的公开成员 9 work : "orderMonkey", 10 action2 : function() { 11 console.log("it developer!"); 12 } 13 } 14 }; 15 var newMyFn = new MyFn(); 16 console.log(newMyFn.action2()); 17 console.log("==============================="); 18 //基本用法的缺点:每次使用时都要使用new 关键字生成,这样在内存中每次会copy一份,占用内存,使用闭包可以避免内存问题,实现自执行。也可以实现功能的扩展。 19 20 //2、模块方法: 21 var MyFn2 = (function() { 22 var my = {};//向外返回的对象 23 var age = 25,name = "assassin"; 24 var action = function() { 25 console.log("内部私有成员"); 26 }; 27 my.EnglishName = "wanghf"; 28 my.action2 = function() { 29 console.log("major in JavaScript!"); 30 };//公有代码状态 31 return my; 32 /*return my = {//向外返回的对象 33 work : "It developer", 34 action2 : function() { 35 console.log("外部成员变量"); 36 } 37 }*/ 38 })(); 39 console.log(MyFn2.action2());//调用时避免生成,减小内存占有量 40 console.log("==============================="); 41 //模块方法全局变量的引入和jQuery设计思路一样采用全局传参 42 var MyFn3 = (function($) { 43 //同上 44 })(jQuery); 45 //3、模块的扩展: 46 //对于大型项目测需要对自己的扩展了,基于上述的思想,同样把自己作为参数传值,进行扩展 47 var MyFn2 = (function(my) {//var不是必写,为了统一。 48 my.addName = "intelwisd"; 49 my.addAction3 = function() { 50 console.log("扩展的新方法..."); 51 }; 52 /*var my1 = { 53 addName : "intelwisd", 54 addAction3 : function() { 55 console.log("外部成员变量"); 56 } 57 };*/ //对象的形式有对象的拷贝之前的会覆盖以前的 58 return my; 59 })(MyFn2); 60 console.log(MyFn2.action2()); 61 console.log("==============================="); 62 //4、松耦合扩展和紧耦合扩展 63 //松耦合扩展 利用 var MyFn2 = MyFn2 || {}; 64 var MyFn2 = (function(my) { 65 my.addName1 = "intelwisd1"; 66 my.addAction4 = function() { 67 console.log("松耦合扩展的新方法..."); 68 }; 69 /*var my = { 70 addName: "intelwisd111", 71 addAction3: function () { 72 console.log("外部成员变量"); 73 } 74 };*/ 75 return my; 76 })(MyFn2 || {}); 77 console.log(MyFn2.EnglishName); 78 console.log(MyFn2.addName1); 79 console.log(MyFn2.action2()); 80 console.log(MyFn2.addAction4()); 81 //松耦合的优点:确保该对象,在存在的时候直接用,不存在的时候直接赋值为{} 82 console.log("==============================="); 83 //紧耦合扩展 可以实现重载的功能,但要确保加载顺序 84 var MyFn2 = (function(my) { 85 var addAction4 = my.newAddAction4; 86 my.newAddAction4 = function() {//重载函数,以前的函数可以继续使用 87 console.log("紧耦合扩展...."); 88 }; 89 return my; 90 })(MyFn2); 91 console.log(MyFn2.addAction4()); 92 console.log(MyFn2.newAddAction4()); 93 console.log("==============================="); 94 //5、克隆与继承 (在紧耦合的基础上进行继承,其实该对象的属性对象或function根本没有被复制,只是对同一个对象多了一种引用而已,所以如果老对象去改变它,那克隆以后的对象所拥有的属性或function函数也会被改变。) 95 var MyFn2 = (function(my) { 96 var my1 = {}, key; 97 for (key in my) { 98 if (my.hasOwnProperty(key)) { 99 my1[key] = my[key]; 100 } 101 } 102 var addAction4 = my1.newAddAction4; 103 my1.newAddAction4 = function() {//重载函数,以前的函数可以继续使用 104 console.log("紧耦合扩展2...."); 105 // 克隆以后,进行了重写,当然也可以继续调用以前的 106 }; 107 return my1; 108 })(MyFn2); 109 console.log(MyFn2.addAction4()); 110 console.log(MyFn2.newAddAction4()); 111 console.log("==============================="); 112 //6、跨文件中的私有成员的共享 113 var MyFn3 = (function (my) { 114 var _private = my._private = my._private || {}, 115 _seal = my._seal = my._seal || function () { 116 delete my._private; 117 delete my._seal; 118 delete my._unseal; 119 }, 120 _unseal = my._unseal = my._unseal || function () { 121 my._private = _private; 122 my._seal = _seal; 123 my._unseal = _unseal; 124 }; 125 return my; 126 } (MyFn2 || {})); 127 //任何文件都可以对他们的局部变量_private设属性,并且设置对其他的文件也立即生效。一旦这个模块加载结束,应用会调用 blogModule._seal()"上锁",这会阻止外部接入内部的_private。如果这个模块需要再次增生,应用的生命周期内,任何文件都可以调用_unseal() ”开锁”,然后再加载新文件。加载后再次调用 _seal()”上锁”。 128 //子模块共有的成员创建 129 MyFn2.CommentSubModule = (function () { 130 var my = {}; 131 // ... 132 133 return my; 134 } ()); 135 //eg: 136 MyFn3.CommentSubModule = (function () { 137 var my = { 138 name : "assassin", 139 Fn1 : function() { 140 alert(0); 141 } 142 }; 143 // ... 144 145 return my; 146 } ()); 147 }
学习来源Tom大叔javascript--Module