文章目錄
1.什麼是設計模式?
2.js設計模式結構
3.編寫設計模式
4.js反模式
5.js設計模式的分類
什麼是設計模式?
1.什麼是設計模式?
就是一個我們如何解決問題的模板——那些可以再許多不同的情況裏使用的模板。
優點:
模式是行之有效的解決方法:提供固定解決方法來解決開發中出現問題
易重用:一個模式通常反映一個可適應自己需要的開箱即用的解決方案
善於表達:一般有一組詞彙和優雅的解決方案
2 . js設計模式結構
模式是最初提出的一種在兩者之間建立關係的規則:
-
上下文環境(在此環境下產生系統的能力)
-
配置:模式名稱 和 相應的描述
-
上下文概述:響應用戶需要
-
問題聲明: 理解模式意圖
-
解決方案: 包括用戶出現問題的解決方案
-
設計模式
-
實現: 如何被實現的一種指引
-
例證: 虛擬化表達
-
例子
-
共同條件:是否有其他模式進行支持?
-
關係: 相似之處?
-
已知的使用: 模式在哪裏被用到?
-
討論
3.編寫設計模式
模式是否實用?: 確保這個模式能夠對一些常見的問題有明確的解決方案,而不是臨時的解決方案。
保持最佳實踐: 設計需要以最佳實踐中所獲得的理解作爲基礎。
設計模式對用戶來說應該是清晰的:設計模式必須對任何形式的用戶體驗都是清晰的。 因爲設計模式主要服務於開發者們,所以不能強迫他們去改變原來的行爲,那樣開發者們纔會去使用這個模式。
需要有幾個有說服力的例子:一個好的設計模式需要有一個有說服力的例子來展示這個模式是成功的。爲了廣泛使用這個設計模式,這些例子需要展示良好的設計原則。
4.js反模式
反模式的兩種觀念:
-
描述對於一個特殊的問題,提出了一個糟糕的解決方案,最終導致一個壞結果發生
-
描述如何擺脫上述解決方案並能提出一個好的解決方案
當我們開發一個應用,這個工程的生命週期開始建設一直至項目完成,但一旦完成後,就進入維護階段。判斷一個解決方案的好壞要看這個團隊在這個項目上投資的技術和花費的時間。這裏被認爲是好的和壞的情況下-如果應用在錯誤的情況下,一個“完美”的設計可能有資格作爲一個反模式。
Javascript的反模式例子如下:
在全局上面文中定義大量污染全局命令空間的變量
在調用setTimeout和setInterval時傳遞字符串(會用eval來執行)而不是函數。
修改Object的原型 (這是最糟糕的反模式)
使用內聯Javascript
在本應使用document.createElement的地方使用document.write。document.write被錯誤的用了相當多的年頭,它有相當多的缺點,包括如果在頁面加載後執行它可能會覆蓋我們的頁面。再有它不能工作在XHTML下,這也是另外一個我們使用像document.createElement這種對DOM友好方法的原因。
5.js設計模式的分類
創建型設計模式:
此模式關注於對象創建的機制,以適應工作環境的方式被創建。
基本的對象創建方法會給項目複雜化,而這些模式目的爲了控制創建過程解決此問題。
- 屬於這一類的一些模式是:構造器模式(Constructor),工廠模式(Factory),抽象工廠模式 (Abstract),原型模式 (Prototype),單例模式 (Singleton)以及 建造者模式(Builder)。
結構設計模式
關注對象組成和通常識別的方式實現不同對象之間的關係。優點在於系統的某一部分發生改變的時候,整個系統不需要重構,只需要改相應部分。
- 在該分類下的模式有:裝飾模式,外觀模式,享元模式,適配器模式和代理模式。
行爲設計模式
關注改善或精簡系統不同對象的通信。
- 行爲模式包括: 迭代模式、終結者模式、觀察者模式和訪問者模式
後續開始進入全部設計模式學習筆記整理,枯燥但很重要。