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

Giả sử chúng ta có hai mảng đối tượng như sau:

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 ta cần viết hàm JavaScript nhận vào hai mảng này. Hàm trả về phiên bản lọc của mảng đầu tiên (arr1) chỉ chứa những đối tượng có thuộc tính name không xuất hiện trong mảng thứ hai (arr2) với cùng thuộc tính name.

Kết quả mong đợi:

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

Ví dụ

Mã thực hiện:

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

Kết quả

Kết quả in ra console:

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