从对象的子数组中删除数组的每个元素？

Question

我有一个具有这种结构的对象数组

const arr = [{
  id: 0,
  name: 'string'
}, {
  id: 1,
  name: 'string'
}]

我也有主阵列

const mainArray = [{
    items: [{
      id: 0,
      name: 'string'
    }]
  },
  {
    items: [{
        id: 5,
        name: 'string'
      },
      {
        id: 3,
        name: 'string'
      }
    ]
  }
];

我在屏幕上显示mainArray中项目数组中的每个项目。 我想要做的是从mainArray每个items数组中删除arr的每个items ，并在屏幕上显示更新的mainArray 。

我在想做这样的事情

mainArray = mainArray.map((e) => {
      e.items = e.items.filter((el) => {
        return !arr.includes( el );
      });
  }); 

这会返回错误Cannot read property 'items' of undefined

或类似的东西

mainArray = mainArray.filter((e) => {
        return !arr.includes( e.items );
  });

但这也行不通。

所有的帮助将不胜感激。

Answer 1

正如我在评论中所说，你不能使用const关键字并稍后覆盖变量。 但是，您不需要事件，因为您可以毫无问题地修改内部属性：

 const arr = [ { id:0, name:'string' }, { id:1, name:'string' } ] const mainArray = [{ items: [{ id:0, name:'string' },] }, { items: [ { id:5, name:'string' }, { id:3, name:'string' }, { id:1, name:'string' }, ] } ]; // for each "items" item, check if its "id" exists in the "arr" Array, so // I like to use "some" Array method for that: mainArray.map((e) => { e.items = e.items.filter(el => !arr.some(needle => needle.id == el.id)) }); console.log( mainArray ) 

Answer 2

我会将使用过的id映射到数组中以便于查找。 它是主数组项的foreach循环，而不是过滤器使用包括查看项是否在数组中。

 const arr = [{ id: 0, name: 'string' }, { id: 1, name: 'string' }] const mainArray = [{ items: [{ id: 0, name: 'string' }] }, { items: [{ id: 5, name: 'string' }, { id: 3, name: 'string' } ] } ]; // map ids into a look up array so we do not // have to loop over objects every time const usedIds = arr.map(o => o.id); // Loop over main array so we can access each object mainArray.forEach(sa => { // replace items with a filtered array // filter checks to see if the id is not used sa.items = sa.items.filter(o => !usedIds.includes(o.id)) }) console.log(mainArray)