Calculating the sum of values in a JSON array using a specific parameter in Typescript

Question

Calculating the sum of values in a JSON array using a specific parameter in Typescript

A flat JSON array contains repetitive identifier, categoryId, and category:

    data: [
    {
        "identifier": "data",
        "categoryId": "1",
        "category": "Baked goods",
        "product": "Aunt Hattie's",
        "price": "375"
    },
    {
        "identifier": "data",
        "categoryId": "1",
        "category": "Baked goods",
        "product": "Back to Nature",
        "price": "343"
    },        
    {
        "identifier": "data",
        "categoryId": "2",
        "category": "Cakes",
        "product": "Mars Muffin (McVitie's)",
        "price": "465"
    },
    {
        "identifier": "data",
        "categoryId": "2",
        "category": "Cakes",
        "product": "McVitie's",
        "price": "251"
    },
    {
        "identifier": "data",
        "categoryId": "2",
        "category": "Cakes",
        "product": "Mr Kipling",
        "price": "260"
    },
    {
        "identifier": "data",
        "categoryId": "2",
        "category": "Cakes",
        "product": "Mr Kipling Frosty Fancies",
        "price": "210"
    },
    {
        "identifier": "data",
        "categoryId": "3",
        "category": "Dairy products",
        "product": "Amul",
        "price": "474"
    },
    {
        "identifier": "data",
        "categoryId": "3",
        "category": "Dairy products",
        "product": "Borden",
        "price": "184"
    },
    {
        "identifier": "data",
        "categoryId": "3",
        "category": "Dairy products",
        "product": "Broughton Foods Company",
        "price": "43"
    },
]

To calculate the total price for each category and add a new object at the end of each category with the identifier set as Total along with the total value, you can use the following sorting function:

function compare(a,b) {
  if (a.categoryId < b.categoryId)
  return -1;
  if (a.categoryId> b.categoryId)
  return 1;
 return 0;
}

data.sort(compare);

UPDATED OUTPUT FORMAT

The desired output format is as follows:

: [
    {
        "identifier": "data",
        "categoryId": "1",
        "category": "Baked goods",
        "product": "Aunt Hattie's",
        "price": "110"
    },
    {
        "identifier": "data",
        "categoryId": "1",
        "category": "Baked goods",
        "product": "Back to Nature",
        "price": "344"
    },
    {
        "identifier": "Total",
        "categoryId": "1",
        "category": "Baked goods",
        "price": "454"
    },
    {
        "identifier": "data",
        "categoryId": "2",
        "category": "Cakes",
        "product": "Mars Muffin (McVitie's)",
        "price": "455"
    },
    {
        "identifier": "data",
        "categoryId": "2",
        "category": "Cakes",
        "product": "Secret Recipe",
        "price": "471"
    },
    {
        "identifier": "data",
        "categoryId": "2",
        "category": "Cakes",
        "product": "Vimto Jam Tarts",
        "price": "235"
    },
    {
        "identifier": "Total",
        "categoryId": "2",
        "category": "Cakes",
        "price": "1161"
    },
    {
        "identifier": "data",
        "categoryId": "3",
        "category": "Dairy products",
        "product": "Alta Dena",
        "price": "158"
    },
    {
        "identifier": "data",
        "categoryId": "3",
        "category": "Dairy products",
        "product": "Chivers",
        "price": "399"
    },
    {
        "identifier": "Total",
        "categoryId": "3",
        "category": "Dairy products",
        "price": "557"
    }
]

javascript arrays json typescript

Answer 1

Answer №1

Using a hashtable for referencing the same categories and adding another object for each total group is one approach.

All totals are now included at the end of the data set.

To sort the data with the top items first and the totals at the bottom of each category, you can implement a check for the total and move that part to the end of the category section.

var data = [{ identifier: "data", categoryId: "1", category: "Baked goods", product: "Aunt Hattie's", price: "375" }, { identifier: "data", categoryId: "1", category: "Baked goods", product: "Back to Nature", price: "343" }, { identifier: "data", categoryId: "2", category: "Cakes", product: "Mars Muffin (McVitie's)", price: "465" }, { identifier: "data", categoryId: "2", category: "Cakes", product: "McVitie's", price: "251" }, { identifier: "data", categoryId: "2", category: "Cakes", product: "Mr Kipling", price: "260" }, { identifier: "data", categoryId: "2", category: "Cakes", product: "Mr Kipling Frosty Fancies", price: "210" }, { identifier: "data", categoryId: "3", category: "Dairy products", product: "Amul", price: "474" }, { identifier: "data", categoryId: "3", category: "Dairy products", product: "Borden", price: "184" }, { identifier: "data", categoryId: "3", category: "Dairy products", product: "Broughton Foods Company", price: "43" }],
    i,
    l = data.length,
    hash = Object.create(null),
    categoryId, category, price;

