Javascript Question posted in
A very good W3school tutorial can be found here.

How to merge two array of objects and return some keys only in JavaScript

I want to merge two object arrays based on itemId into one object array with only some specific key.

I managed to merge it but it contains all the keys from both object arrays. I only want the orderId, name and itemName.

const arrOrder = [
  { orderId: 1, userId: 1, name: "Zack", itemId: 100 },
  { orderId: 2, userId: 2, name: "Robin", itemId: 200 }
];

const arrItem = [
  { itemId: 100, itemName: "Fruits", itemDescription: "Apple and Oranges" },
  { itemId: 200, itemName: "Snacks", itemDescription: "Potato Chips and Nuts" }
];

const mergedArray = arrOrder.map((order) => {
  const matchedObject = arrItem.find((item) => item.itemId === order.itemId);
  return { ...order, ...matchedObject };
});

console.log(mergedArray);

My desired result:

[{
  orderId: 1,
  name: 'Zack',
  itemName: 'Fruits'
}, {
  orderId: 2,
  name: 'Robin',
  itemName: 'Snacks'
}]

Which line of code can I change so that the merged object array only contains the key that I wanted?

I tried to do this way but to no avail.

const mergedArray = arrOrder.map((order) => {
  const matchedObject = arrItem.find((item) => item.itemId === order.itemId);
  return { order.id, order.name, matchedObject.itemName };
});
Tags:

2

Answers


  1. 0

    The issue is because you’re using the spread operator, which will include every property by default.

    If you don’t want that then can instead manually specify the property names to include and give them a value:

    return {
  orderId: order.orderId,
  name: order.name,
  itemName: matchedObject.itemName
};

    Here’s a full working example:

    const arrOrder = [
  { orderId: 1, userId: 1, name: "Zack", itemId: 100 },
  { orderId: 2, userId: 2, name: "Robin", itemId: 200 }
];

const arrItem = [
  { itemId: 100, itemName: "Fruits", itemDescription: "Apple and Oranges" },
  { itemId: 200, itemName: "Snacks", itemDescription: "Potato Chips and Nuts" }
];

const mergedArray = arrOrder.map((order) => {
  const matchedObject = arrItem.find((item) => item.itemId === order.itemId);
  return {
    orderId: order.orderId,
    name: order.name,
    itemName: matchedObject.itemName
  };
});

console.log(mergedArray);
    Login or Signup to reply.
  2. 0

    Can’t comment on Rory’s answer since I am new to SO but would just add to Rory’s answer in that, yes, it totally works. BUT, if you start working with larger arrays of items the time complexity will increase proportionally, a different answer may look like this, mapping your item array to a hash map with the key being the itemId (or other shared value) and the value being the itemName:

    const arrOrder = [
    { orderId: 1, userId: 1, name: "Zack", itemId: 100 },
    { orderId: 2, userId: 2, name: "Robin", itemId: 200 }
];

const arrItem = [
    { itemId: 100, itemName: "Fruits", itemDescription: "Apple and Oranges" },
    { itemId: 200, itemName: "Snacks", itemDescription: "Potato Chips and Nuts" }
];

const itemMap = arrItem.reduce((acc, item) => {
    acc[item.itemId] = item.itemName;
    return acc;
}, {});

const mergedArray = arrOrder.map((order) => ({
    orderId: order.orderId,
    name: order.name,
    itemName: itemMap[order.itemId]
}));

console.log(mergedArray)

    I’m terrible at complexity but I believe this is O(n*m) vs O(n+m)?

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search