compare two object arrays by javascript keys

Question

I am working with javascript I have two arrangements that for the example look like this:

const arr1 = [
    { url: 1, 'title': 'A', 'title2': 'A2' },
    { url: 2, 'title': 'B', 'title2': 'B2' },
    { url: 3, 'title': 'C', 'title2': 'C2' },
    { url: 4, 'title': 'D', 'title2': 'D2' },
    { url: 5, 'title': 'E', 'title2': 'E2' },
]

const arr2 = [
    { url: 1, 'title': 'A', 'title2': 'J2' },
    { url: 2, 'title': 'J', 'title2': 'B2' },
    { url: 3, 'title': 'C', 'title2': 'C2' },
    { url: 4, 'title': 'D', 'title2': 'D2' },
    { url: 5, 'title': 'K', 'title2': 'E2' },
]

I would like to obtain from the second array those objects that are different either the title or title2

I tried the following but it doesn't work for me, where am I getting lost?

const res = arr2.filter((page1) => !arr1.some(page2 => page1.title === page2.title || page2.title2 == page1.title2 ))

the expected result is this for the example:

[{ url: 1, 'title': 'A', 'title2': 'J2' },{"url":2,"title":"J","title2":"B2"},{"url":5,"title":"K","title2":"E2"}]

You are not looking for the url.

epascarello
– epascarello

2022-01-07 19:33:28 +00:00
Commented Jan 7, 2022 at 19:33 — epascarello
– epascarello, Commented Jan 7, 2022 at 19:33

Kinglish · Accepted Answer · 2022-01-07 19:35:50Z

1

If I am understanding your goal, it is to first match URLs and THEN find out if there is a discrepency in the titles. If that is correct, this will get you there.

const res = arr2.filter(page1 => {
  // find URL match
  let page2 = arr1.find(f => f.url === page1.url) 
  return !page2 || page2.title != page1.title || page2.title2 != page1.title2;
})

const arr1 = [
    { url: 1, 'title': 'A', 'title2': 'A2' },
    { url: 2, 'title': 'B', 'title2': 'B2' },
    { url: 3, 'title': 'C', 'title2': 'C2' },
    { url: 4, 'title': 'D', 'title2': 'D2' },
    { url: 5, 'title': 'E', 'title2': 'E2' },
]

const arr2 = [
    { url: 1, 'title': 'A', 'title2': 'J2' },
    { url: 2, 'title': 'J', 'title2': 'B2' },
    { url: 3, 'title': 'C', 'title2': 'C2' },
    { url: 4, 'title': 'D', 'title2': 'D2' },
    { url: 5, 'title': 'K', 'title2': 'E2' },
]

const res = arr2.filter(page1 => {
  // find URL match
  let page2 = arr1.find(f => f.url === page1.url) 
  return !page2 || page2.title != page1.title || page2.title2 != page1.title2;
})
console.log(res)

answered Jan 7, 2022 at 19:35

Kinglish

23.7k4 gold badges25 silver badges43 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

FeRcHo Over a year ago

the answer is correct and very similar to mine, could you please explain to me what was wrong with my solution, so as not to make that mistake and learn

Kinglish Over a year ago

In your attempt, you didn't first find the corresponding matching URL before comparing the titles.

Nina Scholz · Accepted Answer · 2022-01-07 19:35:51Z

You could collect all objects from array1 in an object by using url as key and filter the second array by checking title and title2.

const
    array1 = [{ url: 1, 'title': 'A', 'title2': 'A2' }, { url: 2, 'title': 'B', 'title2': 'B2' }, { url: 3, 'title': 'C', 'title2': 'C2' }, { url: 4, 'title': 'D', 'title2': 'D2' }, { url: 5, 'title': 'E', 'title2': 'E2' }],
    array2 = [{ url: 1, 'title': 'A', 'title2': 'J2' }, { url: 2, 'title': 'J', 'title2': 'B2' }, { url: 3, 'title': 'C', 'title2': 'C2' }, { url: 4, 'title': 'D', 'title2': 'D2' }, { url: 5, 'title': 'K', 'title2': 'E2' }],
    keys = ['title', 'title2'],
    urls = Object.fromEntries(array1.map(o => [o.url, o])),
    result = array2.filter(o => keys.some(k => o[k] !== urls[o.url][k]));

