设计模式: 关于编程范式的声明式和命令式编程及应用框架的开发和设计原则

编程范式

• 命令式编程
• 声明式编程

上述两种范式是相对来说的

命令式编程

• 详细描述做事过程的方式就可以叫做 命令式
• 例子: 张三妈妈让张三买食盐
  • 拿钱，开门，下楼，到商店，付款，带着食盐回家
• 例子：在指定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的设计原则是：在保证可维护性的基础上，尽可能减少性能损耗