
本文介绍如何利用 lodash 的链式操作(尤其是 `map` 与 `map` 组合)将形如 `[{ nodes: [...] }, ...]` 的二维嵌套结构,精准转换为仅包含 `nodes` 数组的纯二维数组,避免 `flatmap` 导致的扁平化错误。
在处理 GraphQL 响应时,常遇到多层嵌套结构——例如你当前的数据是一个二维数组(Array
正确的解法是采用双层映射(nested mapping):外层 map 遍历最外层数组(即每个子数组),内层 map 遍历该子数组中的每个对象,并提取其 nodes 字段。这恰好对应 Lodash 链式调用中的 .map().map() 模式:
const result = _.chain(resp.data.data.projects.nodes) .map(arr => _.map(arr, 'nodes')) // 外层 map + 内层 map(Lodash 支持字符串路径简写) .value();
✅ 等价于原生写法:
const result = resp.data.data.projects.nodes.map(subArr => subArr.map(item => item.nodes) );
⚠️ 注意事项:
- 不要使用 flatMap('ciVariables.nodes'):flatMap 会先映射再扁平一层,导致 [[a],[b],[c]] → [a,b,c],丢失原始二维结构;
- 若原始路径更深(如 ciVariables[0].nodes),需确保数据结构稳定,或改用函数式访问(item => item.ciVariables?.[0]?.nodes)增强健壮性;
- 在链式调用中,.map(arr => _.map(arr, 'nodes')) 是推荐写法——既保持可读性,又充分利用 Lodash 对属性路径的优化支持。
最终输出严格维持输入的二维形状:外层数组长度不变,每个子数组长度不变,仅内容从 { nodes: [...] } 替换为 [...]。这是处理 GraphQL 分页/分组响应中常见嵌套字段的标准范式。










