Attempting to employ the .reduce method on an object

Question

Attempting to employ the .reduce method on an object

Currently, I am faced with the task of summing a nested value for all objects within an object. The structure of my object is as follows:

const json = [
{
    "other_sum": "1",
    "summary": {
        "calculations": {
            "time": 10,
            "unit": 25
        },
        "updated": "2020-06-05"
    }
},
{
    "other_sum": "1",
    "summary": {
        "calculations": {
            "time": 20,
            "unit": 5
        },
        "updated": "2020-06-05"
    }
},
{
    "other_sum": "1",
    "summary": {
        "calculations": {
            "time": 5,
            "unit": 15
        },
        "updated": "2020-06-05"
    }
},
];

The objective is to calculate the total sum of all "unit" values present.

I have attempted using .reduce for this purpose, however, encountered an error when adding a third item to the object.

Below is the snippet of code I am currently working on:

const r = json.reduce((a, b) => a.summary.calculations.unit + b.summary.calculations.unit);
console.log(r);

Confused about what might be going wrong in my approach. Any help or guidance would be greatly appreciated.

javascript

Answer 1

Answer №1

Notably, the functionality of reduce doesn't align with that approach. Referenced from an insightful article, it operates as follows:

Given
arrSum = function(arr){
  return arr.reduce(function(a,b){
    return a + b
  }, 0);
}
The callback function passed to the reduce method takes two parameters, a and b. In this context, a acts as our accumulator, gradually accumulating the sum. Whereas, b represents the current value under process.

It seems like an attempt is being made to access "summary" within the accumulator which is solely a number. A functional snippet for reference:

json = [
{
    "other_sum": "1",
    "summary": {
        "calculations": {
            "time": 10,
            "unit": 25
        },
        "updated": "2020-06-05"
    }
},
{
    "other_sum": "1",
    "summary": {
        "calculations": {
            "time": 20,
            "unit": 5
        },
        "updated": "2020-06-05"
    }
},
{
    "other_sum": "1",
    "summary": {
        "calculations": {
            "time": 5,
            "unit": 15
        },
        "updated": "2020-06-05"
    }
},
];

const r = json.reduce((a, b) => a + b.summary.calculations.unit, 0);
console.log(r);

Answer 2

Notably, the functionality of reduce doesn't align with that approach. Referenced from an insightful article, it operates as follows:

Given
arrSum = function(arr){
  return arr.reduce(function(a,b){
    return a + b
  }, 0);
}
The callback function passed to the reduce method takes two parameters, a and b. In this context, a acts as our accumulator, gradually accumulating the sum. Whereas, b represents the current value under process.

It seems like an attempt is being made to access "summary" within the accumulator which is solely a number. A functional snippet for reference:

json = [
{
    "other_sum": "1",
    "summary": {
        "calculations": {
            "time": 10,
            "unit": 25
        },
        "updated": "2020-06-05"
    }
},
{
    "other_sum": "1",
    "summary": {
        "calculations": {
            "time": 20,
            "unit": 5
        },
        "updated": "2020-06-05"
    }
},
{
    "other_sum": "1",
    "summary": {
        "calculations": {
            "time": 5,
            "unit": 15
        },
        "updated": "2020-06-05"
    }
},
];

const r = json.reduce((a, b) => a + b.summary.calculations.unit, 0);
console.log(r);

Answer 3

Answer №2

The initial argument given to the callback function used with .reduce serves as the accumulator, with the output of each iteration becoming the accumulator for the subsequent iteration.

As a result, the calculation applied to the next element will be

a.summary.calculations.unit + b.summary.calculations.unit

, and in the following loop, your callback will attempt to access the nested property a.summary.calculations.unit within that outcome, which may not be present.

You might consider modifying it to something like this:

const total = json.reduce((a, b) => a + b.summary.calculations.unit, 0);

Here, 0 signifies the starting value for your accumulator.

It's always beneficial to consult sources like Mozilla Developer Network (MDN).

Answer 4

The initial argument given to the callback function used with .reduce serves as the accumulator, with the output of each iteration becoming the accumulator for the subsequent iteration.

As a result, the calculation applied to the next element will be

a.summary.calculations.unit + b.summary.calculations.unit

, and in the following loop, your callback will attempt to access the nested property a.summary.calculations.unit within that outcome, which may not be present.

You might consider modifying it to something like this:

const total = json.reduce((a, b) => a + b.summary.calculations.unit, 0);

Here, 0 signifies the starting value for your accumulator.

It's always beneficial to consult sources like Mozilla Developer Network (MDN).

