js封装之获取返回参数赋值

前言

有时候因业务需求,后端传来的字段会和前端使用的字段名称不一致;当一个接口字段过多,我们每一个都粘贴更改,会反复机械操作且代码占用体积较大;这里封装一个函数,调用后,后端key值对应的数据,会赋值到与之对应的前端key值数据里

封装代码

   getAssignment(setParams, obj, targetObj) {
      //对象的key值是获取返回值得key值,对象的value是要set进参数的key值
      for (const key in setParams) {
        Object.prototype.hasOwnProperty.call(obj, key)
          ? (targetObj[setParams[key]] = obj[key] || "")
          : "";
      }
    },

实际场景使用

比如后端的数据结构为

{

ourCompany: "北京测试公司",      

ourLinkAddress: "北京西南大街512号",            

startTime: "2024-01-19",        

endTime: "2025-01-19",

}

而前端需要的数据结构为

{

 ourObject:" ",
 ourLocation:" ",
 contractStartDate:" ",
 contractEndDate:" ",

}

其中 ourCompany 和 ourObject,ourLinkAddress和 ourLocation,

startTime 和contractStartDate,endTime和contractEndDate是数据对应关系


function getAssignment(setParams, obj, targetObj) {
      //对象的key值是获取返回值得key值,对象的value是要set进参数的key值
      for (const key in setParams) {
        Object.prototype.hasOwnProperty.call(obj, key)
          ? (targetObj[setParams[key]] = obj[key] || "")
          : "";
      }
    }

//对象的key值是获取返回值得key值即后端传来的key,对象的value是要set进参数的key即前端需要的key
 function  getNewParams(){
      let frontData = {
        ourObject:" ",
        ourLocation:" ",
        contractStartDate:" ",
        contractEndDate:" ",
      }
      let setParams = {
        ourCompany: "ourObject",
        ourLinkAddress: "ourLocation",
        startTime: "contractStartDate",
        endTime: "contractEndDate",
      };
      let backData = {
        ourCompany: "北京测试公司",      
        ourLinkAddress: "北京西南大街512号",            
        startTime: "2024-01-19",        
        endTime: "2025-01-19",

      }
      getAssignment(setParams,backData,frontData)
      console.log('frontData',frontData)
   }

getNewParams()
      

打印出来的结构如下:

  • 14
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值