Reactjs 如何从对象列表创建对象列表?

Reactjs 如何从对象列表创建对象列表?,reactjs,react-native,Reactjs,React Native,因此,我尝试使用一些现有数据创建一个对象列表。我拥有的数据包含两个值,即“a”和“b”,其中“a”的许多类似值在数据集中重复出现多次 我试图做的是将数据转换为这样一种格式,即对于“a”的任何值,列表将在单个位置包含与其“a”值对应的所有“b”值 数据集是: const tempData = [ {a: 1557637200025, b: "aaaa"}, {a: 1557637200025, b: "bbbb"}, {a: 1557637200025, b: "cccc"}, {a: 15576

因此,我尝试使用一些现有数据创建一个对象列表。我拥有的数据包含两个值,即“a”和“b”,其中“a”的许多类似值在数据集中重复出现多次

我试图做的是将数据转换为这样一种格式,即对于“a”的任何值,列表将在单个位置包含与其“a”值对应的所有“b”值

数据集是:

const tempData = [
{a: 1557637200025, b: "aaaa"},
{a: 1557637200025, b: "bbbb"},
{a: 1557637200025, b: "cccc"},
{a: 1557637200025, b: "dddd"},
{a: 1557637200025, b: "eeee"},
{a: 1557637200025, b: "ffff"},
{a: 1557637200025, b: "gggg"},
{a: 1555563600017, b: "hhhh"},
{a: 1555563600017, b: "iiii"},
{a: 1555563600017, b: "jjjj"},
{a: 1555563600017, b: "kkkk"},
{a: 1555563600017, b: "llll"},
{a: 1555563600017, b: "mmmm"},
{a: 1555563600017, b: "nnnn"},
{a: 1555563600017, b: "oooo"},
{a: 1555563600017, b: "pppp"},
{a: 1555563600017, b: "qqqq"},
{a: 1555563600017, b: "rrrr"},
{a: 1555563600017, b: "ssss"},
{a: 1555563600017, b: "tttt"},
{a: 1555563600017, b: "uuuu"},
{a: 1557982800028, b: "vvvv"},
]
我希望它看起来像这样:

const newTempData = [
{
 a: 1557637200025,b: [
    "aaaa",
    "bbbb",
    ...
]},
{
 a: 1555563600017,b: [
    "hhhh",
    "iiii",
]},
...

]
我已经尝试了为循环嵌套的基本
,但我没有找到任何方法来实现我所寻求的目标。我没有任何方法来更新循环中的第2行的第1行值,以便我可以停止循环以一次又一次地匹配这些值

        var newTempData =[];
        for(let row1 in tempData){
            console.log(row1);
            var some =[];
            var row2 = Number(row1)+1;
            var x = tempData[row1].a;
            for(row2 in tempData) {
                var y = tempData[row2].a;
                var instance = tempData[row2].b;
                if( x === y ){
                    some.push({ ins : instance});
                }
            }
            newTempData.push({a: x,b: some});
        }

        console.log(newTempData);
我得到的输出是这个

0: {a: 1557637200025, b: Array(7)}
1: {a: 1557637200025, b: Array(7)}
2: {a: 1557637200025, b: Array(7)}
3: {a: 1557637200025, b: Array(7)}
4: {a: 1557637200025, b: Array(7)}
5: {a: 1557637200025, b: Array(7)}
6: {a: 1557637200025, b: Array(7)}
7: {a: 1555563600017, b: Array(14)}
8: {a: 1555563600017, b: Array(14)}
9: {a: 1555563600017, b: Array(14)}
10: {a: 1555563600017, b: Array(14)}
11: {a: 1555563600017, b: Array(14)}
12: {a: 1555563600017, b: Array(14)}
13: {a: 1555563600017, b: Array(14)}
14: {a: 1555563600017, b: Array(14)}
15: {a: 1555563600017, b: Array(14)}
16: {a: 1555563600017, b: Array(14)}
17: {a: 1555563600017, b: Array(14)}
18: {a: 1555563600017, b: Array(14)}
19: {a: 1555563600017, b: Array(14)}
20: {a: 1555563600017, b: Array(14)}
21: {a: 1557982800028, b: Array(1)}
我只想不重复地获得所需的数据。现在我可以得到数据,但它是重复的每一个匹配值的'a'。我想知道更好的方法,而不是业余的方法。谢谢。

试试看。我已经注释掉了检查
b
是否已经在数组中,这取决于您是否希望重复
b

const tempData = [
    { a: 1557637200025, b: "aaaa" },
    { a: 1557637200025, b: "bbbb" },
    { a: 1557637200025, b: "cccc" },
    { a: 1557637200025, b: "dddd" },
    { a: 1557637200025, b: "eeee" },
    { a: 1557637200025, b: "ffff" },
    { a: 1557637200025, b: "gggg" },
    { a: 1555563600017, b: "hhhh" },
    { a: 1555563600017, b: "iiii" },
    { a: 1555563600017, b: "jjjj" },
    { a: 1555563600017, b: "kkkk" },
    { a: 1555563600017, b: "llll" },
    { a: 1555563600017, b: "mmmm" },
    { a: 1555563600017, b: "nnnn" },
    { a: 1555563600017, b: "oooo" },
    { a: 1555563600017, b: "pppp" },
    { a: 1555563600017, b: "qqqq" },
    { a: 1555563600017, b: "rrrr" },
    { a: 1555563600017, b: "ssss" },
    { a: 1555563600017, b: "tttt" },
    { a: 1555563600017, b: "uuuu" },
    { a: 1557982800028, b: "vvvv" }
];

const result = tempData.reduce((acc, { a, b }) => {
    const element = acc.find(el => el.a === a);

    // If element exists
    if (element /* && !element.b.includes(b) */) {
        element.b.push(b);

        return acc;
    }/* else if ( element ) { return acc; } */

    acc.push({ a, b: [b] });

    return acc;
}, []);

不要每次都运行
.find
,您可以创建一个对象
{}
,作为reduce的一部分,以避免每次都要查找元素,然后再使用
对象.values

const result = Object.values(tempData.reduce((acc, {a, b}) => {
    if (acc[a]) {
        acc[a].b.push(b)
    } else {
        acc[a] = {a, b: [b]}
    }

    return acc
}, {}))

如果您关心性能,而不是使用阵列的
.find()
,您可以使用:


编辑:或者更好,使用@Vishal Sharma的答案中的对象,其开销比映射少。

所需的输出实际上不是有效的JS对象,例如
b
的值是
{“aaa”}
的数组。你能用有效的输出更新你的问题吗?哦,是的,@MasonStewart。刚刚编辑过。谢谢,b的重复值是正常的。泰姆。我要学很多东西。这就解决了我的问题。谢谢,事实上我的数据集相当大,我认为如果我使用更好的性能实践将是最好的。谢谢Vishal。这对我很有帮助,我从中学到了一些新东西。
  function add(map, {a,b}) {
    if (!map.has(a)) {
      map.set(a, {a:a, b:[]});
    }
    map.get(a).b.push(b);
    return map;
  }

  const result = Array.from(tempData.reduce(add, new Map()).values());