如何根据feedbackAllFlows分类动态重组反馈数据结构

我明白你现在的需求啦——就是要把每个好评反馈里feedbackAllFlows数组中的每个流程，都作为独立的键，把对应的feedbackMessage归类到各自的数组下，最终重组出你想要的结构对吧？你之前的代码主要卡在两个点：一是没用到对象计算属性名导致键名不对，二是reduce阶段的消息合并逻辑有问题，我来帮你调整并解释清楚～

修正后的完整代码 #

// 原始数据
const tup = [
  {
    "thumbsup": [
      {
        "feedback": "thumbsup",
        "feedbackMessage": "It was easy to make a payment",
        "feedbackAllFlows": ["map"]
      },
      {
        "feedback": "thumbsup",
        "feedbackMessage": "Fast and simple.",
        "feedbackAllFlows": ["map"]
      },
      {
        "feedback": "thumbsup",
        "feedbackMessage": "Very fast",
        "feedbackAllFlows": ["sales", "cases"]
      },
      {
        "feedback": "thumbsup",
        "feedbackMessage": "Very easy to use.",
        "feedbackAllFlows": ["off shore"]
      },
      {
        "feedback": "thumbsup",
        "feedbackMessage": "Great help. Once I asked tge correct question",
        "feedbackAllFlows": ["offshore", "disconnect", "thanks"]
      },
      {
        "feedback": "thumbsup",
        "feedbackMessage": "Very quick",
        "feedbackAllFlows": ["pay later"]
      },
      {
        "feedback": "thumbsup",
        "feedbackMessage": "improve the billing and help better understanding the bill cycle",
        "feedbackAllFlows": ["pay later", "high"]
      },
      {
        "feedback": "thumbsup",
        "feedbackMessage": "Everything was simple and easy. Quick responses made the process a lot faster.",
        "feedbackAllFlows": ["activate"]
      },
      {
        "feedback": "thumbsup",
        "feedbackMessage": "Very helpful",
        "feedbackAllFlows": ["pay later"]
      }
    ]
  }
];

// 处理逻辑
const processFeedback = () => {
  // 临时存储每个流程对应的消息数组
  const flowMap = {};

  tup[0].thumbsup.forEach(feedbackItem => {
    const message = feedbackItem.feedbackMessage;
    // 遍历当前反馈关联的所有流程
    feedbackItem.feedbackAllFlows.forEach(flow => {
      // 计算属性名设置键，归类消息
      if (flowMap[flow]) {
        flowMap[flow].push(message);
      } else {
        flowMap[flow] = [message];
      }
    });
  });

  // 转换为目标结构
  const result = {
    thumbsup: Object.entries(flowMap).map(([flow, messages]) => ({
      [flow]: messages
    }))
  };

  return result;
};

// 执行并打印结果
const finalResult = processFeedback();
console.log(JSON.stringify(finalResult, null, 2));

关键修正点解释 #

1. 计算属性名的使用：
   你之前写的{flow: obj.feedbackMessage}会把键固定为字符串"flow"，而我们需要把变量flow的值作为键，所以必须用方括号包裹变量（{ [flow]: messages }），这样键名才会是流程的实际名称（比如"map"、"sales"等）。

2. 简洁的消息归类逻辑：
   用临时对象flowMap直接存储每个流程的消息数组，遍历过程中直接判断流程是否存在：存在则追加消息，不存在则初始化数组，比你之前的reduce写法更直观，也避免了字符串与数组混淆的问题。

3. 目标结构转换：
   最后用Object.entries()把临时对象的键值对转换成数组，再映射成你需要的{ 流程名: [消息数组] }结构，最后包装成{ thumbsup: [...] }的最终格式。

执行后的输出结果 #

（和你期望的结构一致，原数据里的"off shore"和"offshore"是两个不同流程会被分别归类，示例里的"equipment_activate_device"应该是笔误，代码会按原数据的"activate"处理）

{
  "thumbsup": [
    {
      "map": [
        "It was easy to make a payment",
        "Fast and simple."
      ]
    },
    {
      "sales": [
        "Very fast"
      ]
    },
    {
      "cases": [
        "Very fast"
      ]
    },
    {
      "off shore": [
        "Very easy to use."
      ]
    },
    {
      "offshore": [
        "Great help. Once I asked tge correct question"
      ]
    },
    {
      "disconnect": [
        "Great help. Once I asked tge correct question"
      ]
    },
    {
      "thanks": [
        "Great help. Once I asked tge correct question"
      ]
    },
    {
      "pay later": [
        "Very quick",
        "improve the billing and help better understanding the bill cycle",
        "Very helpful"
      ]
    },
    {
      "high": [
        "improve the billing and help better understanding the bill cycle"
      ]
    },
    {
      "activate": [
        "Everything was simple and easy. Quick responses made the process a lot faster."
      ]
    }
  ]
}

备注：内容来源于stack exchange，提问作者letsCode