模式：經過實踐證明，有通用性的，優秀的解決方案。 # 編程模式 * 行為隔離 * 命名空間 * 初始化分支 * 延遲定義 * 配置對象 * 私有變量和方法 * 特權方法 * 私有函數的共有化 * 自執行的方法 * 鏈式調用 * JSON ***** ## 行為隔離 * 內容HTML > 盡量避免在HTML標簽中使用樣式類的屬性 > 不要使用與外觀有關的HTML標簽 > 盡量根據語義需要來選擇標簽 * 外觀CSS > 對瀏覽器默認的繪制行為進行重置 * 行為JavaScript > 盡可能少用\<script\>標簽 > 盡量不要使用內嵌事件的處理方法 > 盡量不要使用CSS表達式 > 在內容末尾、body標簽之前，插入js文件 ## 命名空間 避免命名沖突 ## 初始化分支 在模塊初始化的過程中就將部分代碼進行分支處理，效率更高。 應該單獨檢測每個可能會用到的瀏覽器特性。 ## 延遲定義 相關函數只有在被調用時，才會執行，使初始化過程更為輕量。 ## 配置對象 參數過多時，使用配置型參數，優點： * 不用考慮參數的順序 * 可以跳過某些參數的設置 * 函數的擴展性更強 * 代碼的可讀性更好 ## 私有屬性和方法 利用構造器函數來實現 ## 特權函數 可以通過他們訪問對象的私有方法或屬性 ## 私有函數公有化 不讓外界修改，但是希望外部代碼訪問 ``` var _setStyle = function(){} var _getStyle = function(){} return { setStyle: _setStyle, getStyle: _getStyle } ``` ## 自執行函數 保證全局命名空間不被污染 適用于某些腳本加載時執行一次性初始化任務 ## 鏈式調用 ## JSON # 設計模式 * 創建型模式：設計對象的創建與初始化 * 結構性模式：描述了如何組合對象以提供新的功能 * 行為型模式：描述了對象之間如何通信 * 單例模式 ``` // 最基本的形式，對象文本標識法 var single = {} ``` * 工廠模式 ``` // 全局變量 function Logger(){ if(typeof global_log === 'undefined'){ global_log = this; } return global_log; } var a = new Logger(); var b = new Logger(); alert(a === b); // 構造器屬性 function Logger(){ if(typeof Logger.single_instance === 'undefined'){ Logger.single_instance = this; } return Logger.single_instance; } ``` * 裝飾器模式 * 觀察者模式