for (i = 0; i < l; i++) {
    ({ categoryId, category, price } = data[i]);
    if (!(categoryId in hash)) {
        hash[categoryId] = { identifier: "total", categoryId, category, price: 0 };
        data.push(hash[categoryId]);
    }
    hash[categoryId].price += +price;
}

data.sort((a, b) =>
    a.categoryId - b.categoryId
        || (a.identifier === 'total') - (b.identifier === 'total')
);

console.log(data);

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

Answer 2

Using a hashtable for referencing the same categories and adding another object for each total group is one approach.

All totals are now included at the end of the data set.

To sort the data with the top items first and the totals at the bottom of each category, you can implement a check for the total and move that part to the end of the category section.

var data = [{ identifier: "data", categoryId: "1", category: "Baked goods", product: "Aunt Hattie's", price: "375" }, { identifier: "data", categoryId: "1", category: "Baked goods", product: "Back to Nature", price: "343" }, { identifier: "data", categoryId: "2", category: "Cakes", product: "Mars Muffin (McVitie's)", price: "465" }, { identifier: "data", categoryId: "2", category: "Cakes", product: "McVitie's", price: "251" }, { identifier: "data", categoryId: "2", category: "Cakes", product: "Mr Kipling", price: "260" }, { identifier: "data", categoryId: "2", category: "Cakes", product: "Mr Kipling Frosty Fancies", price: "210" }, { identifier: "data", categoryId: "3", category: "Dairy products", product: "Amul", price: "474" }, { identifier: "data", categoryId: "3", category: "Dairy products", product: "Borden", price: "184" }, { identifier: "data", categoryId: "3", category: "Dairy products", product: "Broughton Foods Company", price: "43" }],
    i,
    l = data.length,
    hash = Object.create(null),
    categoryId, category, price;

for (i = 0; i < l; i++) {
    ({ categoryId, category, price } = data[i]);
    if (!(categoryId in hash)) {
        hash[categoryId] = { identifier: "total", categoryId, category, price: 0 };
        data.push(hash[categoryId]);
    }
    hash[categoryId].price += +price;
}

data.sort((a, b) =>
    a.categoryId - b.categoryId
        || (a.identifier === 'total') - (b.identifier === 'total')
);

console.log(data);

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

Answer 3

Answer №2

Give this a shot!

var data = [
    {
        "identifier": "data",
        "categoryId": "1",
        "category": "Baked goods",
        "product": "Aunt Hattie's",
        "price": "375"
    },
    {
        "identifier": "data",
        "categoryId": "1",
        "category": "Baked goods",
        "product": "Back to Nature",
        "price": "343"
    },        
    {
        "identifier": "data",
        "categoryId": "2",
        "category": "Cakes",
        "product": "Mars Muffin (McVitie's)",
        "price": "465"
    },
    {
        "identifier": "data",
        "categoryId": "2",
        "category": "Cakes",
        "product": "McVitie's",
        "price": "251"
    },
    {
        "identifier": "data",
        "categoryId": "2",
        "category": "Cakes",
        "product": "Mr Kipling",
        "price": "260"
    },
    {
        "identifier": "data",
        "categoryId": "2",
        "category": "Cakes",
        "product": "Mr Kipling Frosty Fancies",
        "price": "210"
    },
    {
        "identifier": "data",
        "categoryId": "3",
        "category": "Dairy products",
        "product": "Amul",
        "price": "474"
    },
    {
        "identifier": "data",
        "categoryId": "3",
        "category": "Dairy products",
        "product": "Borden",
        "price": "184"
    },
    {
        "identifier": "data",
        "categoryId": "3",
        "category": "Dairy products",
        "product": "Broughton Foods Company",
        "price": "43"
    },
]

var total= 0;
var element = {};
data = data.sort((a,b)=> a.categoryId - b.categoryId)
var result = [];
data.forEach((ele,index)=>{
     
    if(!element.categoryId || element.categoryId == ele.categoryId){
        result.push(ele);
        total += parseInt(ele.price);
    }else{
      result.push({
           "identifier": "total",
           "categoryId": element.categoryId,
           "category": element.category,
           "total" : total
      });
      result.push(ele);
      total = parseInt(ele.price);  
    }
   element = ele;
})
result.push({
  identifier  :element.identifier,
  total : total
});
console.log(result);

Answer 4

Give this a shot!

