Summarize the array of objects and find the average value for each distinct object name

Question

Summarize the array of objects and find the average value for each distinct object name

I'm facing a challenge with an array structure:

const originalArray = [
     {
       name: "a",
       value: 1 
     },
     {
       name: "a",
       value: 2 
     },
     {
       name: "a",
       value: 3 
     },
     {
       name: "b",
       value: 0 
     },
     {
       name: "b",
       value: 1 
     }
 ];

My goal is to transform this array into the following format:

const newArray = [
     {
       name: "a",
       value: 2
     },
     {
       name: "b",
       value: 0.5
     }
 ]

The new array should contain each unique name as an object with the average value.

Any suggestions on how to achieve this efficiently?

javascript arrays unique average

Answer 1

Answer №1

To find the average of values in an array, you will need to iterate through the array and calculate the sum as well as the count for each object. Here is a simple example:

function calculateAverage(array) {
    var sums = {}, counts = {}, results = [], name;
    for (var index = 0; index < array.length; index++) {
        name = array[index].name;
        if (!(name in sums)) {
            sums[name] = 0;
            counts[name] = 0;
        }
        sums[name] += array[index].value;
        counts[name]++;
    }

    for(name in sums) {
        results.push({ name: name, value: sums[name] / counts[name] });
    }
    return results;
}

See it in action

Alternatively, using a library like Underscore.js can simplify this process:

var averages = _.chain(array)
                .groupBy('name')
                .map(function(group, key) {
                    return { 
                        name: key, 
                        value: _.chain(group)
                                .pluck('value')
                                .reduce(function(x, y) { return x + y })
                                .value() / group.length
                    };
                })
                .value();

Check out the demo

Answer 2

To find the average of values in an array, you will need to iterate through the array and calculate the sum as well as the count for each object. Here is a simple example:

function calculateAverage(array) {
    var sums = {}, counts = {}, results = [], name;
    for (var index = 0; index < array.length; index++) {
        name = array[index].name;
        if (!(name in sums)) {
            sums[name] = 0;
            counts[name] = 0;
        }
        sums[name] += array[index].value;
        counts[name]++;
    }

    for(name in sums) {
        results.push({ name: name, value: sums[name] / counts[name] });
    }
    return results;
}

See it in action

Alternatively, using a library like Underscore.js can simplify this process:

var averages = _.chain(array)
                .groupBy('name')
                .map(function(group, key) {
                    return { 
                        name: key, 
                        value: _.chain(group)
                                .pluck('value')
                                .reduce(function(x, y) { return x + y })
                                .value() / group.length
                    };
                })
                .value();

Check out the demo

Answer 3

Answer №2

let data = [
     {
       title: "apple",
       quantity: 1 
     },
     {
       title: "apple",
       quantity: 2 
     },
     {
       title: "apple",
       quantity: 3 
     },
     {
       title: "banana",
       quantity: 0 
     },
     {
       title: "banana",
       quantity: 1 
     }
 ];
let summary = {};
for(let i = 0; i < data.length; i++) {
    let element = data[i];
    if (!summary[element.title]) {
        summary[element.title] = {};
        summary[element.title]["total"] = 0;
        summary[element.title]["count"] = 0;
    }
    summary[element.title]["total"] += element.quantity;
    summary[element.title]["count"]++;
}
let finalResult = [];
for (let title in summary) {
    finalResult.push({title: title, quantity: summary[title]["total"] / summary[title]["count"]});
}
console.log(finalResult);

Answer 4

let data = [
     {
       title: "apple",
       quantity: 1 
     },
     {
       title: "apple",
       quantity: 2 
     },
     {
       title: "apple",
       quantity: 3 
     },
     {
       title: "banana",
       quantity: 0 
     },
     {
       title: "banana",
       quantity: 1 
     }
 ];
let summary = {};
for(let i = 0; i < data.length; i++) {
    let element = data[i];
    if (!summary[element.title]) {
        summary[element.title] = {};
        summary[element.title]["total"] = 0;
        summary[element.title]["count"] = 0;
    }
    summary[element.title]["total"] += element.quantity;
    summary[element.title]["count"]++;
}
let finalResult = [];
for (let title in summary) {
    finalResult.push({title: title, quantity: summary[title]["total"] / summary[title]["count"]});
}
console.log(finalResult);

Answer 5

Answer №3

Transforming your data can be easily accomplished using the Alasql library in just one line of code:

var modifiedArray = alasql('SELECT name, AVG([number]) AS [number] FROM ? GROUP BY name',
                       [data]);

I opted to enclose "number" in square brackets to avoid conflicts with SQL keywords.

Feel free to experiment with this live example on jsFiddle

Answer 6

Transforming your data can be easily accomplished using the Alasql library in just one line of code:

var modifiedArray = alasql('SELECT name, AVG([number]) AS [number] FROM ? GROUP BY name',
                       [data]);

I opted to enclose "number" in square brackets to avoid conflicts with SQL keywords.

Feel free to experiment with this live example on jsFiddle

Answer 7

Answer №4

Check out this ES2015 implementation that utilizes the reduce function:

