javascript 模式之模組模式

在進行模組化編程的時候，好多項目採用模組模式，因為其提供了結構化的思想並且有助於組織日益增長的代碼。javascript和C++、java等物件導向的語言不同，它沒有可以進行匯入包的文法，，但是模組模組模式則提供了一種建立自包含非耦合的程式碼片段的有力工具。這也是現在好多項目採用此模式的原因。
好了，不廢話了，現在開始深入，細解模組模式，其實是以下幾種模式的組合：
一、命名空間模式
二、即時函數
三、聲明依賴
四、私人和特權成員
一、建立一個命名空間函數

/*** namespace(str)* @param {string} 字串* @returns {object} 對象*/var zj={};zj.namespace=function(str){var o=zj;var arr=str.split(".");for(var i=(arr[0]=='zj'?1:0),len=arr.length;i<len;i++){o=o[arr[i]]=o[arr[i]]||{};}return o;}zj.namespace("zj.util.dom");

二、下面使用即時函數，其可以提供私人範圍，該即時函數返回一個對象，即具有公用介面的實際模組，因此可以通過此介面來使用這些模組。

zj.util.dom=(function(){return {getId:function(id){return document.getElementById(id);},getClass:function(className){var arr=document.getElementsByTagName('*');for(var i=0,len=arr.length;i<len;i++){if(arr[i].getAttribute('class')==className){return arr[i];}else{return '無此對象';}}}}})();

三、添加一些私人屬性、特權方法：

zj.util.dom=(function(){//私人屬性var _name='zhansan',_id='lisi';//私人方法function _xxx(){}//定義一些var 變數return {getId:function(id){return document.getElementById(id);},getClass:function(className){var arr=document.getElementsByTagName('*');for(var i=0,len=arr.length;i<len;i++){if(arr[i].getAttribute('class')==className){return arr[i];}else{return '無此對象';}}}};})();

四、增加聲明依賴

zj.namespace("zj.util.array");var module=zj.namespace("zj.util.dom");module=(function(){//聲明依賴var arr=zj.util.array;//私人屬性var _name='zhansan',_id='lisi';//私人方法function _xxx(){}//定義一些var 變數return {getId:function(id){return document.getElementById(id);},getClass:function(className){var arr=document.getElementsByTagName('*');for(var i=0,len=arr.length;i<len;i++){if(arr[i].getAttribute('class')==className){return arr[i];}else{return '無此對象';}}}};})();

五、將全域變數匯入到模組中

zj.namespace("zj.util.array");var module=zj.namespace("zj.util.dom");module=(function($,app){//聲明依賴var arr=zj.util.array;//私人屬性var name='zhansan',id='lisi';//私人方法function xxx(){}//定義一些var 變數return {getId:function(id){return document.getElementById(id);},getClass:function(className){var arr=document.getElementsByTagName('*');for(var i=0,len=arr.length;i<len;i++){if(arr[i].getAttribute('class')==className){return arr[i];}else{return '無此對象';}}}};})(jQuery,MYAPP);

此文是自己幾日來，看書所做總結，遇到同行看到此文，如果不同看法，歡迎留言。

轉載請註明出處：始終堅信分享能提高自己、成就他人，I‘m Ben， 一直在路上，從未敢怠慢。