如何基于字符串数组过滤JavaScript中的嵌套对象？

首先直接给出能实现需求的代码：

const fruitList = [
  { fruit: {id: '1-1', fruit_name: 'Apple'}, location: {id: '2-1', location_name: 'USA'} },
  { fruit: {id: '1-2', fruit_name: 'Banana'}, location: {id: '2-2', location_name: 'UK'} },
  { fruit: {id: '1-3', fruit_name: 'Orange'}, location: {id: '2-1', location_name: 'USA'} }
];
const keywords = ['Apple', 'Banana'];

const filteredFruit = fruitList.filter(item => 
  keywords.includes(item.fruit.fruit_name)
);

console.log(filteredFruit);

原代码的问题分析 #

• 解构错误：filter回调里你用了({item})，但fruitList的每一项本身就是目标对象，不存在item子属性，应该直接接收每一项为item（或者解构{fruit}简化写法：filter(({fruit}) => keywords.includes(fruit.fruit_name))）。
• 方法误用：item.fruit?.fruit_name是单个字符串，不是数组，every是数组的迭代方法，不能用在字符串上。我们只需要判断这个单值是否在keywords数组中，用includes方法即可。
• 多余的可选链：当前fruitList的每一项都有完整的fruit和fruit_name属性，?.可选链在这里没有必要，当然如果你的实际数据可能存在空值，可以保留。

运行上述正确代码后，就能得到你期望的输出结果。

内容的提问来源于stack exchange，提问作者Wen Ma