使用map/reduce来简化复杂的对象数组

Question

我正在尝试使用reduce 来获取对象数组并以低于预期的格式返回一个对象。能够使用它基于 validFrom 创建对象，但无法可视化后续步骤。也尝试使用地图，但没有多大帮助。非常感谢您的帮助！如果有帮助的话可以分享 stackblitz。

尝试这样做来简化，但陷入下一步。第一条评论

inputArray:
[
  {
    "day": "Wednesday",
    "closeTime": "2000",
    "openTime": "0800",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  },
  {
    "day": "Tuesday",
    "closeTime": "2000",
    "openTime": "0800",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  },
  {
    "day": "Sunday",
    "closeTime": "1630",
    "openTime": "0845",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  },
  {
    "day": "Thursday",
    "closeTime": "2000",
    "openTime": "0800",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  },
  {
    "day": "Friday",
    "closeTime": "2000",
    "openTime": "0800",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  },
  {
    "day": "Saturday",
    "closeTime": "1630",
    "openTime": "0845",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  },
  {
    "day": "Monday",
    "closeTime": "2000",
    "openTime": "0800",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  }
]

使用的代码：

let clubbedArray = normalData.reduce((acc, temp) => { let { validFrom, day } = temp; return {...acc, [validFrom]: [...(acc[validFrom] || []), day]}; }, {});

预期输出：

[
  {
    "day": [
      "Friday",
      "Wednesday",
      "Monday",
      "Tuesday",
      "Thursday"
    ],
    "closeTime": "2000",
    "openTime": "0800",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  },
  {
    "day": [
      "Saturday",
      "Sunday"
    ],
    "closeTime": "1630",
    "openTime": "0845",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  }
]

Answer 1

您可以使用

Array.prototype.reduce

函数根据需要更改数组的形状，这是允许您更改数据形状的代码

let data = [
  {
    "day": "Wednesday",
    "closeTime": "2000",
    "openTime": "0800",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  },
  {
    "day": "Tuesday",
    "closeTime": "2000",
    "openTime": "0800",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  },
  {
    "day": "Sunday",
    "closeTime": "1630",
    "openTime": "0845",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  },
  {
    "day": "Thursday",
    "closeTime": "2000",
    "openTime": "0800",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  },
  {
    "day": "Friday",
    "closeTime": "2000",
    "openTime": "0800",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  },
  {
    "day": "Saturday",
    "closeTime": "1630",
    "openTime": "0845",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  },
  {
    "day": "Monday",
    "closeTime": "2000",
    "openTime": "0800",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  }
];

const result = data.reduce((accumulator, current) => {
   /*
       Check if there is an object on the result array with the corresponding closeTime if that is the case we return it index
   */
   let exists = accumulator.findIndex(item => {
       return item.closeTime == current.closeTime;
   })
   
   // if there is not item with that closeTime the result of the findIndex will be `-1` if so we add an object with the corresponding closeTime with all property of the `current` item of the reduce loop
   if(exists === -1) {
       accumulator = accumulator.concat({
          day: [current.day],
          closeTime: current.closeTime,
          openTime: current.openTime,
          validFrom: current.validFrom,
          validTo: current.validTo,
       })
   } else {
       accumulator[exists].day.push(current.day);
   }
   return accumulator;
}, []);

console.log(result);

Answer 2

您可以使用以下代码来实现您的结果：

const normalData = [{
    "day": "Wednesday",
    "closeTime": "2000",
    "openTime": "0800",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  },
  {
    "day": "Tuesday",
    "closeTime": "2000",
    "openTime": "0800",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  },
  {
    "day": "Sunday",
    "closeTime": "1630",
    "openTime": "0845",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  },
  {
    "day": "Thursday",
    "closeTime": "2000",
    "openTime": "0800",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  },
  {
    "day": "Friday",
    "closeTime": "2000",
    "openTime": "0800",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  },
  {
    "day": "Saturday",
    "closeTime": "1630",
    "openTime": "0845",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  },
  {
    "day": "Monday",
    "closeTime": "2000",
    "openTime": "0800",
    "validFrom": "2001-09-19",
    "validTo": "2099-12-31"
  }
];

const combinedData = normalData.reduce((acc, curr) => {
  let found = false;
  acc.forEach((item) => {
    if (
      item.closeTime === curr.closeTime &&
      item.openTime === curr.openTime &&
      item.validFrom === curr.validFrom &&
      item.validTo === curr.validTo
    ) {
      item.day.push(curr.day);
      found = true;
    }
  });
  if (!found) {
    acc.push({
      day: [curr.day],
      closeTime: curr.closeTime,
      openTime: curr.openTime,
      validFrom: curr.validFrom,
      validTo: curr.validTo,
    });
  }
  return acc;
}, []);

console.log(combinedData);