javascript - 使用嵌套的 for 循环比较两个对象的值并返回修改后的对象数组

Question

我有两个对象数组:

const testArr1 = [
      {
        event: "Ryan's birthday",
        time: "4:00",
      },
      {
        event: "Steves's birthday",
        time: "2:00",
      },
      {
        event: "Helen's birthday",
        time: "1:00",
      },
      {
        event: "Paola's birthday",
        time: "3:00",
      },
      {
        event: "Jared's birthday",
        time: "9:00",
      },
    ];

和

const testArr2 = [
      {
        time: "4:00",
        temp: 41,
      },
      {
        time: "6:00",
        temp: 42,
      },
      {
        time: "8:00",
        temp: 43,
      },
      {
        time: "1:00",
        temp: 44,
      },
      {
        time: "3:00",
        temp: 45,
      },
      {
        time: "9:00",
        temp: 46,
      },
    ];

我想创建一个函数，它接受这两个对象数组并返回一个名为 dataToDisplay 的新对象数组。 . dataToDisplay应该包含与事件相关的对象。
我想要函数 getDataToDisplay通过比较 testArr1 来查看事件是否有可用的温度数据和 testArr2 time 的值键，然后给我一组具有相关 temp 的对象 time 时的数据值匹配，或有 no matching data found在 time 时注明值不匹配。
我的问题是，使用我现在构建的函数，一个对象被推送到 dataToDisplay在比较时间值时返回 false 的每次迭代中，因此存在大量重复数据。
这是功能:

const getDataToDisplay = (testArr1, testArr2) => {
  const dataToDisplay = [];

  for (let i = 0; i < testArr1.length; i++) {
    for (let j = 0; j < testArr2.length; j++) {
      let objToPush = {};

      //if times in both objects are equal, push an object containing event, time, and temp value at that time to dataToDisplay
      //break and move on if times are equal
      if (testArr1[i].time === testArr2[j].time) {
        Object.assign(objToPush, {
          event: testArr1[i].event,
          time: testArr1[i].time,
          temp: testArr2[j].temp,
        });
        dataToDisplay.push(objToPush);
        break;
      } else {
        //if times in both objects are NOT equal, push an object containing event, time, and a temp value of "no matching data found"
        Object.assign(objToPush, {
          event: testArr1[i].event,
          time: testArr1[i].time,
          temp: "no matching data found",
        });
        //this is pushing an object every time the condition returns false
        //I only want one object returned if false
        dataToDisplay.push(objToPush);
      }
    }
  }
  return dataToDisplay;
};

这是调用函数时发生的情况

console.log(getDataToDisplay(testArr1, testArr2));
    //logs
    //     [
    //   {
    //     "event": "Ryan's birthday",
    //     "time": "4:00",
    //     "temperature": 41
    //   },
    //   {
    //     "event": "Steves's birthday",
    //     "time": "2:00",
    //     "temperature": "no matching data found"
    //   },
    //   {
    //     "event": "Steves's birthday",
    //     "time": "2:00",
    //     "temperature": "no matching data found"
    //   },
    //   {
    //     "event": "Steves's birthday",
    //     "time": "2:00",
    //     "temperature": "no matching data found"
    //   }
    //   ...
    // ]

    //but I want it to log something like this
    // [
    //   {
    //     event: "Ryan's birthday",
    //     time: "4:00",
    //     temperature: 41,
    //   },
    //   {
    //     event: "Steves's birthday",
    //     time: "2:00",
    //     temperature: "no matching data found",
    //   },
    //   {
    //     event: "Helen's birthday",
    //     time: "1:00",
    //     temperature: 44,
    //   },
    //   ...
    // ];

如何为每个事件返回一个新的修改对象，而不是每次比较的结果？我觉得我很亲近!

Answer 1

您可以在 temparatures 的所有时间里取一个对象。数组和映射events值为 times 的数组对象使用 time作为关键。

const
    noData = 'no matching data found',
    events = [{ event: "Ryan's birthday", time: "4:00" }, { event: "Steves's birthday", time: "2:00" }, { event: "Helen's birthday", time: "1:00" }, { event: "Paola's birthday", time: "3:00" }, { event: "Jared's birthday", time: "9:00" }],
    temperatures = [{ time: "4:00", temp: 41 }, { time: "6:00", temp: 42 }, { time: "8:00", temp: 43 }, { time: "1:00", temp: 44 }, { time: "3:00", temp: 45 }, { time: "9:00", temp: 46 }],
    times = Object.fromEntries(temperatures.map(({ time, temp }) => [time, temp])),
    result = events.map(o => ({ ...o, temperature: times[o.time] || noData }));

console.log(result);

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