var data = [
    {
        "identifier": "data",
        "categoryId": "1",
        "category": "Baked goods",
        "product": "Aunt Hattie's",
        "price": "375"
    },
    {
        "identifier": "data",
        "categoryId": "1",
        "category": "Baked goods",
        "product": "Back to Nature",
        "price": "343"
    },        
    {
        "identifier": "data",
        "categoryId": "2",
        "category": "Cakes",
        "product": "Mars Muffin (McVitie's)",
        "price": "465"
    },
    {
        "identifier": "data",
        "categoryId": "2",
        "category": "Cakes",
        "product": "McVitie's",
        "price": "251"
    },
    {
        "identifier": "data",
        "categoryId": "2",
        "category": "Cakes",
        "product": "Mr Kipling",
        "price": "260"
    },
    {
        "identifier": "data",
        "categoryId": "2",
        "category": "Cakes",
        "product": "Mr Kipling Frosty Fancies",
        "price": "210"
    },
    {
        "identifier": "data",
        "categoryId": "3",
        "category": "Dairy products",
        "product": "Amul",
        "price": "474"
    },
    {
        "identifier": "data",
        "categoryId": "3",
        "category": "Dairy products",
        "product": "Borden",
        "price": "184"
    },
    {
        "identifier": "data",
        "categoryId": "3",
        "category": "Dairy products",
        "product": "Broughton Foods Company",
        "price": "43"
    },
]

var total= 0;
var element = {};
data = data.sort((a,b)=> a.categoryId - b.categoryId)
var result = [];
data.forEach((ele,index)=>{
     
    if(!element.categoryId || element.categoryId == ele.categoryId){
        result.push(ele);
        total += parseInt(ele.price);
    }else{
      result.push({
           "identifier": "total",
           "categoryId": element.categoryId,
           "category": element.category,
           "total" : total
      });
      result.push(ele);
      total = parseInt(ele.price);  
    }
   element = ele;
})
result.push({
  identifier  :element.identifier,
  total : total
});
console.log(result);

Answer 5

Answer №3

To get the result you want, employ Array.reduce in conjunction with a hash object to compute the overall cost:

Check out this Stackblitz demo

Answer 6

To get the result you want, employ Array.reduce in conjunction with a hash object to compute the overall cost:

Check out this Stackblitz demo

Answer 7

Answer №4

Here is an alternative solution to the problem.

const sortedData = data.sort((item1, item2) => item1.categoryId - item2.categoryId)
.reduce((result, item) => {
    const { category, categoryId } = result.last
    const isEnd = categoryId && categoryId !== item.categoryId;
    const total = isEnd ? [{ category, categoryId, 'identifier': 'Total', 'price': result.sum }] : [];
    return {
      list: [...result.list, ...total, item],
      sum: (!isEnd ? result.sum : 0) + parseInt(item.price),
      last: item
    };
}, { list: [], sum: 0, last: {} });

Try it out on stackblitz

Answer 8

Here is an alternative solution to the problem.

const sortedData = data.sort((item1, item2) => item1.categoryId - item2.categoryId)
.reduce((result, item) => {
    const { category, categoryId } = result.last
    const isEnd = categoryId && categoryId !== item.categoryId;
    const total = isEnd ? [{ category, categoryId, 'identifier': 'Total', 'price': result.sum }] : [];
    return {
      list: [...result.list, ...total, item],
      sum: (!isEnd ? result.sum : 0) + parseInt(item.price),
      last: item
    };
}, { list: [], sum: 0, last: {} });

Try it out on stackblitz

Calculating the sum of values in a JSON array using a specific parameter in Typescript

Answer №1

Answer №2

Answer №3

Answer №4

Similar questions

Add a CSS class to the text that is selected within a Content Editable div

Improving the pagination performance in AngularJS

Traditional method for comparing prevProps in componentDidUpdate

Can you explain the meaning behind the code Array.remove = function() {...}?

What is the time complexity for finding a specific value in a two-dimensional matrix?

Looking for categorized posts on WordPress using the WP-API?

Tips for effectively utilizing a Query or QueryTask with local graphics (GraphicsLayer)

Unable to access 'this' within a custom operator in RxJs

Twilio Group MMS feature experiencing technical difficulties

Determining the type of a keyof T in Typescript

The event listener $(window).on('popstate') does not function properly in Internet Explorer

What methods are available for authentication to be shared among microservices?

Understanding the Functions of Angular Providers and Implementing Them

Understanding how to decode querystring parameters within a Django view

Importing a JSON or JSONC file into a vite/typescript project can be easily done

What is the process for integrating ng-bootstrap into an Angular 5 project?

Is it possible to define data types for the global context in cucumber?

Tips for displaying a table with a button click

Mongooses provide a JSON list of tags that are defined as subdocuments

Tips for effectively handling the Ajax success callback function