如何从基于特定子节点的传入 JSON 创建新的数据结构

Question

我有一个传入的 Json 列表，如下所示

[{
    "id": 190,
    "title": "This is a Story title",
    "category": [{
        "id": 43,
        "title": "XXX",
        "titleFr": "YYY"
    }, {
        "id": 27,
        "title": "AAA",
        "titleFr": "BBB"
    }]
}, {
    "id": 191,
    "title": "This is a Story title 2",
    "category": [{
        "id": 43,
        "title": "XXX",
        "titleFr": "YYY"
    }]
}]

我希望能够找到所有唯一的类别 ID，然后通过按类别分组来创建一个新的数据结构（数组）...即

类别 27- AAA

这是一个故事标题

类别 43 - XXX

这是一个故事标题

这是一个故事标题 2

我有以下代码，到目前为止我可以使用它来遍历并获取类别

$.each(data, function (i, ob) {
    $.each(ob, function (ind, obj) {
        if (ind === "category") {
            Categories.push(this);
        }
    });
});
console.log(Categories);

我觉得上面的方法效率很低，而且它不考虑类别是否已经存在。

其次，我想我需要再次返回整个列表，查找 Category.Id，找到后创建一个新的 obj，然后添加到新列表中？

我觉得这里有很多循环，使用 $.each 会非常低效。

任何帮助，将不胜感激。

Answer 1

您可以使用 vanilla JavaScript 实现这一点，在输入数据上使用Array.reduce构建类别列表，迭代每个故事的每个类别并将故事标题推送到类别条目中的数组中。 然后，您可以使用Object.values将结果对象转换为数组：

 const data = [{ "id": 190, "title": "This is a Story title", "category": [{ "id": 43, "title": "XXX", "titleFr": "YYY" }, { "id": 27, "title": "AAA", "titleFr": "BBB" }] }, { "id": 191, "title": "This is a Story title 2", "category": [{ "id": 43, "title": "XXX", "titleFr": "YYY" }] }]; const categories = Object.values(data.reduce((cats, v) => { v.category.forEach(c => { cats[c.id] = cats[c.id] || { id : c.id, title : c.title, titleFr : c.titleFr, stories : [] }; cats[c.id].stories.push(v.title); }); return cats; }, {})); console.log(categories);