擁有兩個 JSON 陣列，我想將它們合并到一個 finall JSON 陣列中。基本陣列如下具有子級別：
r1=[{
"item_guid": "5c2000c1-abc8-4d6f-85de-b8b223a42a2f",
"item_id": 1,
"parent_item_id": null,
"description": "1",
"sub_items": [
{
"item_guid": "bd7c2ba3-268b-49f6-98fb-34486a3e1449",
"item_id": 10,
"parent_item_id": 1,
"description": "1.1",
"sub_items": []
},
{
"item_guid": "80e073e0-2aa8-422a-9f28-51747f146bd8",
"item_id": 12,
"parent_item_id": 1,
"description": "1.2",
"sub_items": [
{
"item_guid": "f97af55c-c90e-46c2-b56e-e854ff36e1e3",
"item_id": 78,
"parent_item_id": 12,
"description": "1.2.1",
"sub_items": []
},
{
"item_guid": "28469fa4-2c1c-4f2a-9250-7460a74cc30a",
"item_id": 79,
"parent_item_id": 12,
"description": "1.2.2",
"sub_items": [
{
"item_guid": "f97af55c-c90e-46c2-b56e-e854ff36e1e9",
"item_id": 80,
"parent_item_id": 12,
"description": "1.2.2.1",
"sub_items": []
},
]
}
],
},
{
"item_guid": "846daeab-edd4-4cf2-8f12-8d7231c697e3",
"item_id": 13,
"parent_item_id": 1,
"description": "1.3",
"sub_items": [],
},
],
}]
第二個陣列用于將其專案復制到第一個陣列中的匹配元素：
r2=[
{
"item_guid": "bd7c2ba3-268b-49f6-98fb-34486a3e1449",
"mandatory": "True",
"comment": "Item cross-reference 1.1"
},
{
"item_guid": "f97af55c-c90e-46c2-b56e-e854ff36e1e3",
"mandatory": "True",
"comment": "Item cross-reference 1.2.1"
},
{
"item_guid": "f97af55c-c90e-46c2-b56e-e854ff36e1e9",
"mandatory": "True",
"comment": "Item cross-reference 1.2.2.1"
}]
結果應如下所示：
r3=[{
"item_guid": "5c2000c1-abc8-4d6f-85de-b8b223a42a2f",
"item_id": 1,
"parent_item_id": null,
"description": "1",
"sub_items": [
{
"item_guid": "bd7c2ba3-268b-49f6-98fb-34486a3e1449",
"item_id": 10,
"parent_item_id": 1,
"description": "1.1",
"mandatory": "True",
"comment": "Item cross-reference 1.1"
"sub_items": []
},
{
"item_guid": "80e073e0-2aa8-422a-9f28-51747f146bd8",
"item_id": 12,
"parent_item_id": 1,
"description": "1.2",
"sub_items": [
{
"item_guid": "f97af55c-c90e-46c2-b56e-e854ff36e1e3",
"item_id": 78,
"parent_item_id": 12,
"description": "1.2.1",
"mandatory": "True",
"comment": "Item cross-reference 1.2.1"
"sub_items": []
},
{
"item_guid": "28469fa4-2c1c-4f2a-9250-7460a74cc30a",
"item_id": 79,
"parent_item_id": 12,
"description": "1.2.2",
"sub_items": [
{
"item_guid": "f97af55c-c90e-46c2-b56e-e854ff36e1e9",
"item_id": 80,
"parent_item_id": 12,
"description": "1.2.2.1",
"mandatory": "True",
"comment": "Item cross-reference 1.2.2.1"
"sub_items": []
},
]
}
],
},
{
"item_guid": "846daeab-edd4-4cf2-8f12-8d7231c697e3",
"item_id": 13,
"parent_item_id": 1,
"description": "1.3",
"sub_items": [],
},
],
}]
我試圖迭代第一個陣列以匹配第二個陣列中的元素，如下所示，但我認為它需要一些遞回來繼續檢查子級別。我可以使用地圖嗎？
const mergeById = (r1, r2) =>
r1.map(itm => {
itm.sub_items = itm.sub_items.map(sub_item => (
{ ...sub_item,
...r2.find(r2_item => r2_item.item_guid === sub_item.item_guid),
}
)
)
return itm
})
console.log(mergeById(r1,r2))
uj5u.com熱心網友回復：
我會說你的.map()嘗試正朝著正確的方向前進，而且你也預感需要遞回。有效的是
function mergeById(r1, r2) {
return r1.map(({item_guid, sub_items, ...rest}) => Object.assign(
rest,
{item_guid},
r2.find(_ => _.item_guid === item_guid),
{sub_items: mergeById(sub_items, r2)}
));
}
const r1 = [{item_guid: "5c2000c1-abc8-4d6f-85de-b8b223a42a2f", item_id: 1, parent_item_id: null, description: "1", sub_items: [{item_guid: "bd7c2ba3-268b-49f6-98fb-34486a3e1449", item_id: 10, parent_item_id: 1, description: "1.1", sub_items: []}, {item_guid: "80e073e0-2aa8-422a-9f28-51747f146bd8", item_id: 12, parent_item_id: 1, description: "1.2", sub_items: [{item_guid: "f97af55c-c90e-46c2-b56e-e854ff36e1e3", item_id: 78, parent_item_id: 12, description: "1.2.1", sub_items: []}, {item_guid: "28469fa4-2c1c-4f2a-9250-7460a74cc30a", item_id: 79, parent_item_id: 12, description: "1.2.2", sub_items: [{item_guid: "f97af55c-c90e-46c2-b56e-e854ff36e1e9", item_id: 80, parent_item_id: 12, description: "1.2.2.1", sub_items: []}]}]}, {item_guid: "846daeab-edd4-4cf2-8f12-8d7231c697e3", item_id: 13, parent_item_id: 1, description: "1.3", sub_items: []}]}]
const r2 = [{item_guid: "bd7c2ba3-268b-49f6-98fb-34486a3e1449", mandatory: "True", comment: "Item cross-reference 1.1"}, {item_guid: "f97af55c-c90e-46c2-b56e-e854ff36e1e3", mandatory: "True", comment: "Item cross-reference 1.2.1"}, {item_guid: "f97af55c-c90e-46c2-b56e-e854ff36e1e9", mandatory: "True", comment: "Item cross-reference 1.2.2.1"}]
console.log(mergeById(r1, r2)).as-console-wrapper {max-height: 100% !important; top: 0}編輯1：item_guid按照@Xupitan 的指出添加
編輯2：rest按照@Scott Sauyet 的建議用作一次性物品
uj5u.com熱心網友回復：
這主要是 Dominik Schreiber 出色答案的變體。這是相同的技術，只是具有不同的編碼風格，使用物件傳播而不是Object .assign.
const deepMerge = (r1, r2) =>
r1 .map (({item_guid, sub_items, ...rest}) => ({
item_guid,
... rest,
... (r2 .find ((i) => i .item_guid == item_guid)),
sub_items: deepMerge (sub_items, r2)
}))
const r1 = [{item_guid: "5c2000c1-abc8-4d6f-85de-b8b223a42a2f", item_id: 1, parent_item_id: null, description: "1", sub_items: [{item_guid: "bd7c2ba3-268b-49f6-98fb-34486a3e1449", item_id: 10, parent_item_id: 1, description: "1.1", sub_items: []}, {item_guid: "80e073e0-2aa8-422a-9f28-51747f146bd8", item_id: 12, parent_item_id: 1, description: "1.2", sub_items: [{item_guid: "f97af55c-c90e-46c2-b56e-e854ff36e1e3", item_id: 78, parent_item_id: 12, description: "1.2.1", sub_items: []}, {item_guid: "28469fa4-2c1c-4f2a-9250-7460a74cc30a", item_id: 79, parent_item_id: 12, description: "1.2.2", sub_items: [{item_guid: "f97af55c-c90e-46c2-b56e-e854ff36e1e9", item_id: 80, parent_item_id: 12, description: "1.2.2.1", sub_items: []}]}]}, {item_guid: "846daeab-edd4-4cf2-8f12-8d7231c697e3", item_id: 13, parent_item_id: 1, description: "1.3", sub_items: []}]}]
const r2 = [{item_guid: "bd7c2ba3-268b-49f6-98fb-34486a3e1449", mandatory: "True", comment: "Item cross-reference 1.1"}, {item_guid: "f97af55c-c90e-46c2-b56e-e854ff36e1e3", mandatory: "True", comment: "Item cross-reference 1.2.1"}, {item_guid: "f97af55c-c90e-46c2-b56e-e854ff36e1e9", mandatory: "True", comment: "Item cross-reference 1.2.2.1"}]
console .log (deepMerge (r1, r2)).as-console-wrapper {max-height: 100% !important; top: 0}轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/487134.html
標籤：javascript 数组 递归