使用JavaScript reduce方法构建对象失败，求正确实现方案

需求说明 #

需要将opt对象中key后缀为first、second、third的对应值，分别归入fieldValuesuu数组对应的Field_1、Field_2、Field_3数组，预期输出如下：

{
  "Field_1": ["Hello0", "Hello1", "Hello2", "hello"],
  "Field_2": ["hi1", "h2"],
  "Field_3": ["Third"]
}

原代码问题分析 #

原代码存在以下关键错误：

• 错误关联key后缀与fieldValuesuu的对应关系，key.includes(fieldValuesuu[key])逻辑完全不成立，无法匹配到目标字段
• 未正确使用reduce的累加器acc，反而使用了未定义的obje变量，且未返回累加器结果
• 每次循环新建空数组arr，会覆盖之前收集的值，无法实现数组累加
• 函数getOptionsData没有返回任何结果，导致最终输出undefined

修正后的代码 #

let opt = {
    '0_first': "Hello0",
    '0_Second': "hi1",
    '1_first': "Hello1",
    '1_Second': "h2",
    '2_first': "Hello2",
    '3_first': "hello",
    '0_third' : "Third"
};

let fieldValuesuu = ['Field_1', 'Field_2', 'Field_3'];

function getOptionsData(options) {
    // 建立后缀到目标字段的映射，统一转小写处理大小写差异
    const suffixMap = {
        first: fieldValuesuu[0],
        second: fieldValuesuu[1],
        third: fieldValuesuu[2]
    };
    
    return Object.entries(options).reduce((acc, [key, value]) => {
        // 拆分key获取后缀，转小写匹配映射
        const suffix = key.split('_')[1].toLowerCase();
        const targetField = suffixMap[suffix];
        
        if (targetField) {
            // 若目标字段不存在数组则初始化，否则复用已有数组
            acc[targetField] = acc[targetField] || [];
            acc[targetField].push(value);
        }
        
        // 必须返回累加器，供下一次循环使用
        return acc;
    }, {});
}

console.log('reduceValue', getOptionsData(opt));

代码说明 #

1. 新增suffixMap映射表，将first/second/third（统一小写）与fieldValuesuu的对应字段绑定，解决大小写匹配问题
2. 在reduce循环中，拆分key获取后缀并转小写，通过映射表找到目标字段
3. 从累加器acc中获取目标字段的数组，不存在则初始化空数组，再将当前value推入数组
4. 每次循环返回累加器acc，确保reduce能正确累积结果
5. 函数返回reduce的最终结果，保证调用时能获取到目标对象

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