[javascript]数据兼容适配器--前后端JSON数组兼容适配器

项目中，通常会有前后端自定义数据的情况。前端在获取后端数据格式转化后，当两边的JSON对象中键名不一致时，需要先进行键名的兼容处理，才能进行数据渲染。

   //后台数据  转换前获取的数据
    var userBack = [
        {userid: 1, usercardId: "6225880287860549", userpwd: "909090", usermoney: 9000},
        {userid: 2, usercardId: "6225880287862345", userpwd: "666666", usermoney: 100},
        {userid: 3, usercardId: "6225880287862345", userpwd: "666666", usermoney: 100},
        {userid: 4, usercardId: "6225880287862345", userpwd: "909090", usermoney: 9000},
        {userid: 5, usercardId: "6225880287862345", userpwd: "666666", usermoney: 100}
    ];
  //转换关系
   var relations = {"userid":"id","usercardId":"cardId","userpwd":"pwd","usermoney":"money" };
  //前台模拟数据  转换后获取的数据
    var user = [
        {id: 1, cardId: "6225880287860549", pwd: "909090", money: 9000},
        {id: 2, cardId: "6225880287862345", pwd: "666666", money: 100},
        {id: 3, cardId: "6225880287862345", pwd: "666666", money: 100},
        {id: 4, cardId: "6225880287862345", pwd: "909090", money: 9000},
        {id: 5, cardId: "6225880287862345", pwd: "666666", money: 100},
    ];
以下是针对该问题，采用闭包的方式封装的JSON键名适配器。
1.首先搭建适配器的结构。
 //搭建适配器结构
   (function(){
       function myAdapter(userBack,relations){
           function user(){
               //进行json键名转换的私有方法
               var changeJson=function(){
               }
               this.getJson=function(){
                   //返回新的json
                   return changeJson();
               }
           }
           user.prototype=myAdapter.prototype;
           var jsonObj=new user();
           return jsonObj;
       }
       window.adapter=myAdapter;
   })();

采用闭包最常用的方式，函数作为返回值被返回，保证外部只能获得转换后的结果，而不能对内部实现进行修改。
 user.prototype=myAdapter.prototype;
预留了一个访问newJson原型的接口，方便对该适配器进行方法拓展。

2.在私有方法 changeJson（）中实现对JSON对象的转换操作。
主要思路是，提取转换关系中的键名，转换前JSON数组键值，组合成新的JSON对象数组。
   var changeJson=function(){
       // var oldKeys=Object.keys(demoJSON[0]);
       var newKeys=Object.keys(relations);
       var tempArr=[];
       for(var i=0;i<userBack.length;i++){
           var tempObj={};
           for(var j=0;j<Object.keys(userBack).length;j++){
               //对象[keys]=values
               tempObj[relations[newKeys[j]]]=userBack[Object.keys(userBack)[j]];
           }
           tempArr.push(tempObj);
       }
       user=tempArr;
       return user;
   }注意循环结构中获取JSON对象键名、键值时，对自增变量的使用，此处易出错。该适配器可单独作为一个文件引入项目，方便全局调用。3.引入适配器，调用并参数传递，打印结果。项目中引入myAdapter适配器文件。调用适配器传入目标JSON数组demoJSON，转换关系relation,打印结果  console.log("userBack");
   console.log(userBack);
   console.log("转换关系");
   console.log(relations);
   console.log(user);

图片：TIM图片20190510165957.png

参考链接:https://blog.csdn.net/qq_38177305/article/details/84383604

啊哈！果然有