console.log(result);

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

epascarello · Accepted Answer · 2022-01-07 19:39:12Z

Easiest is to map the one to a look up and loop over the second.

const arr1 = [
    { url: 1, 'title': 'A', 'title2': 'A2' },
    { url: 2, 'title': 'B', 'title2': 'B2' },
    { url: 3, 'title': 'C', 'title2': 'C2' },
    { url: 4, 'title': 'D', 'title2': 'D2' },
    { url: 5, 'title': 'E', 'title2': 'E2' },
];

const arr2 = [
    { url: 1, 'title': 'A', 'title2': 'J2' },
    { url: 2, 'title': 'J', 'title2': 'B2' },
    { url: 3, 'title': 'C', 'title2': 'C2' },
    { url: 4, 'title': 'D', 'title2': 'D2' },
    { url: 5, 'title': 'K', 'title2': 'E2' },
];

const arr1MapByUrl = arr1.reduce((acc, data) => {
  acc[data.url] = data;
  return acc;
}, {});

const results = arr2.filter(data => {
  const org = arr1MapByUrl[data.url];
  return !org || data.title !== org.title || data.title2 !== org.title2;
});

console.log(results);

If you do not want to hard code the keys to check, you can loop over them with some() and compare them.

const arr1 = [
    { url: 1, 'title': 'A', 'title2': 'A2' },
    { url: 2, 'title': 'B', 'title2': 'B2' },
    { url: 3, 'title': 'C', 'title2': 'C2' },
    { url: 4, 'title': 'D', 'title2': 'D2' },
    { url: 5, 'title': 'E', 'title2': 'E2' },
];

const arr2 = [
    { url: 1, 'title': 'A', 'title2': 'J2' },
    { url: 2, 'title': 'J', 'title2': 'B2' },
    { url: 3, 'title': 'C', 'title2': 'C2' },
    { url: 4, 'title': 'D', 'title2': 'D2' },
    { url: 5, 'title': 'K', 'title2': 'E2' },
];

const arr1MapByUrl = arr1.reduce((acc, data) => {
  acc[data.url] = data;
  return acc;
}, {});

const results = arr2.filter(data => {
  const org = arr1MapByUrl[data.url];
  return !org || Object.entries(data).some(([key, value]) => org[key] !== value);
});

console.log(results);

Siva Kondapi Venkata · Accepted Answer · 2022-01-07 23:32:44Z

0

Build an object to track the titles based on arr1 and use same object to filter arr2

const arr1=[{url:1,title:"A",title2:"A2"},{url:2,title:"B",title2:"B2"},{url:3,title:"C",title2:"C2"},{url:4,title:"D",title2:"D2"},{url:5,title:"E",title2:"E2"}];

const arr2=[{url:1,title:"A",title2:"J2"},{url:2,title:"J",title2:"B2"},{url:3,title:"C",title2:"C2"},{url:4,title:"D",title2:"D2"},{url:5,title:"K",title2:"E2"}];

const track = {};
arr1.forEach(({ url, title, title2 }) =>
  Object.assign(track, { [url]: { [title]: title2 } })
);

const results = arr2.filter(
  ({ url, title, title2 }) => track?.[url]?.[title] !== title2
);

console.log(results)

answered Jan 7, 2022 at 23:32

Siva Kondapi Venkata

11.1k2 gold badges20 silver badges32 bronze badges

Collectives™ on Stack Overflow

compare two object arrays by javascript keys

4 Answers 4

2 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

2 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related