如何实现基于多属性键路径的数组对象过滤函数

没问题，我来帮你搞定这个需求。这个filter函数的核心就是根据给定的嵌套键路径，取出每个数据项对应的值，再和目标值做匹配，下面是具体的实现思路和代码：

实现思路 #

• 遍历传入的collection数组，逐个检查每个元素
• 利用Array.reduce()方法，按照key数组提供的路径，逐层深入获取嵌套属性的值（这里要注意处理中间属性不存在的情况，避免报错）
• 如果最终获取到的值和目标value完全匹配，就把这个元素保留到结果数组中

完整代码实现 #

let data = [
 { id:1 , data:{ name:"sample1",address:{ cat:"business" } } },
 { id:2 , data:{ name:"sample2",address:{ cat:"office" } } },
 { id:3 , data:{ name:"sample3",address:{ cat:"office" } } },
 { id:4 , data:{ name:"sample4",address:{ cat:"office" } } },
 { id:5 , data:{ name:"sample5",address:{ cat:"home" } } },
 { id:6 , data:{ name:"sample6",address:{ cat:"home" } } }
];

function filter(collection, value, keyPath) {
  return collection.filter(item => {
    // 按照键路径逐层获取值，初始值为当前item
    const targetValue = keyPath.reduce((current, key) => {
      // 如果当前层级不存在，直接返回undefined，避免报错
      return current?.[key];
    }, item);
    
    // 比较获取到的值和目标值
    return targetValue === value;
  });
}

// 测试调用
let result = filter(data, "business", ["data","address","cat"]);
console.log(result);

运行结果 #

运行上面的代码后，控制台会输出：

[{ id:1 , data:{ name:"sample1",address:{ cat:"business" } } }]

额外说明 #

• 这里用了可选链操作符?.，如果中间某个属性不存在（比如某个item没有data属性），会直接返回undefined，不会抛出错误，让函数更健壮
• 如果需要支持模糊匹配或者类型不严格匹配，可以把===换成==或者自定义匹配逻辑，比如字符串包含判断之类的

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