本文探讨了在处理复杂嵌套对象数组时，如何实现深度过滤并同时保留匹配项的完整父级层级。针对`deepdash`等库在默认情况下可能移除非匹配父级属性的问题，文章提出了一种自定义的递归过滤解决方案。该方案通过标准化数据结构和精心设计的递归函数，确保过滤结果既包含匹配项，又完整地保留了其在原始数据结构中的上下文信息，避免了数据扁平化或信息丢失。
深度嵌套对象数组的过滤挑战
在前端或后端数据处理中，我们经常会遇到包含多层嵌套对象和数组的复杂数据结构，例如产品目录、组织架构等。当需要根据某个深层属性（如产品编码）进行过滤时，一个常见的需求是不仅要获取匹配的叶子节点，还要保留其所有祖先节点及其所有属性，以维持数据的完整上下文。
例如，一个产品数组可能包含多个层级：产品类别 (Category) -> 子类别 (Sub-Category) -> 产品类型 (Product Type) -> 具体产品 (Product Item)。如果我们要查找所有编码中包含特定字符串的产品，并希望最终结果依然是一个完整的树形结构，只包含匹配产品及其所有上层父级（即使父级本身不匹配过滤条件），那么标准的深度过滤方法可能无法满足要求。
deepdash.filterDeep 的局限性
一些实用工具库，如 deepdash，提供了 _.filterDeep 这样的函数来简化深度遍历和过滤操作。然而，这些库在默认行为下，往往倾向于只返回那些直接匹配过滤条件的节点，或者在保留父节点时，只保留与过滤条件相关的部分属性，而移除其他不直接相关的父级属性。
考虑以下原始数据结构示例：
const products_array = [ { name: 'Food to Go', filter: 'food', color: '#f9dd0a', categories_list: [ // 第一层子数组 { name: 'Bepulp Compostable', sub_categories: [ // 第二层子数组 { name: 'BOWLS & CONTAINERS', products: [ // 第三层子数组 { type: 'RECTANGULAR', products_list: [ // 第四层子数组 { color: 'natural', code: 'PAP46120', description: 'Rectangular tray 600ml 16x23 cm' }, { color: 'natural', code: 'PUL46130', description: 'Rectangular tray 950ml 16x23 cm' }, // ...更多产品 ] }, // ...更多产品类型 ] }, // ...更多子类别 ], }, // ...更多类别 ], }, // ...更多顶级产品组];
如果我们使用 deepdash.filterDeep 并尝试按 code 属性进行过滤，例如查找所有 code 包含 ‘PUL’ 的产品，默认情况下，它可能会返回一个高度扁平化或只包含匹配 code 属性的稀疏结构：
// 使用 deepdash.filterDeep 后的典型输出（简化）const currentOutput = [ { categories_list: [ { sub_categories: [ { products: [ { products_list: [ { code: 'PUL46130' }, { code: 'PUL51601' }, // ... ] }, // ... ] }, // ... ], }, ], }];
可以看到，除了 code 属性和其直接的父级数组结构外，所有其他属性（如 name, filter, color, description 等）都被移除了，这显然不符合保留完整层级和上下文的需求。
期望的输出结构
我们期望的输出是，如果一个叶子节点（例如一个具体产品）匹配了过滤条件，那么从根节点到该叶子节点的所有父级节点都应该被保留，并且这些父级节点的所有原始属性也应完整保留。
// 期望的输出（简化）const expectedOutput = [ { name: 'Food to Go', // 顶级父级及其属性被保留 filter: 'food', color: '#f9dd0a', categories_list: [ { name: 'Bepulp Compostable', // 中间父级及其属性被保留 sub_categories: [ { name: 'BOWLS & CONTAINERS', // 另一层父级及其属性被保留 products: [ { type: 'RECTANGULAR', // 产品类型及其属性被保留 products_list: [ { color: 'natural', code: 'PUL46130', description: 'Rectangular tray 950ml 16x23 cm', /* ...所有属性 */ }, { color: 'clear', code: 'PUL51601', description: 'rPET lid for rectangular tray 16x23 cm', /* ...所有属性 */ }, // ...只包含匹配的产品 ] }, // ...只包含有匹配产品的产品类型 ] }, // ...只包含有匹配子类别的子类别 ], }, // ...只包含有匹配类别的类别 ], }, // ...只包含有匹配产品组的顶级产品组];
解决方案：自定义递归过滤函数
为了实现这种深度过滤并保留父级层级的需求，最有效的方法是编写一个自定义的递归函数。这个函数的核心思想是：从叶子节点开始向上判断，如果叶子节点匹配，则其所有父节点都应该被保留。在向下遍历时，只有当子节点或其后代有匹配项时，父节点才会被保留。
1. 数据结构标准化（可选但推荐）
为了简化递归逻辑，如果原始数据结构允许，将所有表示“子项列表”的属性名统一为 children 会非常有帮助。例如，将 categories_list, sub_categories, products, products_list 都统一为 children。
原始数据到标准化数据的转换示例：
// 假设原始数据已被转换为以下结构（简化）const products = [ { name: 'Food to Go', filter: 'food', color: '#f9dd0a', children: [ // 替代 categories_list { name: 'Bepulp Compostable', children: [ // 替代 sub_categories { name: 'BOWLS & CONTAINERS', children: [ // 替代 products { name: 'RECTANGULAR', // 替代 type children: [ // 替代 products_list { name: 'PUL46120', color: 'natural', code: 'PAP46120', description: 'Rectangular tray 600ml 16x23 cm' }, // ... ] }, // ... ] }, // ... ], }, // ... ], }, // ...];
注意： 如果无法修改原始数据结构，递归函数则需要更灵活地检查多个可能的子数组属性名。
2. 实现递归过滤函数
接下来，我们编写一个递归函数，它将遍历标准化后的数据结构。关键在于使用 Object.assign({}, o) 创建对象的浅拷贝，以避免直接修改原始数据，并确保保留所有属性。
/** * 创建对象的浅拷贝 * @param {Object} o - 待拷贝的对象 * @returns {Object} 拷贝后的新对象 */function copy(o) { return Object.assign({}, o);}/** * 递归过滤函数，保留匹配项及其父级层级 * @param {string} searchVal - 搜索关键字 * @returns {function(Object): boolean} 过滤谓词函数 */function createRecursiveFilter(searchVal) { const lowerCaseSearchVal = searchVal.toLowerCase(); /** * 实际的递归过滤函数 * @param {Object} o - 当前处理的对象 * @returns {boolean} 如果对象或其任何子代匹配，则返回 true */ function filterNode(o) { // 检查当前对象的属性是否匹配搜索值 // 可以根据需要扩展匹配的属性，例如 name, description, code 等 if (o.name && String(o.name).toLowerCase().includes(lowerCaseSearchVal)) return true; if (o.description && String(o.description).toLowerCase().includes(lowerCaseSearchVal)) return true; if (o.code && String(o.code).toLowerCase().includes(lowerCaseSearchVal)) return true; // ... 其他需要匹配的属性 // 如果当前对象有子节点 if (o.children) { // 递归过滤子节点，并更新当前对象的 children 属性 // 使用 map(copy) 确保创建子节点的副本，防止修改原始数据 // filter(filterNode) 递归调用自身来过滤子节点 // .length 检查过滤后的 children 数组是否为空。 // 如果子数组不为空（即有匹配的子节点），则返回 true，表示当前父节点也应被保留。 o.children = o.children.map(copy).filter(filterNode); return o.children.length > 0; } // 如果当前对象没有子节点，且自身不匹配，则不保留 return false; } return filterNode;}// 示例使用// 假设 products 已经是标准化后的数据结构const searchKeyword = 'PUL';const filteredProducts = products.map(copy).filter(createRecursiveFilter(searchKeyword));console.log(JSON.stringify(filteredProducts, null, 2));
代码解析：
copy(o) 函数：这是一个简单的辅助函数，用于创建对象的浅拷贝。在递归过滤过程中，我们不希望直接修改原始数据，因此在处理每个对象时都先创建一个副本。createRecursiveFilter(searchVal) 函数：这是一个高阶函数，用于创建一个闭包，其中 searchVal 会被转换为小写并用于后续的匹配。filterNode(o) 函数：这是实际执行递归过滤的核心函数。匹配条件：它首先检查当前对象 o 的 name、description 或 code 属性是否包含 searchVal。如果匹配，则直接返回 true，表示该节点及其所有父级都应该被保留。递归处理子节点：如果当前对象有 children 属性，它会：对 o.children 数组中的每个子对象调用 copy()，创建新的子对象副本。对这些副本调用 filterNode 进行递归过滤。将过滤后的结果重新赋值给 o.children。关键点：return o.children.length > 0;。如果过滤后的 children 数组非空（即至少有一个子节点或其后代匹配了过滤条件），则返回 true，表示当前父节点也应该被保留。如果 children 数组为空，则返回 false，表示当前父节点不应被保留。叶子节点不匹配：如果当前对象没有 children 属性（即为叶子节点），且其自身属性也不匹配，则返回 false。
通过这种方式，只有当一个节点自身匹配，或者其任何深层子节点匹配时，该节点及其所有祖先节点才会被保留下来，并且所有原始属性都得到了完整保留。
注意事项与最佳实践
数据不可变性：使用 map(copy) 和 Object.assign({}, o) 是为了保持原始数据的不可变性。在实际应用中，这通常是一个好的实践，可以避免意外的副作用。
性能考量：对于极其庞大或深度非常大的数据结构，递归过滤可能会消耗较多内存（因为创建了大量对象副本）和 CPU 时间。如果性能是关键因素，可以考虑：
迭代式解决方案：对于某些特定场景，迭代而非递归可能更高效。优化匹配逻辑：确保匹配条件尽可能高效。Memoization：如果同一子树可能被多次处理，可以考虑使用 memoization 缓存结果。
灵活的匹配条件：示例代码中的匹配条件是硬编码的，实际应用中可以将其抽象为一个可配置的函数，允许用户定义更复杂的匹配逻辑。
多种子数组名称的处理：如果数据结构中存在多个不同的子数组属性名（例如 categories_list, sub_categories 等），而不是统一的 children，则 filterNode 函数需要进行修改，以迭代检查所有可能的子数组属性。例如：
function filterNode(o) { // ... 匹配条件 ... let hasMatchingChildren = false; const childKeys = ['categories_list', 'sub_categories', 'products', 'products_list', 'children']; // 定义所有可能的子数组键 for (const key of childKeys) { if (Array.isArray(o[key])) { o[key] = o[key].map(copy).filter(filterNode); if (o[key].length > 0) { hasMatchingChildren = true; } } } return hasMatchingChildren || /* 自身匹配条件 */;}
这种方式虽然更灵活，但增加了代码复杂性，因此如果可能，标准化数据结构是首选。
总结
当需要对深度嵌套的对象数组进行过滤，并要求保留所有匹配项的完整父级层级和属性时，自定义递归过滤函数是比依赖通用库更灵活和精确的解决方案。通过结合浅拷贝和递归调用，我们能够有效地构建一个符合期望的树形过滤结果，确保数据的完整性和上下文。理解其工作原理并根据实际数据结构进行调整，是掌握此类复杂数据处理的关键。
以上就是深入嵌套对象数组的层级过滤与保留策略的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1530297.html
微信扫一扫 
支付宝扫一扫 
