合并两个具有外键 ID 的对象数组

Question

我正在进行 2 次 api 调用以接收两组数据。

const callOne = await api('GET', `${baseUrl}callOne`);
const callTwo = await api('GET', `${baseUrl}callTwo`);

然后我可以输出结果

console.log(callOne.data);
console.log(callTwo.data);

所以 resultOne 是一个对象数组。我在下面展示了几个对象。

[
   {
      "id":1,
      "name":"Some Name",
      "description":"Some description",
      "currency":"USD",
      "price":"350",
      "created_at":"2021-12-08T17:53:12.000Z",
   },
   {
      "id":2,
      "name":"Some Name",
      "description":"Some description",
      "currency":"USD",
      "price":"12",
      "created_at":"2021-12-08T17:53:12.000Z",
   },
]

和resultTwo差不多。此处仅显示一些结果。

[
   {
      "id":1,
      "resultOneId":1,
      "startDate":"2022-02-01T16:00:00.000Z",
      "endDate":"2022-02-08T18:00:00.000Z",
      "duration":"3 minutes",
      "created_at":"2021-12-08T17:53:12.000Z",
   },
   {
      "id":2,
      "resultOneId":1,
      "startDate":"2021-02-08T09:00:00.000Z",
      "endDate":"2021-02-17T18:00:00.000Z",
      "duration":"2 hours",
      "created_at":"2021-12-08T17:53:12.000Z",
   },
    {
      "id":3,
      "resultOneId":2,
      "startDate":"2021-02-08T09:00:00.000Z",
      "endDate":"2021-02-17T18:00:00.000Z",
      "duration":"5 hours",
      "created_at":"2021-12-08T17:53:12.000Z",
   },
]

我想做的是创建一个新的对象数组，它基本上根据 resultOneId 将 resultTwo 与 resultOne 连接起来。所以我想像这样结束

[
   {
      "id":1,
      "name":"Some Name",
      "description":"Some description",
      "currency":"USD",
      "price":"350",
      "created_at":"2021-12-08T17:53:12.000Z",
      "resultTwos": [
          {
              "id":1,
              "resultOneId":1,
              "startDate":"2022-02-01T16:00:00.000Z",
              "endDate":"2022-02-08T18:00:00.000Z",
              "duration":"3 minutes",
              "created_at":"2021-12-08T17:53:12.000Z",
           },
           {
              "id":2,
              "resultOneId":1,
              "startDate":"2021-02-08T09:00:00.000Z",
              "endDate":"2021-02-17T18:00:00.000Z",
              "duration":"2 hours",
              "created_at":"2021-12-08T17:53:12.000Z",
           },
      ]
   },
   {
      "id":2,
      "name":"Some Name",
      "description":"Some description",
      "currency":"USD",
      "price":"12",
      "created_at":"2021-12-08T17:53:12.000Z",
      "resultTwos": [
            {
              "id":3,
              "resultOneId":2,
              "startDate":"2021-02-08T09:00:00.000Z",
              "endDate":"2021-02-17T18:00:00.000Z",
              "duration":"5 hours",
              "created_at":"2021-12-08T17:53:12.000Z",
           },
      ]
   },
]

我一直在尝试使用 reduce 和 map 进行此操作，但进展不大。

感谢任何建议。

谢谢

Answer 1

我强烈建议在服务器端处理它，但这里是代码：

const results = []
for (const itemOne of callOne.data) {
    const resultTwos = callTwo.data.filter((itemTwo) =>
        itemTwo.resultOneId == itemOne.data.id
    )
    results.push({ ...itemOne, resultTwos })
}
console.log(results)

Answer 2

您可以遍历第一个数据数组并检查它们是否是第二个数据数组中的现有项目，其中 resultOneId 等于它们的 id

let data1 = [
   {
      "id":1,
      "name":"Some Name",
      "description":"Some description",
      "currency":"USD",
      "price":"350",
      "created_at":"2021-12-08T17:53:12.000Z",
   },
   {
      "id":2,
      "name":"Some Name",
      "description":"Some description",
      "currency":"USD",
      "price":"12",
      "created_at":"2021-12-08T17:53:12.000Z",
   },
];

let data2 = [
   {
      "id":1,
      "resultOneId":1,
      "startDate":"2022-02-01T16:00:00.000Z",
      "endDate":"2022-02-08T18:00:00.000Z",
      "duration":"3 minutes",
      "created_at":"2021-12-08T17:53:12.000Z",
   },
   {
      "id":2,
      "resultOneId":1,
      "startDate":"2021-02-08T09:00:00.000Z",
      "endDate":"2021-02-17T18:00:00.000Z",
      "duration":"2 hours",
      "created_at":"2021-12-08T17:53:12.000Z",
   },
    {
      "id":3,
      "resultOneId":2,
      "startDate":"2021-02-08T09:00:00.000Z",
      "endDate":"2021-02-17T18:00:00.000Z",
      "duration":"5 hours",
      "created_at":"2021-12-08T17:53:12.000Z",
   },
];

let result = data1.reduce((accumulator, current) => {
  let items = data2.filter(item => {
    return item.resultOneId === current.id;
  });
  return accumulator.concat({
    ...current, 
    resultTwos: items
  });
}, []);

console.log(result);

Answer 3

简单如：

resultOnes.map( one => {return { ...one, resultTwos: resultTwos.filter(two => two.resultOneId === one.id)}})

Answer 4


const data:any[] = [];

callOne.data.forEach((call1=>any) => {

    const item:any = call1;

    item.resultTwos = callTwo.data.filter((call2:any) => call1.id === call2.resultOneId);

    data.push(item);

})

console.log(data)

Answer 5

var callOne =
[
   {
      "id":1,
      "name":"Some Name",
      "description":"Some description",
      "currency":"USD",
      "price":"350",
      "created_at":"2021-12-08T17:53:12.000Z",
   },
   {
      "id":2,
      "name":"Some Name",
      "description":"Some description",
      "currency":"USD",
      "price":"12",
      "created_at":"2021-12-08T17:53:12.000Z",
   },
];

var callTwo = 
[
   {
      "id":1,
      "resultOneId":1,
      "startDate":"2022-02-01T16:00:00.000Z",
      "endDate":"2022-02-08T18:00:00.000Z",
      "duration":"3 minutes",
      "created_at":"2021-12-08T17:53:12.000Z",
   },
   {
      "id":2,
      "resultOneId":1,
      "startDate":"2021-02-08T09:00:00.000Z",
      "endDate":"2021-02-17T18:00:00.000Z",
      "duration":"2 hours",
      "created_at":"2021-12-08T17:53:12.000Z",
   },
    {
      "id":3,
      "resultOneId":2,
      "startDate":"2021-02-08T09:00:00.000Z",
      "endDate":"2021-02-17T18:00:00.000Z",
      "duration":"5 hours",
      "created_at":"2021-12-08T17:53:12.000Z",
   }
];

for(let i=0;i<callOne.length;i++){ //Loops through callOne data
    var id = callOne[i]['id']; //Get id for callOne data
    callOne[i]['resultsTwos'] = []; //create array for callTwo related data
    for(let ii=0;ii<callTwo.length;ii++){ //Loops through calltwo data
        if(callTwo[ii]['resultOneId']!=id) //continue loop if calltwo data is not related to call one data
            continue;
        callOne[i]['resultsTwos'].push(callTwo.data[ii]); //insert calltwo data into callone resultsTwo array
    }
}```

合并两个具有外键 ID 的对象数组

Merging two array of objects with foreign key id

javascript

ecmascript-6