通過javascript鍵比較兩個物件陣列

我正在使用 javascript 我有兩種安排，例如：

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' },
]

我想從所述第二陣列以獲得那些是不同的物件的任一title或title2

我嘗試了以下方法，但它對我不起作用，我在哪里迷路了？

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

該示例的預期結果是：

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

uj5u.com熱心網友回復：

如果我理解您的目標，首先是匹配 URL，然后找出標題是否存在差異。如果這是正確的，這將使您到達那里。

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)

uj5u.com熱心網友回復：

您可以array1使用urlas 鍵從物件中收集所有物件，并通過檢查title和過濾第二個陣列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; }

uj5u.com熱心網友回復：

最簡單的是將一個映射到查找并回圈第二個。

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);

如果您不想對要檢查的鍵進行硬編碼，可以使用 some() 遍歷它們并進行比較。

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);

uj5u.com熱心網友回復：

構建一個物件來跟蹤標題arr1并使用相同的物件進行過濾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)

標籤：

上一篇：如何將此函式撰寫為宣告？

下一篇：使用React從物件中查找特定資料