使用ES6将扁平地域数据转换为三级嵌套数组的实现求助

嘿，我明白你想要把扁平的地理数据转换成Country -> State -> City三级嵌套结构的需求了。其实咱们可以借助ES6的Map数据结构来快速建立节点间的关联，这样能把循环次数降到最少，代码也非常简洁易读。

核心思路 #

1. 先用Map存储所有节点的转换后对象，以节点的id作为键，实现O(1)时间复杂度的父节点快速查找
2. 遍历原始数据，将子节点挂载到对应父节点的subs数组中
3. 最后筛选出所有顶级节点（parentId为null的国家节点），得到最终的嵌套结构

完整实现代码 #

const worldMap = [
  { "name": "Germany", "parentId": null, "type": "Country", "value": "country:unique:key:1234", "id": "1" },
  { "name": "North Rhine", "parentId": "1", "type": "State", "value": "state:unique:key:1234", "id": "2" },
  { "name": "Berlin", "parentId": "1", "type": "State", "value": "state:unique:key:1234", "id": "3" },
  { "name": "Dusseldorf", "parentId": "2", "type": "city", "value": "city:unique:key:1234", "id": "4" },
  { "name": "India", "parentId": null, "type": "Country", "value": "country:unique:key:1234", "id": "5" },
];

// 1. 初始化Map，存储转换后的节点对象（label/value格式）
const nodeMap = new Map(
  worldMap.map(item => [
    item.id,
    { label: item.name, value: item.value }
  ])
);

// 2. 遍历原始数据，建立父子节点的嵌套关联
worldMap.forEach(item => {
  if (item.parentId !== null) {
    const parentNode = nodeMap.get(item.parentId);
    // 若父节点还没有subs数组，先初始化
    parentNode.subs = parentNode.subs || [];
    parentNode.subs.push(nodeMap.get(item.id));
  }
});

// 3. 筛选出所有顶级国家节点，得到最终嵌套结构
const nestedMap = worldMap
  .filter(item => item.parentId === null)
  .map(item => nodeMap.get(item.id));

console.log(nestedMap);

输出结果 #

[
  { label: "Germany", value: "country:unique:key:1234", subs: [
    { label: "North Rhine", value: "state:unique:key:1234", subs: [
      { label: "Dusseldorf", value: "city:unique:key:1234" }
    ] },
    { label: "Berlin", value: "state:unique:key:1234" }
  ] },
  { "label": "India", "value": "country:unique:key:1234" }
]

方案优势 #

• 仅需两次核心遍历（初始化Map、建立关联），循环次数极少，时间复杂度接近O(n)
• Map的查找操作是O(1)，避免了嵌套循环查找父节点的高复杂度问题
• 代码逻辑清晰，用ES6语法糖简化了操作，可读性强

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