使用 Lodash .groupBy 添加多个键答案

【问题标题】：Using Lodash .groupBy to add multiple keys使用 Lodash .groupBy 添加多个键
【发布时间】：2021-05-26 18:21:16
【问题描述】：

这个问题的扩展：using lodash .groupBy. how to add your own keys for grouped output?

让我们把数组改成这个：

[
    {
        "name": "jim",
        "color": "blue",
        "order": 1,
        "age": "22"
    },
    {
        "name": "Sam",
        "color": "blue",
        "order": 1,
        "age": "33"
    },
    {
        "name": "eddie",
        "color": "green",
        "order": 3
        "age": "77"
    }
]

订单字段已添加。在上一个问题中，这个

var result = _.chain(data)
    .groupBy("color")
    .pairs()
    .map(function(currentItem) {
        return _.object(_.zip(["color", "users"], currentItem));
    })
    .value();
console.log(result);

用来把数组改成

[
    {
        color: "blue",
        users: [
            {
                "name": "jim",
                "color": "blue",
                "age": "22"
            },
            {
                "name": "Sam",
                "color": "blue",
                "age": "33"
            }
        ]
    },
    {
        color: "green",
        users: [
            {
                "name": "eddie",
                "color": "green",
                "age": "77"
            }
        ]
    }
]

现在，我想将“订单”字段添加到组中，使数组看起来像

[
    {
        color: "blue",
        order: 1,
        users: [
            {
                "name": "jim",
                "color": "blue",
                "age": "22"
            },
            {
                "name": "Sam",
                "color": "blue",
                "age": "33"
            }
        ]
    },
    {
        color: "green",
        order: 3,
        users: [
            {
                "name": "eddie",
                "color": "green",
                "age": "77"
            }
        ]
    }
]

【问题讨论】：

标签： javascript lodash

【解决方案1】：

您可以从对象中排除order，并解构并获取对象的其余部分。

const 
    data = [{ name: "jim", color: "blue", order: 1, age: "22" }, { name: "Sam", color: "blue", order: 1, age: "33" }, { name: "eddie", color: "green", order: 3, age: "77" }],
    result = _.chain(data)
        .groupBy("color")
        .map(users => ({
            color: users[0].color,
            order: users[0].order,
            users: users.map(({ order, ...o }) => o)
        }))
        .value();

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.15/lodash.min.js"&gt;&lt;/script&gt;

【讨论】：

【解决方案2】：

如果你还没有下定决心使用 lodash，这其实真的很简单。

const data = [
    {
        "name": "jim",
        "color": "blue",
        "order": 1,
        "age": "22"
    },
    {
        "name": "Sam",
        "color": "blue",
        "order": 1,
        "age": "33"
    },
    {
        "name": "eddie",
        "color": "green",
        "order": 3,
        "age": "77"
    }
]

const result = data.reduce((carry, current) => {
    const { color, order, ...user } = current;
    let el = carry.find((item) => item.color === color && order === current.order);
    if (!el) {
         el = { color, order, users: [] }
         carry.push(el);
    }
    el.users.push({ ...user, color });
    return carry;
}, []);

console.log(result);

【讨论】：