Answer 5

Answer №3

The initial value passed to the reduce function is not an object; instead, it is the previous value that gets returned. To fix this issue, consider updating your code as shown below:

 json.reduce((total, b) => total + b.summary.calculations.unit, 0);

Answer 6

The initial value passed to the reduce function is not an object; instead, it is the previous value that gets returned. To fix this issue, consider updating your code as shown below:

 json.reduce((total, b) => total + b.summary.calculations.unit, 0);

Answer 7

Answer №4

If you are looking for a solution, consider using the dig function I have created:

function dig(obj, func){
  let value;
  if(obj instanceof Array){
    for(let index=0,length=obj.length; index<length; index++){
      value = obj[index]; func(value, index, obj);
      if(typeof value === 'object')dig(value, func);
    }
  }
  else{
    for(let key in obj){
      value = obj[key]; func(value, key, obj);
      if(typeof value === 'object')dig(value, func);
    }
  }
}
const jsonData = [
  {
    "other_sum": "1",
    "summary": {
      "calculations": {
          "time": 10,
          "unit": 25
      },
      "updated": "2020-06-05"
    }
  },
  {
    "other_sum": "1",
    "summary": {
      "calculations": {
        "time": 20,
         "unit": 5
      },
      "updated": "2020-06-05"
    }
  },
  {
    "other_sum": "1",
    "summary": {
      "calculations": {
        "time": 5,
        "unit": 15
      },
      "updated": "2020-06-05"
    }
  }
];
let unitTotal = 0, timeTotal = 0;
dig(jsonData, (value, key)=>{
  if(key === 'unit'){
    unitTotal += value;
  }
  else if(key === 'time'){
    timeTotal += value;
  }
});
console.log('unitTotal: '+unitTotal);
console.log('timeTotal: '+timeTotal);

Answer 8

If you are looking for a solution, consider using the dig function I have created:

function dig(obj, func){
  let value;
  if(obj instanceof Array){
    for(let index=0,length=obj.length; index<length; index++){
      value = obj[index]; func(value, index, obj);
      if(typeof value === 'object')dig(value, func);
    }
  }
  else{
    for(let key in obj){
      value = obj[key]; func(value, key, obj);
      if(typeof value === 'object')dig(value, func);
    }
  }
}
const jsonData = [
  {
    "other_sum": "1",
    "summary": {
      "calculations": {
          "time": 10,
          "unit": 25
      },
      "updated": "2020-06-05"
    }
  },
  {
    "other_sum": "1",
    "summary": {
      "calculations": {
        "time": 20,
         "unit": 5
      },
      "updated": "2020-06-05"
    }
  },
  {
    "other_sum": "1",
    "summary": {
      "calculations": {
        "time": 5,
        "unit": 15
      },
      "updated": "2020-06-05"
    }
  }
];
let unitTotal = 0, timeTotal = 0;
dig(jsonData, (value, key)=>{
  if(key === 'unit'){
    unitTotal += value;
  }
  else if(key === 'time'){
    timeTotal += value;
  }
});
console.log('unitTotal: '+unitTotal);
console.log('timeTotal: '+timeTotal);

Attempting to employ the .reduce method on an object

Answer №1

Answer №2

Answer №3

Answer №4

Similar questions

Updating a nested object within an array in a ReactJs component

Is it possible to utilize a computed property for dynamically styling a table row based on certain conditions?

Is there a way to efficiently navigate a local JSON file using React JS?

What steps should I follow to change the appearance of this object to match this?

Issue with AngularJS: Not able to get second app in template to function properly

"Troubleshooting: Issue with AngularJS ng-repeat not functioning properly when using an

Determining the Percentage of a Bar Chart

What is the best way to pass a state within a route component in react-router?

Can you explain the concept of F-Bounded Polymorphism in TypeScript?

React application no longer displaying content following the upgrade to React 18 version

I am experiencing difficulty with the color of my progress bar in Firefox

Oops! The system encountered a problem while trying to identify the value `Han` for the property `Script

Exploring the Battle of Efficiency: Stateless Components vs. Class Components in the Age of React Hooks - Determining the Superior Approach

Pins missing from Google Maps API display

Sequelize Error: The WHERE parameter for 'email' is throwing an error due to an invalid value of 'undefined'

The concept of inheriting directives/scopes

What could be causing BeautifulSoup to overlook certain elements on the page?

Vue.js Conditional Templates

Transferring data from a JavaScript variable to PHP using AJAX

What could be causing my Material UI Divider to appear invisible within a Material UI Container or Paper component?