web前端避免无意义的数据判空及优雅的混入属性

在web前端开发中，有这么几种情况，后台返回的数据并不完整。

1. 后台只给了一个状态值， 我们前端在显示时， 需要显示状态的名。
2. 后端在开发时， 自己在数据库中造了一些测试数据，没有关联正确，导致返回的数据有缺失。
3. 正常业务的不同阶段，有一些数据字段与业务状态有关，导致接口中的一些字段缺失了。

当接口嵌套层级过多及接口字段过多时，前端在页面展示时，对接口数据的判空令人很头痛。

之前一直这样混入属性数量少还行，混入的字段多了，太不直观了，加之有些字段可能是空的，判空操作令人及其反感。

如何对返回的数据进行优雅的处理脏数据，混入前台直接可以使用的数据呢？

我是这样实现的:

1. 实现一个函数tranNullObject，对接口中的数据和数据模板进行比对，如果返回的数据缺失了某些字段，那么补上,这样就能极大的避免了无意义的空值判断，如果需要对字段判空，我们只需对最后一级进行判断。
2. 在接口数据模板上,定义以函数的形式混入前端自己的字段。由于在第一步中数据模板会与真实数据进行比对, 比对完成后, 接口数据中就被混入上了这个函数。
3. 混入的属性是个函数，不是数据,没法直接使用，又实现了一个函数mixinsFiledUseFunc来执行在上步中混入的函数，得到需要的数据。

代码见 web前端开发-自己整理及开发的一些常用工具函数_cxgasd的博客-CSDN博客

使用示例

只需要定义一个接口数据模板，然后执行这两个函数 tranNullObject(item, tpl);mixinsFiledUseFunc(item);即可。

函数实现

web前端开发-自己整理及开发的一些常用工具函数_cxgasd的博客-CSDN博客