问题
在日常和后端接口对接的过程中, 经常会遇到接口字段存在 null 的值, 比如
- {
- code:0,
- msg:'success',
- result:null
- }
而这个时候 我们再获取 result.userInfo 的时候, JavaScript 就会报错. 所以前端不光要校验接口状态 code 是不是为 0, 同时还要校验 result 是否是预期的对象类型.
也就是从原来的
if (res.data.code === 0)
改为
if (res.data.code === 0&&res.data.result)
特别是当我们预期数据结构是
- {
- code:0,
- result:{
- userInfo:{
- userName:''
- }
- }
- }
为了顺利的取得 userName 这个值 我们需要做三次判断
- let userName = ''
- if (res.data.result&&res.data.result.userInfo&&res.data.result.userInfo.userName)
- userName = res.data.result.userInfo.userName
很让人头疼
而且 98% 的后端都不会乐意按照预定的数据结构返回
就是导致 object/string/number/array 都有可能是 null
及时你最终打败了后端, 答应了按照格式返回,
但是终究还是接口返回不可信
于是我预想了一个方案主要解决那么多的 if 判断, 将接口返回格式化成我们想要的样子
通过保留基础格式, 然后将接口返回合并至基础数据的方式
这样做的好处是
完全保留了预期的数据结构
debug 代码的时候, 可以清晰直观的看到当前接口返回的数据格式, 增强可读性
方便做接口 mock 拓展
来源: https://segmentfault.com/a/1190000040220143