JavaScript合并数组相同id数据，按餐食类型重组方法

本文介绍使用JavaScript高效合并数组中相同ID的数据，并按餐食类型（早餐、中餐、晚餐）重组数据的方法。 通过`reduce`方法，代码将原始数据[{id, jine, type}]转换为目标格式[{id, jine1, jine2, jine3}]，其中jine1、jine2、jine3分别代表早餐、中餐、晚餐的金额。该方法简洁易懂，易于扩展至更多餐食类型，避免了复杂的循环嵌套，提高了代码效率和可维护性。 学习本方法，轻松解决JavaScript数组数据合并与重组难题。

使用JavaScript将数组中相同ID的数据合并为单一对象并按餐食类型重新组织

在JavaScript开发中，经常需要处理将数组中具有相同ID的数据合并成单个对象，并根据其他属性（例如餐食类型）重新组织数据的情况。本文将详细介绍如何实现这一目标。

原始数据结构

假设我们有以下原始数据：

const dataList = [
    { id: "202301", jine: 23, type: "晚餐" },
    { id: "202301", jine: 87.5, type: "早餐" },
    { id: "202301", jine: 1065.5, type: "中餐" },
    { id: "202302", jine: 10, type: "晚餐" },
    { id: "202302", jine: 181.5, type: "早餐" },
    { id: "202302", jine: 633.5, type: "中餐" }
];

期望数据格式

我们的目标是将数据转换为以下格式：

const expectedData = [
    { id: "202301", jine1: 87.5, jine2: 1065.5, jine3: 23 },
    { id: "202302", jine1: 181.5, jine2: 633.5, jine3: 10 }
];

其中jine1代表早餐金额，jine2代表中餐金额，jine3代表晚餐金额。

实现方法

我们可以使用reduce方法来实现数据合并和重组。以下代码展示了具体的实现步骤：

const result = Object.values(dataList.reduce((acc, curr) => {
    if (!acc[curr.id]) {
        acc[curr.id] = { id: curr.id, jine1: 0, jine2: 0, jine3: 0 };
    }
    if (curr.type === '早餐') acc[curr.id].jine1 = curr.jine;
    if (curr.type === '中餐') acc[curr.id].jine2 = curr.jine;
    if (curr.type === '晚餐') acc[curr.id].jine3 = curr.jine;
    return acc;
}, {}));

这段代码首先使用reduce方法将数组按照id分组，并将每个id对应的对象存储在一个对象中。然后，它遍历每个对象，根据type属性将jine值分配给相应的jine1，jine2或jine3属性。最后，使用Object.values方法将结果转换为数组。

这种方法简洁高效，避免了复杂的循环嵌套，并且易于理解和维护。 它直接处理了数据，不需要额外的辅助函数。 如果餐食类型有更多种类，只需要在if语句中添加相应的判断即可。

以上就是《JavaScript合并数组相同id数据，按餐食类型重组方法》的详细内容，更多关于的资料请关注golang学习网公众号！