Reorganize a collection of objects to a more intricate structure

Question

Reorganize a collection of objects to a more intricate structure

As I work on my project to create a table using basic HTML (JSX), I am faced with the challenge of displaying unique dates along with the quantity of apples, strawberries, bananas, and oranges sold each day.

The data obtained from the API is causing difficulties in structuring the table as needed, so I am looking to reorganize it.

const data = [
  {
    id: 1,
    date_sold: "2020-11-14",
    fruit: "Apples",
    amount: 9,
  },
  {
    id: 2,
    date_sold: "2020-11-14",
    fruit: "Strawberries",
    amount: 2,
  },
  // more data...
];

The objective is to transform the data into a format like this:

const newData = {
  "2020-11-14": { Bananas: 0, Apples: 9, Strawberries: 2, Oranges: 0 },
  "2020-11-13": { Bananas: 2, Apples: 1, Strawberries: 3, Oranges: 4 },
  // more transformed data...
};

javascript algorithm data-structures

Answer 1

Answer №1

To achieve this, you can utilize the Array.prototype.reduce method.

const records = [
  {
    id: 1,
    date_sold: "2020-11-14",
    fruit: "Apples",
    amount: 9,
  },
  {
    id: 2,
    date_sold: "2020-11-14",
    fruit: "Strawberries",
    amount: 2,
  },
  // more data here...
];

const result = records.reduce((accumulator, current) => {
  accumulator[current.date_sold] ? accumulator[current.date_sold][current.fruit] = current.amount : accumulator[current.date_sold] = {
    [current.fruit]: current.amount
  };
  return accumulator;
}, {});
console.log(result);

Answer 2

To achieve this, you can utilize the Array.prototype.reduce method.

const records = [
  {
    id: 1,
    date_sold: "2020-11-14",
    fruit: "Apples",
    amount: 9,
  },
  {
    id: 2,
    date_sold: "2020-11-14",
    fruit: "Strawberries",
    amount: 2,
  },
  // more data here...
];

const result = records.reduce((accumulator, current) => {
  accumulator[current.date_sold] ? accumulator[current.date_sold][current.fruit] = current.amount : accumulator[current.date_sold] = {
    [current.fruit]: current.amount
  };
  return accumulator;
}, {});
console.log(result);

Answer 3

Answer №2

To create the newData in parts, start by gathering all dates and fruits, such as:

const dates = [];
const fruits = [];

for (const item of data) {
  if (!dates.includes(data.date_sold))
    dates.push(data.date_sold);
  if (!fruits.includes(data.fruit))
    fruits.push(data.push);
}

Next, construct your newDate object by following these steps:

const newData = Object.fromValues(
  dates.map(function (date) {
    const fruitsCount = Object.fromValues(
      fruits.map(function (fruit) {
        return [fruit, 0];
      })
    });
    for (const item of data) {
      if (item.date === date) {
        fruitsCount[item.fruit] += item.amout;
      }
    }
    return [data, fruitsCount];
);

Answer 4

To create the newData in parts, start by gathering all dates and fruits, such as:

const dates = [];
const fruits = [];

for (const item of data) {
  if (!dates.includes(data.date_sold))
    dates.push(data.date_sold);
  if (!fruits.includes(data.fruit))
    fruits.push(data.push);
}

Next, construct your newDate object by following these steps:

const newData = Object.fromValues(
  dates.map(function (date) {
    const fruitsCount = Object.fromValues(
      fruits.map(function (fruit) {
        return [fruit, 0];
      })
    });
    for (const item of data) {
      if (item.date === date) {
        fruitsCount[item.fruit] += item.amout;
      }
    }
    return [data, fruitsCount];
);

Answer 5

Answer №3

I find the following code snippet to be more easily understood.

const salesByDate = {};

salesData.forEach(sale => {
    const dates = Object.keys(salesByDate);
    if (dates.indexOf(sale.date) > -1) {
        const amountSold = salesByDate[sale.date][sale.product];
        salesByDate[sale.date][sale.product] = (amountSold || 0) + sale.quantity;
    } else {
        salesByDate[sale.date] = {
            [sale.product]: sale.quantity
        };
    }
});

Answer 6

I find the following code snippet to be more easily understood.

const salesByDate = {};

salesData.forEach(sale => {
    const dates = Object.keys(salesByDate);
    if (dates.indexOf(sale.date) > -1) {
        const amountSold = salesByDate[sale.date][sale.product];
        salesByDate[sale.date][sale.product] = (amountSold || 0) + sale.quantity;
    } else {
        salesByDate[sale.date] = {
            [sale.product]: sale.quantity
        };
    }
});

Reorganize a collection of objects to a more intricate structure

Answer №1

Answer №2

Answer №3

Similar questions

Highchart: precise positioning of ticks on axis

How can I retrieve a formController in AngularJS?

The next.js application utilizing a custom server is experiencing rendering issues

Utilizing a callback to modify a local variable in JavaScript

Is it possible to combine Sprites as Geometries in Three.js?

Utilize Jquery to insert the text into the input or textarea field

Avoiding overlapping handlers in VueJS

Declaring types globally in Visual Studio Code for JavaScript programming

What is the most streamlined method for identifying if a browser is operating on an Android device?

Custom validation preventing Ng-minlength from functioning correctly

The information entered into dynamically generated text fields is not being successfully passed to the request()->validate() array

"Encountered an undefined error with the title property of this.state.project in the Wordpress API

Tips for accessing a variable located in a different directory

HTML5 coding can be enhanced by applying unique CSS rules for alignment purposes

Display the invoice bill using text in a Vue component

Is there a way to implement a @click event on a Vuetify expansion panel?

Hello there, could you please point out where the error is located in this code?

SMTPConnection._formatError experienced a connection timeout in Nodemailer

Steps for revealing a section of a webpage by completing an HTML form

Issue with displaying full screen Google map within a large modal in Bootstrap 4