Concatenate two arrays of objects and remove repeated data from an attribute

Question

I have 2 arrays of objects. One array receives the data from the API and renders it in the application, the other receives the data from localStorage, which are data from the first and which have been changed and stored in localStorage. I want to concatenate these two arrays, but I need to remove the repeated data in order not to render the same object twice.

example of what I hope:

dado1 = [
  {customer: {
    purchased: false,
    id: 1
  }}, 
  {customer: {
      purchased: false,
      id: 2
  }}
]

dado2 = [
  {customer: {
    purchased: true,
    id: 1
  }}
]

dado3 = dado1.concat (dado2)

result: 
dado3 = [
  {customer: {
    purchased: true,
    id: 1
  }}, 
  {customer: {
    purchased: false,
    id: 2
  }}
]

I am not able to compare the two arrays. I've thought of several ways, but I always fail

You want to get all elments of dado2 plus the elements of dado1 which haven't an id in dado2, is this right? — Sascha, Jul 29 '20 at 20:42
please clarify how you decide which repeated data you want to keep, in the example you keep the true value for id 1, how was that decided? — Erica T., Jul 29 '20 at 20:47
Yes. I want to join the two arrays together, but remove the objects from data1 that have the same id as data2 — Kewin Costa, Jul 29 '20 at 20:50
This looks a lot like [How to merge two arrays in JavaScript and de-duplicate items](https://stackoverflow.com/q/1584370/215552) — Heretic Monkey, Jul 29 '20 at 20:58
The answer I chose for my question is much more practical to use. But thanks for sharing, I didn't find that answer, because I'm a new user — Kewin Costa, Jul 29 '20 at 21:10

Mister Jojo · Accepted Answer · 2020-07-29T20:58:49.973

0

some thing like that ?

const dado1 = 
      [ { customer: { purchased: false, id: 1 } } 
      , { customer: { purchased: false, id: 2 } } 
      ] 
const dado2 = 
      [ { customer: { purchased: true, id: 1 } } 
      ] 


const dado3 = dado1.map(el=>
  {
  let nv = dado2.find(x=>x.customer.id === el.customer.id )
  return nv? nv : el
  })

console.log(  dado3  )

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

but be carrefull, this is array of object of object so prefer to use

const dado3 = dado1.map(el=>
  {
  let nv = dado2.find(x=>x.customer.id === el.customer.id )
  return nv? JSON.parse(JSON.stringify(nv)) : JSON.parse(JSON.stringify(el))
  })

if you want a real new array

edited Jul 29 '20 at 20:58

answered Jul 29 '20 at 20:53

Mister Jojo

12,060
3
14
33

This fails if `dado2` has elements with ids not present in `dado1` (although upon re-reading the question this may not be an issue!). This also has awkward O(n^2) performance... – Gershy Jul 29 '20 at 20:55
I check first if the matrix exists and if it has the attribute before concatenating. – Kewin Costa Jul 29 '20 at 20:57

score 0 · Answer 2 · answered Jul 29 '20 at 20:54

You can make your customer objects unique by mapping them by the id field, and ensuring that entries from the 2nd object take precedence (this will prefer local storage over api results):

let mergeCustomerData = (arr1, arr2) => {
  
  // Both arrays are converted to maps, where the `item.customer.id` property determines the key
  [ arr1, arr2 ] = [ arr1, arr2 ].map(arr => new Map(arr.map(v => [ v.customer.id, v ])));
  
  // Merge these Maps into one (preference determined by the order of `arr1` and `arr2`)
  let merged = new Map([ ...arr1, ...arr2 ]);
  
  // Return the merged values, converted back to an Array
  return [ ...merged ].map(([ id, v ]) => v);
  
};

let dado1 = [
  { customer: { purchased: false, id: 1 } }, 
  { customer: { purchased: false, id: 2 } }
];

let dado2 = [
  { customer: { purchased: true, id: 1 } }
];

console.log(mergeCustomerData(dado1, dado2));

score 0 · Answer 3 · answered Jul 29 '20 at 21:12

Collect the ids from the second array. Take as result the second array plus all elements from the first array which have a id that is not in the stored ids.

dado1 = [
  {customer: { purchased: false, id: 1 }}, 
  {customer: { purchased: false, id: 2 }}
];

dado2 = [
  {customer: { purchased: true, id: 1 }},
  {customer: { purchased: true, id: 5 }}
];

function concatDado( dado1, dado2) {
    let result = dado2;
  let ids = [];
  dado2.forEach(element => ids.push(element.customer.id));
 
  dado1.forEach(element => {
    id = element.customer.id;
    if ( ids.indexOf(id) == -1 )
        result.push(element);
  });
  
  return result;
}
 
console.log( concatDado( dado1, dado2));

Concatenate two arrays of objects and remove repeated data from an attribute

3 Answers3