Javascript - 分组对象答案

【问题标题】：Javascript - Grouping ObjectJavascript - 分组对象
【发布时间】：2021-07-10 09:40:21
【问题描述】：

我已经找到了使用以下代码按类别对对象进行分组的方法：

  let groupBy = (element, key) => {
    return element.reduce((value, x) => {
          (value[x[key]] = value[x[key]] || []).push(x);
       return value;
     }, {});
   }; 
  let items = groupBy(results, 'category')

而且，结果会是这样的：

{
    "Administration": [
        {
            "shp_name": "Village Boundary",
            "color_prop": "#000000",
            "shp_prop": "Batu Ampar"
        },
        {
            "shp_name": "Village Boundary",
            "color_prop": "#FFFFFF",
            "shp_prop": "Sungai Jawi"
        }
    ],
    "Land_use": [
        {
            "shp_name": "Land Use 2019",
            "color_prop": "#000000",
            "shp_prop": "Grassland"
        },
   ]
}

我想通过将color_prop 和shp_prop 合并到对象内的数组中来再次对它们进行分组，如下所示：

{
    "Administration": [
        {
            "shp_name": "Village Boundary",
            "color_prop": ["#000000","#FFFFFF"],
            "shp_prop": ["Batu Ampar","Sungai Jawi"]
        },
    ],
    "Land_use": [
        {
            "shp_name": "Land Use 2019",
            "color_prop": ["#000000"],
            "shp_prop": ["Grassland"]
        },
    ]
 }

如果有人能帮助我解决这个问题，我真的很感激。谢谢。

【问题讨论】：

组中所有项目的shp_name 是否相同？您按category 分组，这意味着只有一个项目的category 属性保证相同。理论上，组内的项目可能有不同的shp_names。
嗨，shp_name 应该是唯一的，但它在循环过程中按照color_prop 长度重复。这就是为什么我正在寻找解决方案来避免这种情况。顺便说一句，我加入了 3 个 MySQL 表，它们分别是类别、shapefile 和样式。类别由 shapefile 组成，每个 shapefile 都有一些属性和颜色。

标签： javascript arrays json object

【解决方案1】：

您可以引入一个将“行”转换为“列”的助手。

function toColumns(rows) {
  const columns = {};
  const keys = Object.keys(rows[0]);
  for (const key of keys) columns[key] = [];
  for (const row of rows) {
    for (const key of keys) {
      columns[key].push(row[key]);
    }
  }
  return columns;
}

这个助手转换如下结构：

[
  { a: 1, b: 2 },
  { a: 3, b: 4 },
]

进入：

{ a: [1, 3], b: [2, 4] }

定义了这个帮助器后，您可以通过以下方式将您的组转换为所需的结构：

for (const category in items) {
  const columns = toColumns(items[category]);
  // use the shp_name of the first item instead of an array
  columns.shp_name = columns.shp_name[0];
  items[category] = columns;
}

function toColumns(rows) {
  const columns = {};
  const keys = Object.keys(rows[0]);
  for (const key of keys) columns[key] = [];
  for (const row of rows) {
    for (const key of keys) {
      columns[key].push(row[key]);
    }
  }
  return columns;
}

const items = {
    "Administration": [
        {
            "shp_name": "Village Boundary",
            "color_prop": "#000000",
            "shp_prop": "Batu Ampar"
        },
        {
            "shp_name": "Village Boundary",
            "color_prop": "#FFFFFF",
            "shp_prop": "Sungai Jawi"
        }
    ],
    "Land_use": [
        {
            "shp_name": "Land Use 2019",
            "color_prop": "#000000",
            "shp_prop": "Grassland"
        },
   ]
}

for (const category in items) {
  const columns = toColumns(items[category]);
  columns.shp_name = columns.shp_name[0];
  items[category] = columns;
}

console.log(items);

如果您不想改变原始对象，请将items[category] = columns 替换为result[category] = columns（其中result 在循环之前定义为const result = {}）。

【讨论】：

太好了，非常感谢，它工作正常。