從另一組對象數組中將屬性添加到另一個對象數組

Question

假設我有 2 個對象數組，我想有條件地將一個對象添加到另一個對象中。

let aData = [
  {
    id: 1,
    item: "shirt",
    price: "24.99",
    quantity: "1"
  },
  {
    id: 2,
    item: "pants",
    price: "34.99",
    quantity: "5"
  }
]

let bData = [
  {
    id: 1,
    item_id: 1,
    url: "imagelink.jpg"
  },
  {
    id: 2,
    item_id: 1,
    url: "image2link.jpg"
  },
  {
    id: 3,
    item_id: 2,
    url: "image3link.jpg"
  },
  {
    id: 4,
    item_id: 2,
    url: "image4link.jpg"
  {
]

我想要的是將所有bData添加到aData如果 bData[i].item_id == aData[i].id

let cData = [
  {
    id: 1,
    item: "shirt",
    price: "24.99",
    quantity: "1",
    images: [
      {
        id: 1,
        item_id: 1,
        url: "imagelink.jpg"
      },
      {
        id: 2,
        item_id: 1,
        url: "image2link.jpg"
      }
    ]
  },
  {
   etc...
  }
]

我處於停滯狀態，這就是我到目前為止想出的

let temp = [];
for (i = 0; i < aData.length; i++) {
        let temp2 = [];
        
        temp2.push(aData[i]);
        let tempImages = {};
        for (k = 0; k < bData.length; k++) {
          if (aData[i].id == bData[k].item_id) {
            
            tempImages[k] = bData[k];
          }
        }
        temp2.images = tempImages;
        temp.push(temp2)
      }

這不是我需要的

Answer 1

這段代碼對我有用。

temp = []
for (i = 0; i < aData.length; i++) {
    if (aData[i].id == bData[i].item_id) {
        temp.push(bData[i]);
    }
}

aData = aData.concat(temp);
console.log(aData);

Answer 2

我寧願使用map和filter以非常干凈的方式完成這項工作。

代碼應該是：

const result = aData.map(a => {
  a.images = bData.filter(b => b.item_id === a.id);
  return a;
})

這是您的示例數據的工作示例。

 let aData = [{ id: 1, item: "shirt", price: "24.99", quantity: "1" }, { id: 2, item: "pants", price: "34.99", quantity: "5" } ] let bData = [{ id: 1, item_id: 1, url: "imagelink.jpg" }, { id: 2, item_id: 1, url: "image2link.jpg" }, { id: 3, item_id: 2, url: "image3link.jpg" }, { id: 4, item_id: 2, url: "image4link.jpg" } ] const result = aData.map(a => { // use Object.assign to avoid changing the reference of aData const completeObject = Object.assign({}, a) completeObject.images = bData.filter(b => b.item_id === a.id); return completeObject; }) console.log(result)

Answer 3

您可以首先通過使用item_id和 map 所有具有新屬性images的項目進行分組來收集所有圖像。

這種方法只需要對每個數組進行一次迭代。

 const items = [{ id: 1, item: "shirt", price: "24.99", quantity: "1" }, { id: 2, item: "pants", price: "34.99", quantity: "5" }], images = [{ id: 1, item_id: 1, url: "imagelink.jpg" }, { id: 2, item_id: 1, url: "image2link.jpg" }, { id: 3, item_id: 2, url: "image3link.jpg" }, { id: 4, item_id: 2, url: "image4link.jpg" }], imagesByItems = images.reduce((r, o) => ((r[o.item_id]??= []).push(o), r), {}), result = items.map(o => ({...o, images: imagesByItems[o.id] || [] })); console.log(result);

 .as-console-wrapper { max-height: 100%;important: top; 0; }