Lọc một mảng chứa các đối tượng dựa trên một mảng khác chứa các đối tượng trong JavaScript

Giả sử chúng ta có hai mảng đối tượng như thế này -

const arr1 = [{id:'1',name:'A'},{id:'2',name:'B'},{id:'3',name:'C'},{id:'4',name:'D'}];
const arr2 = [{id:'1',name:'A',state:'healthy'},{id:'3',name:'C',state:'healthy'}];

Chúng tôi được yêu cầu viết một hàm JavaScript có hai mảng như vậy. Hàm của chúng ta sẽ trả về một phiên bản đã lọc mới của mảng đầu tiên (trong trường hợp này là arr1) chỉ chứa các đối tượng có thuộc tính tên không được chứa trong mảng thứ hai (trong trường hợp này là arr2) với thuộc tính cùng tên.

Do đó, đầu ra, trong trường hợp này, sẽ giống như -

const output = [{id:'2',name:'B'},{id:'4',name:'D'}];

Ví dụ

Mã cho điều này sẽ là -

const arr1 = [{id:'1',name:'A'},{id:'2',name:'B'},{id:'3',name:'C'},{id:'4',name:'D'}];
const arr2 = [{id:'1',name:'A',state:'healthy'},{id:'3',name:'C',state:'healthy'}];
const filterByReference = (arr1, arr2) => {
   let res = [];
   res = arr1.filter(el => {
      return !arr2.find(element => {
         return element.id === el.id;
      });
   });
   return res;
}
console.log(filterByReference(arr1, arr2));

Đầu ra

Và đầu ra trong bảng điều khiển sẽ là -

[ { id: '2', name: 'B' }, { id: '4', name: 'D' } ]