如何连接具有不同结构的两个数组

Question

using typescript, I have two arrays (different structure) I am looking to get all the apps from array1 which they don't exist in array 2( array 2 has one more layer apps) join is based on app_id

Array 1

[
  {
    "app_id": 2,
    "app_type_id": 1,
    "app_name": "Test 5",

  },
  {
    "app_id": 26,
    "app_type_id": 3,
    "app_name": "Test 4",
  },
  {
    "app_id": 177,
    "app_type_id": 2,
    "app_name": "Test 1",
  },
  {
    "app_id": 209,
    "app_type_id": 1,
    "app_name": "Test 2",
  }
]

Array 2

[
  {
    "app_type_id": 2,
    "apps": [
      {
        "app_id": 177,
        "app_type_id": 2,
        "app_name": "Test 1",
      }
    ]
  },
  {
    "app_type_id": 1,
    "apps": [
      {
        "app_id": 209,
        "app_type_id": 1,
        "app_name": "Test 2",
      },
      {
        "app_id": 191,
        "app_type_id": 1,
        "app_name": "Test 3",
      }
    ]
  }
]

Expected Output Array 3

[
  {
    "app_id": 2,
    "app_type_id": 1,
    "app_name": "Test 5",

  },
  {
    "app_id": 26,
    "app_type_id": 3,
    "app_name": "Test 4",
  }
]

TS File Tried this but it dd not work, it is returning all records

this.array3= this.array1.filter(o1 => this.array2.filter(o2 => o2.apps.filter(u => u.app_id === o1.app_id).length===0)); 

Answer 1

you can try

array1.filter(e1 =>
  !array2.some(e2 => e2.apps.some(v => v[`app_id`] === e1[`app_id`]))
)

you might also want to handle null/undefined if that is the case.

Answer 2

You can use this code, I break it down in multiple sentences to be more clear what is going on

const appIds = this.array2.map(i => (i.apps || []).map(item => item.app_id))
const allAppIds : any = appIds.reduce((a, b) => { return a.concat(b); },[]);

const notExistsItems = this.array1.filter(item => !allAppIds.includes(item.app_id));

see this working result https://stackblitz.com/edit/angular-stackoverflow-54407756