Module模式 - 深入了解Javascript
/* Modelu模式 优点:效率高,代码少,加载速度快,松耦合允许并行加载,提升下载速度 缺点:初始化时间久一点 */ //一、基础用法 var calculate = function (eq) { //私有成员 var eqCtl = document.getElementById(eq); return { //暴露公开成员 add: function (x, y) { var val = x + y; eqCtl.innerHTML = val; } } } //使用方式 //缺点:每次调用都要new,copy多份 var calculator = new calculate(); calculator.add(2, 2); //二、匿名闭包 ?闭包用途和场景 (function () { //--所有变量和fucntion都在此声明,并且作用域也只在这个匿名闭包 //--依然可以访问外部全局对象 }()); //()匿名函数自己执行,不用new //三、引用全局变量 /* 隐式全局变量:无论一个变量是否使用,js会反向遍历作用域链来找到var,如果没找到var,则假定该变量为全局 */ (function ($, yahoo) { //这里使用了全局的jQuery和yahoo }(jQuery, yahoo)); //声明全局变量,module模式 var blogModule = (function () { var my = {}, privateName = '博客园'; function privateAddToTopic(data) { //内部处理代码 } my.Name = privateName; my.AddTopic = function (data) { privateAddToTopic(data); }; return my; }()); //三、高级用法 易于扩展结构 //扩展添加一个函数 var blogModule = (function (my) { my.AddTopic = function () { } return my; }(blogModule)); //--缺点:必须先声明blogModule //松耦合扩展,加载顺序不固定,缺点:不一定能用所有属性和函数 var blogModule = (function (my) { return my; }(blogModule || {})); //紧耦合扩展 //重载 var blogModule = (function (my) { var oldAdd = my.AddTopic; my.AddTopic = function () { //重载,依然可以用oldAdd调用旧的方法 } return my; }(blogModule)); //克隆和继承 var blogModule = (function (old) { var my = {}, key; for (key in old) { if (old.hasOwnProperty(key)) { my[key] = old[key]; } } var oldAdd = old.AddTopic; my.AddTopic = function () { } return my; }(blogModule)); //--非继承,只是同个对象多个引用 //跨文件共享私有对象 var blogModule = (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; }(blogModule || {})); //子模块 blogModule.CommentSubModule = (function () { var my = {}; return my; }()); /* 创建一个立即执行的匿名函数表达式 return一个变量,其中这个变量包含你要暴露的属性 返回这个变量将赋值给counter,而不是外部声明的function自身 */ var counter = (function () { var i = 0; return { get: function () { return i; }, set: function (val) { i = val; }, increment: function () { return ++i; } }; }()); //counter是一个待有过个属性的对象 counter.get(); counter.set(3); counter.increment(); counter.increment(); counter.i;//undefined i;//引用错误