17370845950

本文介绍如何利用 lodash 的链式调用（或原生 javascript）对多维嵌套数据进行结构扁平化处理，特别是将形如 `[ { nodes: [...] } ]` 的对象数组批量提取为 `[[...], [...]]` 的纯数组结构。

要实现从原始嵌套结构（外层数组 → 内层数组 → 每个对象含 nodes 字段）到目标结构（外层数组 → 内层数组 → 直接为 nodes 数组）的转换，关键在于保留外层数组的维度，仅对每一内层数组执行“提取 .nodes”操作。这本质上是二维映射（double map），而非扁平化（flatMap 会破坏层级）。

✅ 正确方案：双层 map（推荐）

使用 _.map 嵌套调用，外层遍历最外层数组（即每个 GraphQL 结果批次），内层遍历该批次中的每个对象并提取其 nodes 字段：

const result = _.chain(resp.data.data.projects.nodes)
  .map(subArray => _.map(subArray, 'nodes')) // 外层 map + 内层 map（支持字符串路径）
  .value();

等价于更直观的函数写法：

const result = _.chain(resp.data.data.projects.nodes)
  .map(subArray => subArray.map(item => item.nodes))
  .value();

? 提示：_.map(array, 'path') 是 Lodash 的便捷语法，等价于 array.map(x => x.path)，可安全用于提取 nodes。

❌ 为什么 flatMap('ciVariables.nodes') 不适用？

• flatMap 会将所有子数组合并到同一层级，导致结果变成一维大数组（如 [[...], [...], [...]] → [..., ..., ...]），丢失原始的外层分组结构；
• 同时，你当前数据中并无 ciVariables 字段（示例中是 nodes），路径错误也会导致返回 undefined。

? 完整示例（含类型安全提示）

// 假设 resp.data.data.projects.nodes 符合预期结构
const transformed = _.chain(resp.data.data.projects.nodes)
  .map(batch => _.map(batch, 'nodes')) // ✅ 保持 batch 分组，仅提取 nodes
  .value();

// 类型提示（TypeScript 可选）
// const transformed: Array>> = ...

⚠️ 注意事项

• 确保每项 subArray 中的对象都存在 nodes 属性，否则会得到 undefined；如需容错，可改用 _.map(batch, item => _.get(item, 'nodes', []))；
• 若后续还需对 nodes 数组进一步处理（如过滤、映射字段），可在内层 map 中链式组合，例如：
  _.map(batch, item => _.map(item.nodes, { id: 'id', name: 'name' }))；
• 在现代项目中，若无其他 Lodash 依赖，纯 JS 的 resp.data.data.projects.nodes.map(b => b.map(x => x.nodes)) 同样简洁高效，无需引入库。

通过双层 map，你既能精准控制数据层级，又能保持函数式编程的清晰性与可维护性。