js 实现 多层级对象合并

首先

需求是使用js对数据的格式进行转换 把一个二维数组(包含层级信息,层级数是不固定的)list 转换为多层级的对象

我的思路就是 循环先把list里单条信息转换为 多层级对象 然后和上一条 进行合并

原数据类型:

 [{
     id:a_a1_a2,
     value:1
 },{
     id:a_a2_a2,
     value:2
 },{
     id:b_b1,
     value:3
 }]

分别转换为:

 [a{
     a1{
         a2:1
     }
 }]
 [a{
     a2{
         a2:2
     }
 }]
 [b{
     b1:3
  }]

最终合并效果:

 {a{
     a1{
         a2:1
     },
     a2{
         a2:2
     }
  },
  b{
     b1:3
  }
  }

 

   
 onSubmit(): void {
 ​
     // 整理 item 数据
 ​
     let itemsListInfo = {};
 ​
     //this.addItemListData 存放的原始数据
     for (let i = 0; i < this.addItemListData.length; i++) {
 ​
       const itemTree = this.addItemListData[i].id.split('_');
 ​
       // 按照格式整理 当前item
       let thisItemInfo = {};
 ​
       for (let y = itemTree.length - 1; y >= 0; y--) {
 ​
         if (y === itemTree.length - 1) {
 ​
           thisItemInfo[itemTree[y]] = this.addItemListData[i].value;
 ​
         } else {
 ​
           // 如果直接赋值 会出现问题 需要使用另一个变量暂存
           const data = thisItemInfo;
           thisItemInfo = {};
           thisItemInfo[itemTree[y]] = data;
 ​
         }
 ​
       }
 ​
       console.log(thisItemInfo);
       // 合并当前item 到itemListInfo
 ​
       const itemTreeIndex = 0;
 ​
       itemsListInfo = this.margeItem(itemsListInfo, thisItemInfo, itemTree, itemTreeIndex, this.addItemListData[i]);
 ​
     }
 ​
   }
 ​
   margeItem(itemsListInfo: any, thisItemInfo: any, itemTree: any, itemTreeIndex: number, addItemListData: any): any {
 ​
     // 递归 判断是否存在相同层级
     // 直到 没有相同层级后 合并对象到上一级
     // 注意 如果是初次进入(没有上一级) 就直接赋值
 ​
     if (itemsListInfo.hasOwnProperty(itemTree[itemTreeIndex])) {
 ​
       itemsListInfo[itemTree[itemTreeIndex]]
         = this.margeItem(
           itemsListInfo[itemTree[itemTreeIndex]],
           thisItemInfo[itemTree[itemTreeIndex]],
           itemTree,
           itemTreeIndex + 1,
           addItemListData
         );
 ​
       return itemsListInfo;
     } else {
 ​
       let lastData = {};
 ​
       if (itemsListInfo.hasOwnProperty(itemTree[itemTreeIndex - 1])) {
 ​
         lastData = itemsListInfo[itemTree[itemTreeIndex - 1]];
         lastData[itemTree[itemTreeIndex]] = thisItemInfo[itemTree[itemTreeIndex]];
 ​
       } else {
 ​
         lastData = thisItemInfo[itemTree[itemTreeIndex]];
       }
 ​
       itemsListInfo[itemTree[itemTreeIndex]] = lastData;
       return itemsListInfo;
 ​
     }
 ​
   }

 

最后itemsListInfo就是我需要的最终格式