編程范式

• 命令式編程
• 聲明式編程

上述兩種范式是相對來說的

命令式編程

• 詳細描述做事過程的方式就可以叫做 命令式
• 例子: 張三媽媽讓張三買食鹽
  • 拿錢，開門，下樓，到商店，付款，帶著食鹽回家
• 例子：在指定div中展示hello world 文本

  var divEle = document.querySelector('#app')
  divEle.innerHTML = 'hello world'
  

• 上述div的例子代碼雖然只有兩部，但是它清晰描述了，完成這件事情，所需要經理的過程
• 如果我們所做的事情變復雜了，那整個過程也會變得更加復雜
• 總之：命令式是：關注過程的一種編程范式類似面向過程編程思想，但不一定是面向過程，它描述了完成一個功能的詳細邏輯與步驟

聲明式編程

• 聲明式：不關注過程，只關注結果的 范式，它并不關心完成一個功能的詳細邏輯與步驟，(這并不意味著聲明式不需要過程，只是把過程隱藏了)
• 張三的媽媽說的話，就是聲明式編程
• 例如：模板語法

  <div> {{ msg }} </div>
  

命令式 VS 聲明式

• 哪種好？由兩個方向來對比
  • 性能
  • 可維護性

1 ）性能

• 例子
  • div.innerText = 'hello world' 這行代碼耗時為1
  • <div>{{ msg }}</div> 這行代碼耗時為 1 + n 這里的n是解析處理msg到頁面渲染的整個過程
• 上述例子，我們用耗時來代表性能，耗時越少，性能越強
• 我們知道：聲明式耗時 >= 命令式耗時，即：命令式性能 >= 聲明式性能

2 ） 可維護性

• 可維護性是指，對代碼可以方便的 閱讀，修改，刪除，增加
• 說白了，代碼邏輯越簡單，可維護性越強
• 基于vue的聲明式代碼可維護性 > 原生js命令式代碼的可維護性

企業應用框架的開發和設計原則

• 企業應用開發和設計如何權衡命令式和聲明式兩種維度的選擇
• 對不同的企業類型，不同的項目類型 (前臺，中臺，后臺)來說，對應的企業應用設計也存在差異
• 最關注的兩個指標
  • 項目成本: 主要看項目的開發周期，開發周期越長，所付出的人員成本越高，從而導致項目成本越來越高
  • 開發體驗: 決定開發者開發體驗的核心要素，主要是在開發時和閱讀時的難度，這個叫做：心智負擔, 聲明式開發體驗更好，心智負擔更低
• 框架的設計是一個不斷取舍的過程，就像是算法一樣，沒有最優，而是最均衡合適的
  • 1）命令式性能 > 聲明式性能
  • 2）命令式可維護性 < 聲明式可維護性
  • 3）聲明式的框架本質上是由命令式的代碼來去實現的
  • 4）企業項目開發，多使用聲明式

框架開發和設計原則

• 在使用vue時是基于聲明式的，但是vue內部是通過命令式來實現的
• vue封裝了命令式的邏輯，對外暴露出了聲明式的接口
  • 原因在于命令式的可維護性 < 聲明式的可維護性
  • vue需要做的是，封裝命令式邏輯，同時盡可能減少性能的損耗，在性能和可維護性之間，找到一個平衡點
  • vue的設計原則是：在保證可維護性的基礎上，盡可能減少性能損耗