文章目錄

• 設計原則
• • 一.介紹
  • • 單一職責原則
    • 開放封閉原則
    • 李氏置換原則
    • 接口隔離原則
    • 依賴倒置原則
    • 單一與開放原則的舉例說明
  • 二.從設計到模式
  • 三.簡介 23 種設計模式

設計原則

S O L（Liskov） I D 五大設計原則

• S單一職責原則
• O開放封閉原則
• L李氏置換原則
• I接口獨立原則
• D依賴導致原則

---

一.介紹

單一職責原則

一個程序只做好一件事，如果功能過于復雜就拆分開，每個部分保持獨立。

開放封閉原則

對修改封閉，對擴展開放，這是軟件設計的終極目標。即要設計一種機制，當需求發生變化時，根據這種機制擴展代碼，而不是修改原有的代碼。

李氏置換原則

子類能覆蓋父類，父類能出現的地方子類就能出現。JS 中子類繼承父類的場景較少，又不是強類型語言，因此體現較少。

接口隔離原則

保持接口的單一獨立，避免出現“胖接口”。類似于單一職責原則，只不過前者說的比較統一，后者是單獨對接口的規定。JS 中沒有接口，因此體現較少。

依賴倒置原則

面向接口編程，依賴于抽象而不依賴于具體。寫代碼時用到具體類時，不與具體類交互，而與具體類的上層接口交互。

---

單一與開放原則的舉例說明

// 加載圖片 function loadImg(src) {var promise = new Promise(function (resolve, reject) {var img = document.createElement('img')img.onload = function () {resolve(img)}img.onerror = function () {reject('圖片加載失敗')}img.src = src})return promise }var src = 'https://www.imooc.com/static/img/index/logo_new.png' var result = loadImg(src)result.then(function (img) { // 單一的then的原則console.log('img.width', img.width)return img }).then(function (img) {console.log('img.height', img.height) }).catch(function (ex) {// 統一捕獲異常console.log(ex) })

• 單一職責原則：每個then中的邏輯只做好一件事，如果要做多個就用多個then
• 開放封閉原則：如果這個需求要修改，那去擴展then即可，現有的邏輯不用修改，即對擴展開放、對修改封閉

其實 S 和 O 是相符現成的，相互依賴；開放封閉原則的好處不止于此，從整個軟件開發流程看，減少現有邏輯的更改，也會減少測試的成本；
后三個原則是基于高級面向對象語言語法的（如 java），找不到太合適的例子，在js中就根據場景應用到實際項目中，而不是全部硬使用；

二.從設計到模式

“設計”和“模式”應該分開看。

• “設計”即設計原則、設計思想;
• “模式”即一些固話了的符合設計原則的既定方式、成型的可套用的模板。

現有“設計”后有“模式”，因此應該“從設計到模式”，不能將“設計模式”作為一個詞來稱呼。根據這種設計到形成固有模式的思想來學習設計模式，代入到學習設計模式中，幫助更好的理解；

三.簡介 23 種設計模式

以下是所有 23 種設計模式。一些是前端常用且能找到經典使用場景的，一些是不常用或者找不到代表性的使用場景的。

• 創建型模式
  • 工廠模式（工廠方法模式，抽象工廠模式，建造者模式）
  • 單例模式
  • 原型模式
• 結構型模式
  • 適配器模式
  • 裝飾器模式
  • 代理模式
  • 外觀模式
  • 橋接模式
  • 組合模式
  • 享元模式
• 行為型模式
  • 策略模式
  • 模板方法模式
  • 觀察者模式
  • 迭代器模式
  • 職責連模式
  • 命令模式
  • 備忘錄模式
  • 狀態模式
  • 訪問者模式
  • 中介者模式
  • 解釋器模式

總結

以上是生活随笔為你收集整理的基于javascripts的语法特性使用设计原则的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。