How to Merge two array with different key but same value in Javascript?

Question

I have two objects which I am trying to merge with different key The first object I need to compare with Id and my second object I need to compare with Option.

And My final expected output i have mentioned below

Apologize my bad formatting . I'm literally new to this forum. Please help.

Thanks in Advance.

My First Object

[
  {
    Category__c: "Option",
    Description__c: "Exdoor",
    Id: "a0F1e000000EgcGEAS",
    Name: "with door"
  },
  {
    Category__c: "Upgrade",
    Description__c: "Exdoor",
    Id: "a0F1e000000EgcHEAS",
    Name: "Upgrade"
  },
  {
    Category__c: "New Option",
    Description__c: "1300 wide with doors",
    Id: "a0F1e000000EgcIEAS",
    Name: "doors"
  },
  {
    Category__c: "Oven",
    Description:"1450 Door",
    Id: "a0F1e000000EgcJEAS",
    Name: "Oven Option: Wall Oven"
  }
]

My second Object

[
  {
    Option: "a0F1e000000EgcJEAS",
    Price: 0
  }
]

Now My expected output is

[
  {
    Category__c: "Option",
    Description__c: "Exdoor",
    Id: "a0F1e000000EgcGEAS",
    Name: "with door"
  },
  {
    Category__c: "Upgrade",
    Description__c: "Exdoor",
    Id: "a0F1e000000EgcHEAS",
    Name: "Upgrade"
  },
  {
    Category__c: "New Option",
    Description__c: "1300 wide with doors",
    Id: "a0F1e000000EgcIEAS",
    Name: "doors"
  },
  {
    Category__c: "Oven",
    Description:"1450 Door",
    Id: "a0F1e000000EgcJEAS",
    Price: 0,
    Name: "Oven Option: Wall Oven"
  }
]

Ran Turner · Answer 1 · 2021-04-20T09:35:25.513

1

You can use Array.prototype.forEach() which executes a provided function once for each array element.

In the forEach we will check if the current data.id equals to the selected option. if so, we will use the dot notation to add it's price to the data.

Edited : i updated the code to grey 123 request and changed selected to be array and for his request

const data = [
{
Category__c: "Option",
Description__c: "Exdoor",
Id: "a0F1e000000EgcGEAS",
Name: "with door"

},
{
 Category__c: "Upgrade",
Description__c: "Exdoor",
Id: "a0F1e000000EgcHEAS",
Name: "Upgrade"

},
{
Category__c: "New Option",
Description__c: "1300 wide with doors",
Id: "a0F1e000000EgcIEAS",
Name: "doors"
},
{
Category__c: "Oven",
Description:"1450 Door",
Id: "a0F1e000000EgcJEAS",
Name: "Oven Option: Wall Oven"
}];

const options = [{
     Option: "a0F1e000000EgcJEAS",
     Price: 0
}];

data.forEach(x => {
  const selected = options.find(y => y.Option === x.Id);
  if (selected){
  x.Price = selected.Price;
  }
})

console.log(data);

edited Apr 20 '21 at 09:35

answered Apr 20 '21 at 08:59

Ran Turner

14,906
5
47
53

