本文介绍如何在多层嵌套结构（键值对数组，其 value 为对象数组）中，根据子对象的 name 字段模糊匹配指定字符串（如 'ab'），并精准返回匹配项所在分组及精简后的子数组。
在实际前端开发中，常会遇到类似“字典式”数据结构：一个数组，每个元素包含 key 和 value 字段，而 value 又是一个对象数组（如用户列表、配置项集合等）。当需要按关键词（如 'AB'）全局搜索所有 Name 字段时，不能简单使用 find() 或 some()，而需组合过滤与重构逻辑。
核心思路是：
- 遍历顶层数组（每个元素含 key 和 value）；
- 对每个 value 子数组执行 filter()，判断其中任一对象的 Name 是否包含目标字符串（推荐使用 String.prototype.includes()，大小写敏感；如需忽略大小写，可转为小写后比对）；
- 仅当子数组存在匹配项时，构造新对象：保留原 key 等属性，但 value 替换为筛选后的子数组；
- 累积结果——使用 reduce() 高效构建最终结果数组。
以下是完整可运行示例代码：
const data = [
{ key: "001", value: [{ Id: "2345", Name: "Test" }] },
{ key: "112", value: [{ Id: "1234", Name: "UHV" }, { Id: "3424", Name: "ABC" }] },
{ key: "222", value: [{ Id: "2312", Name: "ABD" }, { Id: "1321", Name: "RFV" }, { Id: "4567", Name: "ERF" }] }
];
const searchTerm = "AB";
const result = data.reduce((acc, { key, value, ...rest }) => {
const matchedItems = value.filter(obj => obj.Name.includes(searchTerm));
if (matchedItems.length > 0) {
acc.push({ key, value: matchedItems, ...rest });
}
return acc;
}, []);
console.log(result);
// 输出：
// [
// { key: "112", value: [{ Id: "3424", Name: "ABC" }] },
// { key: "222", value: [{ Id: "2312", Name: "ABD" }] }
// ]✅ 注意事项：
- 若需不区分大小写搜索，将 obj.Name.includes(searchTerm) 改为 obj.Name.toLowerCase().includes(searchTerm.toLowerCase())；
- 若 Name 字段可能为 null 或 undefined，建议增加安全访问：obj.Name?.toLowerCase()?.includes(...)；
- reduce() 初始值设为空数组 []，确保类型安全；解构时使用 { key, value, ...rest } 可兼容未来扩展字段（如 timestamp、status 等）；
- 性能提示：该方案时间复杂度为 O(n×m)，适用于中等规模数据（
此方法结构清晰、语义明确，兼顾可读性与实用性，是处理层级化搜索需求的典型范式。
