如何封装一个组建

在我们工作的过程中我们需要有一定的代码抽象能力，减少程序的沉余代码，那我们可能需要封装一些代码

一、案例

二、如何去封装

1、Api怎么定义

1. 每一个字段所对应的功能必须整体有所概括
2. 对每个字段类型有所揣摩 （如：函数则需要掌握它的生命周期）
3. 考虑是否是开放性的功能控制
4. 是否需要默认值支撑功能

2、我认为组建可分为业务、逻辑、(以及跨端或者跨平台的中间处理层)

stateDiagram-v2
[*] --> 业务
逻辑 --> [*]

业务 --> 跨端或者跨平台的中间处理
业务 --> 逻辑
跨端或者跨平台的中间处理 -->逻辑
逻辑 --> 业务
 [*]

1. 业务层 (用于不同业务场景下的数据处理成逻辑层提供的规范数据，并发配给逻辑层)

const getData = (array) => {
       return array.map((val,i) => {
         return {
           type:'text/textarea/checkbox/radio/uploadImg/'
           key:val.title,
           val:val.value,
           name:val.key
         }
        })
     };
     setViewList(getData(sourceData))

2. 逻辑层 （用于支撑业务功能所提供的使用场景，并形成统一规范）

    const textFn =() =>{}
    const setViewList = (array)=> {
      for(let i;i<=array.length;i++;){
          array[i].type && [array[i].type](array[i])
      }
    }

3、我认为编写代码小模块化的进行抽象，通过这些颗粒化的基础函数进行对大功能模块的组装

1. 小模块并且具有语意化。

    const uploadFile = () => {}

三、总结

1. 功能api开发有所意义。
2. 开发过程中尽量提升每一个功能模块（个人比较喜欢逻辑反推）
3. 用最少的代码处理最多的事情
4. 开发完成后编写文档