将嵌套数组中的对象列表分组 javascript

Question

我有一个对象数组如下

[
  {
      id: 10,
      regionName: "Europa",
      countryName: "Greece",
      applicationName: "Ramco",
      issueSummary: "No Reported Issues",
      resolutionEta: "",
      status: "UP"
  },
  {
      id: 9,
      regionName: "Asia PAC",
      countryName: "Singapore",
      applicationName: "Reckon",
      issueSummary: "No Reported Issues",
      resolutionEta: "",
      status: "UP"
  },
  {
      id: 7,
      regionName: "Asia PAC",
      countryName: "Thailand",
      applicationName: "Javelin",
      issueSummary: "No Reported Issues",
      resolutionEta: "",
      status: "UP"
  },
  {
      id: 8,
      regionName: "Europa",
      countryName: "Greece",
      applicationName: "Tamco",
      issueSummary: "No Reported Issues",
      resolutionEta: "",
      status: "UP"
  }
]

我正在尝试将这些对象分组到一系列地区中，每个地区都应该有一个国家/地区数组，每个国家/地区都应该有一系列应用程序。

{
  regions: [{
    regionName: "Europe",
    countries: [
      {
        countryName: "Greece",
        applications: [
          {
            applicationName: "Ramco",
            issueSummary: "No Reported Issues",
            eta: "",
            status: "UP",
          },
          {
            applicationName: "Tamco",
            issueSummary: "No Reported Issues",
            eta: "",
            status: "UP",
          }
        ]
      },
      {
        countryName: "France",
         applications: [
          {
            applicationName: "Ramco",
            issueSummary: "No Reported Issues",
            eta: "",
            status: "UP",
          },
          {
            applicationName: "Tamco",
            issueSummary: "No Reported Issues",
            eta: "",
            status: "UP",
          }
        ]
      },
    ]
.... and so on
  },

这是我到目前为止所拥有的，它仅适用于区域数组。 我有一个 groupBy 方法，我将它用于地区和国家，但这给了我分离的数组，而不是嵌套的

 ngOnInit(): void {
    this.allRegions$ = this.dataService.getData();

    this.groupData();
  }

  groupData() {
    this.dataService.getData().subscribe(res => {
      this.data = res;
      const regions = this.groupBy('regions', this.data)
      const countries = this.groupBy('countries', regions)
    })
  }

  groupBy(key, array) {
    return array.reduce((all, current) => {
      const existingKey = all.find(existing => existing.key === current[key]);
      console.log(existingKey)
      if (!existingKey) {
        all.push({key: current[key], values: [current]});
      } else {
        existingKey.values.push(current);
      }
      return all;
    }, []);
  }

Answer 1

您可以通过使用对象作为对嵌套分组属性的引用来采用抽象方法，并根据需要构建结构。

这种方法适用于任何深度的分组，只需将所需的键添加到keys数组即可。

 const data = [{ id: 10, regionName: "Europa", countryName: "Greece", applicationName: "Ramco", issueSummary: "No Reported Issues", resolutionEta: "", status: "UP" }, { id: 9, regionName: "Asia PAC", countryName: "Singapore", applicationName: "Reckon", issueSummary: "No Reported Issues", resolutionEta: "", status: "UP" }, { id: 7, regionName: "Asia PAC", countryName: "Thailand", applicationName: "Javelin", issueSummary: "No Reported Issues", resolutionEta: "", status: "UP" }, { id: 8, regionName: "Europa", countryName: "Greece", applicationName: "Tamco", issueSummary: "No Reported Issues", resolutionEta: "", status: "UP" }], keys = ['regionName', 'countryName'], result = data .reduce((r, o) => { let key; keys .reduce((t, k) => { ({ [k]: key, ...o } = o); if (!t[key]) { t[key] = { _: [] }; t._.push({ [k]: key, children: t[key]._ }); } return t[key]; }, r) ._ .push(o); return r; }, { _: [] }) ._; console.log(result);

 .as-console-wrapper { max-height: 100% !important; top: 0; }