如何在Javascript中映射所有叶子节点的值?

时间:2018-09-04 08:34:38

标签: javascript tree

我有一个像这样的嵌套JSON对象树:

{"children":[{"name":"Afghanistan","children":[{"World 
Cities.Country":"Afghanistan","World Cities.Population":2997,"World 
Cities.City":"Qal eh-ye Now"},{"World Cities.Country":"Afghanistan","World 
Cities.Population":7407,"World Cities.City":"Mahmud-E Eraqi"},{"World 
Cities.Country":"Afghanistan","World Cities.Population":10000,"World 
Cities.City":"Tarin Kowt"}]

期望的输出有些喜欢

{
"name": "flare",
  "children": [
    {
      "name": "LEGISLATIVE",
      "children": [
        {
          "name": "Legislative Branch",
          "size": 20891
        }
      ]
    },
    {
      "name": "JUDICIAL",
      "children": [
        {
          "name": "Supreme Court Law Library",
          "size": 1589.3
        },
        {
          "name": "New Mexico Compilation Commission",
          "size": 1853.5
        },
        {
          "name": "Judicial Standards Commission",
          "size": 860.8
        },
        {
          "name": "Court of Appeals",
          "size": 5960.2
        },
        {
          "name": "Supreme Court",
          "size": 3421.1
        },
        {
          "name": "Supreme Court Building Commission",
          "size": 977.4
        },
        {
          "name": "Administrative Office of the Courts",
          "size": 65870.4
        },
        {
          "name": "First Judicial District Court",
          "size": 8372.5
        },
        {
          "name": "Second Judicial District Court",
          "size": 28154.6
        },
        {
          "name": "Third Judicial District Court",
          "size": 7808.3
        },
        {
          "name": "Fourth Judicial District Court",
          "size": 2577.2
        },
        {
          "name": "Fifth Judicial District Court",
          "size": 7389.5
        },
        {
          "name": "Sixth Judicial District Court",
          "size": 3630.7
        },
        {
          "name": "Seventh Judicial District Court",
          "size": 2895
        },

我的示例的预期输出

{"children":[{"name":"Afghanistan","children":[{"name":"Qal eh-ye Now","value":2997}]]}

所以我想映射叶子节点的值。在此示例中,将“世界城市”,“国家”,“世界城市”,“人口”和“世界城市”。城市仅作为每个子对象的名称和值。

目前这是我所拥有的功能:

var mappedData = nestedData.children.map(function (d) {
                      return { name: d[groupKey], value: d[sizeKey] };
                  }); //groupKey is World.Cities.City ,sizeKey is Population

但是显然该语法不起作用,因为我首先需要访问该树的所有叶节点,然后对其应用map函数。我该如何实现?

1 个答案:

答案 0 :(得分:1)

这是您可以实现的方式:

    const a = {
    children: [
        {
            name: "Afghanistan",
            children: [
                {
                    "World Cities.Country": "Afghanistan",
                    "World Cities.Population": 2997,
                    "World Cities.City": "Qal eh-ye Now"
                },
                {
                    "World Cities.Country": "Afghanistan",
                    "World Cities.Population": 7407,
                    "World Cities.City": "Mahmud-E Eraqi"
                },
                {
                    "World Cities.Country": "Afghanistan",
                    "World Cities.Population": 10000,
                    "World Cities.City": "Tarin Kowt"
                }
            ]
        }
    ]
};

const deep = x => {
    if (Array.isArray(x.children)) {
        x.children = x.children.map(deep);
        return x;
    } else {
        return {
            name: x["World Cities.City"],
            value: x["World Cities.Population"]
        };
    }
};

const b = deep(a);

console.log(b);