Ran Turner I don't have a field called Price in my data list how to add the price field in the Data list – grey 123 Apr 20 '21 at 09:06
using the dot notation. look at the code above – Ran Turner Apr 20 '21 at 09:07
selection is also an array not single object Ran Turner – grey 123 Apr 20 '21 at 09:16
I updated my answer and changed selected to array (assumed the chosen selected object is at index 0.. – Ran Turner Apr 20 '21 at 09:21
@RanTurner I didn't copy your answer mate, I've proposed a new way of solving the problem. I've seen your answer and `upvoted` it to make it useful. But recent changes that you've made are not what OP wants. The array may contain more than one object. So it's not the right solution.You need to find the object in the `selected` array then add `Price` – DecPK Apr 20 '21 at 09:24
I updated the answer according to grey 123 changes. – Ran Turner Apr 20 '21 at 09:30
@grey123 please look at the updated answer – Ran Turner Apr 20 '21 at 09:31
@decpk its the same code resides the map but what ever makes you feel right.. – Ran Turner Apr 20 '21 at 09:32
That's what OP wants... @RanTurner ☺ – DecPK Apr 20 '21 at 09:34

DecPK · Answer 2 · 2021-04-20T09:20:09.750

1

It would be better not to mutate the original object instead make changes in new object.

const data = [
  {
    Category__c: "Option",
    Description__c: "Exdoor",
    Id: "a0F1e000000EgcGEAS",
    Name: "with door",
  },
  {
    Category__c: "Upgrade",
    Description__c: "Exdoor",
    Id: "a0F1e000000EgcHEAS",
    Name: "Upgrade",
  },
  {
    Category__c: "New Option",
    Description__c: "1300 wide with doors",
    Id: "a0F1e000000EgcIEAS",
    Name: "doors",
  },
  {
    Category__c: "Oven",
    Description: "1450 Door",
    Id: "a0F1e000000EgcJEAS",
    Name: "Oven Option: Wall Oven",
  },
];

const selected = [
  {
    Option: "a0F1e000000EgcJEAS",
    Price: 0,
  },
];

const result = data.map((obj) => {
  const searchObj = selected.find(({ Option, Price }) => Option === obj.Id);
  if (searchObj) return { ...obj, Price: searchObj.Price };
  return obj;
});

console.log(result);

edited Apr 20 '21 at 09:20

answered Apr 20 '21 at 09:09

DecPK

24,537
6
26
42

decpk const Selected is also an array not a single object – grey 123 Apr 20 '21 at 09:13
okk let me change my answer – DecPK Apr 20 '21 at 09:14
You just copied my answer and changed to map.. – Ran Turner Apr 20 '21 at 09:16
please show me sir how to do I'm literally new sir Ran Turner – grey 123 Apr 20 '21 at 09:17
i meant @decpk.. – Ran Turner Apr 20 '21 at 09:19
const selected =[ { Option: "a0F1e000000EgcJEAS", Price: 0, }, Option: "a0F1e000000EgcIEAS", Price: 20, }] – grey 123 Apr 20 '21 at 09:19
@grey123 Is this what you want – DecPK Apr 20 '21 at 09:20
1

Yes sir @decpk thanks a lot for quick response. – grey 123 Apr 20 '21 at 09:24
@Ran Turner Thanks a lot.Praise the Lord – grey 123 Apr 20 '21 at 09:24
@grey123 Then accept one of the answers – DecPK Apr 20 '21 at 09:26

score 1 · Answer 3 · answered Apr 20 '21 at 09:36

Below will do

let one = [{
        Category__c: "Option",
        Description__c: "Exdoor",
        Id: "a0F1e000000EgcGEAS",
        Name: "with door",

    },

    {
        Category__c: "Upgrade",
        Description__c: "Exdoor",
        Id: "a0F1e000000EgcHEAS",
        Name: "Upgrade",

    },

    {
        Category__c: "New Option",
        Description__c: "1300 wide with doors",
        Id: "a0F1e000000EgcIEAS",
        Name: "doors",

    },
    {
        Category__c: "Oven",
        Description: "1450 Door",
        Id: "a0F1e000000EgcJEAS",
        Name: "Oven Option: Wall Oven"
    }
]

let two = [{
    Option: "a0F1e000000EgcJEAS",
    Price: 0,
}]

function merge(one, two, oneKey, twoKey) {
  var byMap = {}
  two.forEach((el)=> {
    byMap[el[twoKey]] = el;
  });
  one.forEach((el)=> {
    Object.assign(el, byMap[el[oneKey]] || {});
  });
}
merge(one, two, "Id", "Option")
console.log(one)

How to Merge two array with different key but same value in Javascript?

3 Answers3