const data = [
  { x: 1, y: 1 },
  { x: 2, y: 3 },
  { x: 6, y: 4 },
  { x: 2, y: 1 },
  { x: 8, y: 2 },
  { x: 0, y: 2 },
  { x: 4, y: 3 }
]

const result = data.reduce((prev, curr, index, arr) => {
    const keys = Object.keys(prev)
    let obj = {} 

    keys.map((key) => {
        obj[key] = prev[key] + curr[key]

        if (index + 1 === arr.length) {
            obj[key] = obj[key] / arr.length
        }
    })

    return obj
})

Answer 8

Check out this ES2015 implementation that utilizes the reduce function:

const data = [
  { x: 1, y: 1 },
  { x: 2, y: 3 },
  { x: 6, y: 4 },
  { x: 2, y: 1 },
  { x: 8, y: 2 },
  { x: 0, y: 2 },
  { x: 4, y: 3 }
]

const result = data.reduce((prev, curr, index, arr) => {
    const keys = Object.keys(prev)
    let obj = {} 

    keys.map((key) => {
        obj[key] = prev[key] + curr[key]

        if (index + 1 === arr.length) {
            obj[key] = obj[key] / arr.length
        }
    })

    return obj
})

Answer 9

Answer №5

One potential solution utilizing ECMA5 (which appears to be missing)

var sums = {},
    averages = Object.keys(array.reduce(function (previous, element) {
        if (previous.hasOwnProperty(element.name)) {
            previous[element.name].value += element.value;
            previous[element.name].count += 1;
        } else {
            previous[element.name] = {
                value: element.value,
                count: 1
            };
        }

        return previous;
    }, sums)).map(function (name) {
        return {
            name: name,
            average: this[name].value / this[name].count
        };
    }, sums);

Check out the code on jsFiddle

Answer 10

One potential solution utilizing ECMA5 (which appears to be missing)

var sums = {},
    averages = Object.keys(array.reduce(function (previous, element) {
        if (previous.hasOwnProperty(element.name)) {
            previous[element.name].value += element.value;
            previous[element.name].count += 1;
        } else {
            previous[element.name] = {
                value: element.value,
                count: 1
            };
        }

        return previous;
    }, sums)).map(function (name) {
        return {
            name: name,
            average: this[name].value / this[name].count
        };
    }, sums);

Check out the code on jsFiddle

Answer 11

Answer №6

In the month of October 2020, here is a concise solution using ES6+

const calculateAverageByCategory = (dataArr, categoryKey, valueKey) => {
  const calculateAvg = (accumulator, currentValue, index, array) => accumulator + currentValue[valueKey] / array.length;
  return Object.values(
    dataArr.reduce((acc, element, index, inputArray) => (
        (acc[element[categoryKey]] = acc[element[categoryKey]] || {
          [categoryKey]: element[categoryKey],
          [valueKey]: inputArray.filter((x) => x[categoryKey] === element[categoryKey]).reduce(calculateAvg, 0),
        }),acc),{})
  );
};

console.log(calculateAverageByCategory(dataArray, 'group', 'amount'))

Give it a try on your own :)

Answer 12

In the month of October 2020, here is a concise solution using ES6+

const calculateAverageByCategory = (dataArr, categoryKey, valueKey) => {
  const calculateAvg = (accumulator, currentValue, index, array) => accumulator + currentValue[valueKey] / array.length;
  return Object.values(
    dataArr.reduce((acc, element, index, inputArray) => (
        (acc[element[categoryKey]] = acc[element[categoryKey]] || {
          [categoryKey]: element[categoryKey],
          [valueKey]: inputArray.filter((x) => x[categoryKey] === element[categoryKey]).reduce(calculateAvg, 0),
        }),acc),{})
  );
};

console.log(calculateAverageByCategory(dataArray, 'group', 'amount'))

Give it a try on your own :)

Summarize the array of objects and find the average value for each distinct object name

Answer №1

Answer №2

Answer №3

Answer №4

Answer №5

Answer №6

Similar questions

Is it possible to store input from a multiline TextArea into an array using NetBeans?

Selenium Python option other than using send_keys()

What is the reason behind the perpetual hiding of the button?

Difficulty loading AJAX with autocomplete feature. Any suggestions?

What is the best way to display three unique maps simultaneously on separate views?

Creating Event Handlers for corresponding elements in HTML with the help of JQuery and JavaScript

Refreshing user session with the help of selenium's webdriver functionality

Animating Divs with jQuery to Expand their Size

Reopen a Kendo UI dialog

Struggling to get Axios working in Node despite having it properly installed

What is the best way to create a time delay between two consecutive desktop screenshot captures?

ngDraggable does not function properly when the dropzone is larger and includes a scrollbar on the body

Transforming numbers into arrays in JavaScript/TypeScript for Angular 7

Problem encountered with @HostListener

How can I use jQuery to switch the positions of two <div> elements in HTML based on the selection of a dropdown value?

Converting a Javascript string to 'Title Case' does not yield any results

The following middleware is not functioning properly on a local SSL server

Creating a reverse proxy using next.js

How can I incorporate popups in React using mapbox-gl?

Is it possible to customize the appearance of the selected item in a select box? Can the selected value be displayed differently from the other options?