Examine duplicate elements in two arrays in JavaScript

Question

I have two arrays, I want these two to be combined and duplicate items are not lit and only new items are added and I see the combined array in the console I also want to see the duplicate item in the list on the console I mean, I need two outputs, one to tell me what a duplicate is, and one to show me a new array of combinations of two arrays without duplicates. I wrote this code but it does not work properly Thanks for guiding me

Expected output:

newContact : [
  {
    "id": 1,
    "name": "Oliver"
  },
  {
    "id": 2,
    "name": "Liam"
  }
   {
    "id": 3,
    "name": "James"
  }
   {
    "id": 4,
    "name": "Lucas"
  }
]
duplicateContacts: Oliver

let array1 = [
  { id: 1, name: "Oliver" },
  { id: 2, name: "Liam" },
];
let array2 = [
  { id: 1, name: "Oliver" },
  { id: 3, name: "James" },
  { id: 4, name: "Lucas" },
];
let newContact = array1.filter((item) => item.id !== array2.id);
console.log("newContact :", newContact);
console.log("duplicateContacts:");

`array2` does not have a property of `id`? Did you mean to compare against an item in the equivalent index in `array2`? — evolutionxbox, Dec 01 '21 at 09:44
please add the wanted result. what should happen if `array1` has another object, not matching in `array2`? — Nina Scholz, Dec 01 '21 at 09:45

ProDec · Answer 1 · 2021-12-01T10:13:40.327

Guess duplicate meaning the same id, add array entries to a map to find duplicates, and the map contains unique items

const array1 = [
  { id: 1, name: "Oliver" },
  { id: 2, name: "Liam" },
];
const array2 = [
  { id: 1, name: "Oliver" },
  { id: 3, name: "James" },
  { id: 4, name: "Lucas" },
];

const duplicates = [];
const map = new Map();

const fill = (array) => array.forEach(item => {
  if (map.has(item.id)) {
    duplicates.push(item);
  } else {
    map.set(item.id, item);
  }
});

fill(array1);
fill(array2);

console.log(duplicates);
console.log([...map.values()]);

Edit

To take arrays as input, create a function

const inspect = (...arrays) => {
    const duplicates = [];
    const map = new Map();

    const fill = (array) => array.forEach(item => {
      if (map.has(item.id)) {
        duplicates.push(item);
      } else {
        map.set(item.id, item);
      }
    });

    arrays.forEach(array => fill(array));

    console.log(duplicates);
    console.log([...map.values()]);
};


const array1 = [
  { id: 1, name: "Oliver" },
  { id: 2, name: "Liam" },
];
const array2 = [
  { id: 1, name: "Oliver" },
  { id: 3, name: "James" },
  { id: 4, name: "Lucas" },
];

inspect(array1, array2);

Your code does what I expect, but can the `fill` function not be called twice and no need to be called? And give it the input ourselves — Good, Dec 01 '21 at 10:09
@Good see edit in the answer, you can create a function to accept your arrays as input — ProDec, Dec 01 '21 at 10:14

jeremy-denis · Answer 2 · 2021-12-01T10:44:02.090

2

with three methods :

filter to get an array of duplicate element
map to recover only an array of one column

some to describe how object in array should be compared

 const duplicates = array1.filter(value => array2.some(oneElement => oneElement.id === value.id));
const duplicatesId = array1.filter(value => array2.some(oneElement => oneElement.id === value.id)).map(oneElement => oneElement.id);


const mergedArray = [ 
 ...array1, 
 ...array2.filter(value => !duplicatesId.some(oneDuplicate => oneDuplicate === value.id))
];

const array1 = [
  { id: 1, name: "Oliver" },
  { id: 2, name: "Liam" },
];

const array2 = [
  { id: 1, name: "Oliver" },
  { id: 3, name: "James" },
  { id: 4, name: "Lucas" },
];

const duplicates = array1.filter(value => array2.some(oneElement => oneElement.id === value.id));
const duplicatesId = array1.filter(value => array2.some(oneElement => oneElement.id === value.id)).map(oneElement => oneElement.id);


const mergedArray = [ 
  ...array1, 
  ...array2.filter(value => !duplicatesId.some(oneDuplicate => oneDuplicate === value.id))
];

console.log(duplicates);
console.log(duplicatesId);
console.log(mergedArray);

edited Dec 01 '21 at 10:44

answered Dec 01 '21 at 09:54

jeremy-denis

6,368
3
18
35

The duplicate item does not tell me which one it is – Good Dec 01 '21 at 09:58
i edit my reply you can have them with another variable – jeremy-denis Dec 01 '21 at 09:59
I tested your code, it gives me an empty array, please check, thank you – Good Dec 01 '21 at 10:05
i edit my reply to have correct answer – jeremy-denis Dec 01 '21 at 10:27
we can't use array1.includes(valueFromArray2) because includes check if object are equal in memory and not have same shape https://stackoverflow.com/questions/49187940/javascript-using-includes-to-find-if-an-array-of-objects-contains-a-specific – jeremy-denis Dec 01 '21 at 10:28
True, this shows a duplicate, but we do not have a new array that is composed of arrays 1 and 2. Please see my expected output. – Good Dec 01 '21 at 10:33
i edit my reply to have a merged array – jeremy-denis Dec 01 '21 at 10:44

Nina Scholz · Answer 3 · 2021-12-01T09:59:26.650

You could take a Set from array2with all id and filter the other array.

const
    array1 = [{ id: 1, name: "Oliver" }, { id: 2, name: "Liam" }],
    array2 = [{ id: 1, name: "Oliver" }, { id: 3, name: "James" }, { id: 4, name: "Lucas" }],
    set2 = new Set(array2.map(({ id }) => id)),
    duplicateContacts = array1.filter(({ id }) => set2.has(id));
    allContacts = [...array1, ...array2].filter(
        (s => ({ id }) => !s.has(id) && s.add(id))
        (new Set)
    ),

console.log("allContacts:", allContacts);
console.log("duplicateContacts:", duplicateContacts);

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

He wanted the 1,2,3,4 in the first array – mplungjan Dec 01 '21 at 09:58 — mplungjan, Dec 01 '21 at 09:58

Examine duplicate elements in two arrays in JavaScript

3 Answers3