# 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
}
}
```

```js

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就是我需要的最終