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

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中所有items数组中的每个项目。 我想做的是从mainArray的每个items数组中删除arr的每个项目，然后在屏幕上显示更新后的mainArray。

我考虑做如下操作：

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

这会返回一个错误：无法读取未定义的属性“items”

或类似的内容

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

但是这也不起作用。

感谢所有的帮助。

- Person

---

你能否提供一个期望输出的示例呢？ 另外顺便提一下：你的map函数没有返回任何内容，因此最终得到的mainArray将为空。 - noa-dev

由于您使用了“const”关键字来定义变量，因此您不能执行“mainArray = ...”。它是一个常量，无法被覆盖。 - vsync

示例输出？ - Oscar Zarrus

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 )

- vsync

Answer 2

我会将已使用的ID映射到一个数组中，以便更轻松地查找。这是在主数组项上进行foreach循环，然后使用includes进行过滤，以查看该项是否在数组中。

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)

- epascarello