how to modify object array as per date in javascript

Question

I have below an array of available slots.

[
  { date: "06/10/2020", start: "10:00 am", end: "11:00 am" },
  { date: "06/10/2020", start: "11:00 am", end: "12:00 am" },
  { date: "06/10/2020", start: "12:00 am", end: "01:00 pm" },
  { date: "07/10/2020", start: "10:00 am", end: "11:00 am" },
  { date: "07/10/2020", start: "11:00 am", end: "12:00 am" },
  { date: "07/10/2020", start: "12:00 am", end: "01:00 pm" },
];

I want to filter above array with same date value. Somthing like below.

[
  {
    date: "06/10/2020",
    count: 3,
    slots: [
      { start: "10:00 am", end: "11:00 am" },
      { start: "11:00 am", end: "12:00 am" },
      { start: "12:00 am", end: "01:00 pm" },
    ],
  },
  {
    date: "07/10/2020",
    count: 3,
    slots: [
      { start: "10:00 am", end: "11:00 am" },
      { start: "11:00 am", end: "12:00 am" },
      { start: "12:00 am", end: "01:00 pm" },
    ],
  },
];

mkHun · Accepted Answer · 2020-10-06 09:35:42Z

You need to use Object for this kind of scenario. Because we cannot store the duplicate values in Objects.

So the answer is

data = [
    { date: "06/10/2020", start: "10:00 am", end: "11:00 am" },
    { date: "06/10/2020", start: "11:00 am", end: "12:00 am" },
    { date: "06/10/2020", start: "12:00 am", end: "01:00 pm" },
    { date: "07/10/2020", start: "10:00 am", end: "11:00 am" },
    { date: "07/10/2020", start: "11:00 am", end: "12:00 am" },
    { date: "07/10/2020", start: "12:00 am", end: "01:00 pm" },
];

let finalData = {};

for (const x of data) {

    if (finalData[x.date]) { // if the key is already there increase the count and push the slots value
        finalData[x.date].count += 1;
        finalData[x.date].slots.push({ start: x.start, end: x.end });
    } else { // otherwise set the new value
        finalData[x.date] = { date: x.date, count: 1, slots: [{ start: x.start, end: x.end }] };
    }

}
var value = Object.values(finalData);
console.log(JSON.stringify(value, null, 2));

hgb123 · Accepted Answer · 2020-10-06 09:31:07Z

First, you group into object with key-value of date-slots using reduce.

After that, use Object.entries to transform the grouped object to array of key-value pairs

Finally, map through that pairs and grab the corresponding value for your expected output

const input = [
  { date: "06/10/2020", start: "10:00 am", end: "11:00 am" },
  { date: "06/10/2020", start: "11:00 am", end: "12:00 am" },
  { date: "06/10/2020", start: "12:00 am", end: "01:00 pm" },
  { date: "07/10/2020", start: "10:00 am", end: "11:00 am" },
  { date: "07/10/2020", start: "11:00 am", end: "12:00 am" },
  { date: "07/10/2020", start: "12:00 am", end: "01:00 pm" },
]

const res = Object.entries(
  input.reduce((acc, { date, ...el }) => {
    if (acc[date]) {
      acc[date].push(el)
    } else {
      acc[date] = [el]
    }

    return acc
  }, {})
).map(([key, value]) => ({
  date: key,
  count: value.length,
  slots: value,
}))

console.log(res)

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

Ravi Khunt · Accepted Answer · 2020-10-06 09:31:59Z

          var arr = [
            { date: "06/10/2020", start: "10:00 am", end: "11:00 am" },
            { date: "06/10/2020", start: "11:00 am", end: "12:00 am" },
            { date: "06/10/2020", start: "12:00 am", end: "01:00 pm" },
            { date: "07/10/2020", start: "10:00 am", end: "11:00 am" },
            { date: "07/10/2020", start: "11:00 am", end: "12:00 am" },
            { date: "07/10/2020", start: "12:00 am", end: "01:00 pm" },
          ];
          const result = [
            ...arr
              .reduce((hash, { start, end, date }) => {
                const current = hash.get(date) || { date, slots: [] };
                current.slots.push({ start, end });
                return hash.set(date, current);
              }, new Map())
              .values(),
          ];
          result.map((x) => {
            x.count = x.slots.length;
          });
          console.log(result);

Ufuk UYSAL · Accepted Answer · 2020-10-06 10:30:05Z

const data = [
  { date: "06/10/2020", start: "10:00 am", end: "11:00 am" },
  { date: "06/10/2020", start: "11:00 am", end: "12:00 am" },
  { date: "06/10/2020", start: "12:00 am", end: "01:00 pm" },
  { date: "07/10/2020", start: "10:00 am", end: "11:00 am" },
  { date: "07/10/2020", start: "11:00 am", end: "12:00 am" },
  { date: "07/10/2020", start: "12:00 am", end: "01:00 pm" },
];

Find your date values

const dateArray = data.map((item) => item.date);

console.log(dateArray);

Find different dates according to days

const sortbydate = dateArray.map((item) => item.split("/")[0]);

console.log(sortbydate);

Find a unique value to determine how many arrays should be created

const uniqueDates = [...new Set(sortbydate)];

console.log(uniqueDates);

const arr1 = [];
const arr2 = [];

function FindDateObje() {
  for (let i = 0; i < sortbydate.length; i++) {
    if (sortbydate[i] == uniqueDates[0]) {
      arr1.push(data[i]);
    } else {
      arr2.push(data[i]);
    }
  }
  return [arr1, arr2];
}
console.log(FindDateObje());

Collectives™ on Stack Overflow

how to modify object array as per date in javascript

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related