如何将JavaScript数组按分组标识转换为指定嵌套结构？

问题背景 #

现有如下扁平结构的JavaScript数组：

const originalArray = [
    {
        __EMPTY: 'POS:',
        __EMPTY_1: 'LOUN - LOUNGE',
    },
    {
        __EMPTY: 44946,
        __EMPTY_1: 'LB015260',
        __EMPTY_2: '15:04',
        __EMPTY_3: 'L-15',
        __EMPTY_4: 1402,
        __EMPTY_5: 'AKASH',
        __EMPTY_6: 66.78,
        __EMPTY_7: 0,
    },
    {
        __EMPTY: 44946,
        __EMPTY_1: 'LB015260',
        __EMPTY_2: '15:04',
        __EMPTY_3: 'L-15',
        __EMPTY_4: 1402,
        __EMPTY_5: 'AKASH',
        __EMPTY_6: 66.78,
        __EMPTY_7: 0,
    },
    {
        __EMPTY: 44946,
        __EMPTY_1: 'LB015260',
        __EMPTY_2: '15:04',
        __EMPTY_3: 'L-15',
        __EMPTY_4: 1402,
        __EMPTY_5: 'AKASH',
        __EMPTY_6: 66.78,
        __EMPTY_7: 0,
    },
    {
        __EMPTY: 'POS:',
        __EMPTY_1: 'PARTY - PARTY',
    },
    {
        __EMPTY: 44946,
        __EMPTY_1: 'LB015260',
        __EMPTY_2: '15:04',
        __EMPTY_3: 'L-15',
        __EMPTY_4: 1402,
        __EMPTY_5: 'AKASH',
        __EMPTY_6: 66.78,
        __EMPTY_7: 0,
    },
    {
        __EMPTY: 44946,
        __EMPTY_1: 'LB015260',
        __EMPTY_2: '15:04',
        __EMPTY_3: 'L-15',
        __EMPTY_4: 1402,
        __EMPTY_5: 'AKASH',
        __EMPTY_6: 66.78,
        __EMPTY_7: 0,
    },
    {
        __EMPTY: 'POS:',
        __EMPTY_1: 'TERRACE - TERRACE',
    },
    {
        __EMPTY: 44946,
        __EMPTY_1: 'LB015260',
        __EMPTY_2: '15:04',
        __EMPTY_3: 'L-15',
        __EMPTY_4: 1402,
        __EMPTY_5: 'AKASH',
        __EMPTY_6: 66.78,
        __EMPTY_7: 0,
    },
];

需要将其转换为按__EMPTY_1中的POS名称分组的嵌套结构：

[
    {
        'LOUN - LOUNGE': [
            {
                __EMPTY: 44946,
                __EMPTY_1: 'LB015260',
                __EMPTY_2: '15:04',
                __EMPTY_3: 'L-15',
                __EMPTY_4: 1402,
                __EMPTY_5: 'AKASH',
                __EMPTY_6: 66.78,
                __EMPTY_7: 0,
            },
            {
                __EMPTY: 44946,
                __EMPTY_1: 'LB015260',
                __EMPTY_2: '15:04',
                __EMPTY_3: 'L-15',
                __EMPTY_4: 1402,
                __EMPTY_5: 'AKASH',
                __EMPTY_6: 66.78,
                __EMPTY_7: 0,
            },
            {
                __EMPTY: 44946,
                __EMPTY_1: 'LB015260',
                __EMPTY_2: '15:04',
                __EMPTY_3: 'L-15',
                __EMPTY_4: 1402,
                __EMPTY_5: 'AKASH',
                __EMPTY_6: 66.78,
                __EMPTY_7: 0,
            }
        ],
        'PARTY - PARTY': [
            {
                __EMPTY: 44946,
                __EMPTY_1: 'LB015260',
                __EMPTY_2: '15:04',
                __EMPTY_3: 'L-15',
                __EMPTY_4: 1402,
                __EMPTY_5: 'AKASH',
                __EMPTY_6: 66.78,
                __EMPTY_7: 0,
            },
            {
                __EMPTY: 44946,
                __EMPTY_1: 'LB015260',
                __EMPTY_2: '15:04',
                __EMPTY_3: 'L-15',
                __EMPTY_4: 1402,
                __EMPTY_5: 'AKASH',
                __EMPTY_6: 66.78,
                __EMPTY_7: 0,
            }
        ],
        'TERRACE - TERRACE': [
            {
                __EMPTY: 44946,
                __EMPTY_1: 'LB015260',
                __EMPTY_2: '15:04',
                __EMPTY_3: 'L-15',
                __EMPTY_4: 1402,
                __EMPTY_5: 'AKASH',
                __EMPTY_6: 66.78,
                __EMPTY_7: 0,
            }
        ]
    }
]

解决方案 #

可以使用Array.reduce()遍历原数组，同时跟踪当前的分组名称，逐步构建目标结构：

const transformedArray = originalArray.reduce((acc, current) => {
    // 获取结果对象（数组中的第一个元素）
    const resultObj = acc[0];
    // 判断当前项是否是POS分组标记
    if (current.__EMPTY === 'POS:') {
        // 提取分组名称，并初始化对应的空数组
        const groupName = current.__EMPTY_1;
        resultObj[groupName] = [];
        // 更新当前分组，后续数据项将被加入这个分组
        acc.currentGroup = groupName;
    } else {
        // 如果是数据项，将其推入当前分组的数组中
        resultObj[acc.currentGroup].push(current);
    }
    return acc;
}, [{}, null]); // 初始值：数组包含结果对象和当前分组的初始值

// 最终结果只需要数组中的第一个对象
const finalResult = [transformedArray[0]];
console.log(finalResult);

代码说明 #

1. 初始化reduce的累积值为[{}, null]，其中第一个元素是用来存储分组的对象，第二个元素用来跟踪当前的分组名称。
2. 遍历每个元素时：
   • 如果当前元素是POS分组标记（__EMPTY值为'POS:'），则提取分组名称，并在结果对象中创建该名称对应的空数组，同时更新当前分组标记。
   • 如果是数据项，就将其直接推入当前分组的数组中。
3. 最后从累积值中取出结果对象，包装在数组中得到最终结构。

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