開發中,我們或多或少地接觸了設計模式,但是很多時候不知道自己使用了哪種設計模式或者說該使用何種設計模式。本文意在梳理常見設計模式的特點,從而對它們有比較清晰的認知。
JavaScript 中常見設計模式
單例模式
策略模式
代理模式
迭代器模式
發佈-訂閱模式
命令模式
組合模式
模板方法模式
享元模式
職責鏈模式
中介者模式
裝飾者模式
狀態模式
適配者模式
觀察者模式
各設計模式關鍵詞
看完了上述設計模式後,把它們的關鍵詞特點羅列出來,以後提到某種設計模式,進而聯想相應的關鍵詞和例子,從而心中有數。
設計模式 | 特點 | 案例 |
---|---|---|
單例模式 | 一個類只能構造出唯一實例 | 創建菜單對象 |
策略模式 | 根據不同參數可以命中不同的策略 | 動畫庫裏的算法函數 |
代理模式 | 代理對象和本體對象具有一致的接口 | 圖片預加載 |
迭代器模式 | 能獲取聚合對象的順序和元素 | each([1, 2, 3], cb) |
發佈-訂閱模式 | PubSub | 瀑布流庫 |
命令模式 | 不同對象間約定好相應的接口 | 按鈕和命令的分離 |
組合模式 | 組合模式在對象間形成一致對待的樹形結構 | 掃描文件夾 |
模板方法模式 | 父類中定好執行順序 | 咖啡和茶 |
享元模式 | 減少創建實例的個數 | 男女模具試裝 |
職責鏈模式 | 通過請求第一個條件,會持續執行後續的條件,直到返回結果爲止 | if else 優化 |
中介者模式 | 對象和對象之間藉助第三方中介者進行通信 | 測試結束告知結果 |
裝飾者模式 | 動態地給函數賦能 | 天冷了穿衣服,熱了脫衣服 |
狀態模式 | 每個狀態建立一個類,狀態改變會產生不同行爲 | 電燈換擋 |
適配者模式 | 一種數據結構改成另一種數據結構 | 枚舉值接口變更 |
觀察者模式 | 當觀察對象發生變化時自動調用相關函數 | vue 雙向綁定 |