对象动态分组：按问题聚合图表数据的实现求助

先梳理下你现有代码的问题，再给出能实现需求的正确方案：

你的代码存在的问题 #

• 键名兼容问题：原始数据里有的对象用question、有的用pergunta表示问题，但你的代码只读取v.pergunta，会漏掉一半数据
• 无效判断逻辑：dataPergunta == v.pergunta这个判断永远为真（因为dataPergunta就是从v.pergunta取的），根本起不到分组作用
• 大小写不匹配：原始数据里图表类型是小写的column，但你代码里判断的是大写"Column"，导致匹配失败
• 逻辑方向偏差：你当前是按图表类型分组，但实际需求是按问题文本分组，每个问题下汇总所有对应的回答条目

正确实现方案 #

我们可以用一个对象做分组映射，以统一后的问题文本为键，对应的值是该问题的所有回答数组，最后再转换成你需要的格式：

代码示例 #

// 先把数据库返回的零散对象整理成数组（如果后端返回的是字符串，需要先JSON.parse解析）
const rawData = [
  {"question":"Name","answer":"jorge","qt":"1","graph":"table"},
  {"pergunta":"Name","answer":"Jorge","qt":"2","graph":"table"},
  {"question":"Name","answer":"Jhon","qt":"1","graph":"table"},
  {"question":"what is your favorite color ?","answer":"red","qt":"1","graph":"column"},
  {"question":"what is your favorite color ?","answer":"blue","qt":"1","graph":"column"},
  {"question":"what is your favorite color ?","answer":"yellow","qt":"1","graph":"column"},
  {"question":"Are you over 20 years old?","answer":"No","qt":"1","graph":"pie"},
  {"question":"Are you over 20 years old?","answer":"Yes","qt":"3","graph":"pie"}
];

// 创建分组映射：键是问题文本，值是该问题的所有标准化条目
const groupedMap = {};

rawData.forEach(item => {
  // 统一获取问题文本，兼容question和pergunta两种键
  const questionText = item.question || item.pergunta;
  // 标准化条目结构，统一用question作为键名
  const standardizedItem = {
    question: questionText,
    answer: item.answer,
    qt: item.qt,
    graph: item.graph
  };

  // 分组逻辑：存在则追加，不存在则新建数组
  if (groupedMap[questionText]) {
    groupedMap[questionText].push(standardizedItem);
  } else {
    groupedMap[questionText] = [standardizedItem];
  }
});

// 转换成你需要的{data: [...]}格式的数组
const result = Object.values(groupedMap).map(group => ({ data: group }));

// 输出结果
console.log(result);

最终输出结果 #

运行后会得到你期望的分组结构：

[
  {
    "data": [
      {"question":"Name","answer":"jorge","qt":"1","graph":"table"},
      {"question":"Name","answer":"Jorge","qt":"2","graph":"table"},
      {"question":"Name","answer":"Jhon","qt":"1","graph":"table"}
    ]
  },
  {
    "data": [
      {"question":"what is your favorite color ?","answer":"red","qt":"1","graph":"column"},
      {"question":"what is your favorite color ?","answer":"blue","qt":"1","graph":"column"},
      {"question":"what is your favorite color ?","answer":"yellow","qt":"1","graph":"column"}
    ]
  },
  {
    "data": [
      {"question":"Are you over 20 years old?","answer":"No","qt":"1","graph":"pie"},
      {"question":"Are you over 20 years old?","answer":"Yes","qt":"3","graph":"pie"}
    ]
  }
]

额外说明 #

• 统一了键名格式，把pergunta转换成question，避免后续图表渲染时出现键名不一致的问题
• 用对象映射分组的时间复杂度是O(n)，比嵌套循环的效率更高
• 如果后端返回的是未解析的字符串，记得先执行const rawData = JSON.parse(yourBackendResponse);（注意要先把零散的对象用逗号分隔并包裹在数组中）

内容的提问来源于stack exchange，提问作者Carlos Lopes