Geek Answers Handbook

Map and reduce JSON objects using JavaScript

Consider this JSON object below:

{ "cells":[ { "count":"1", "gdp_growth__avg":1.90575802503285, "geo__name":"united states of america", "time":1990 }, { "count":"1", "gdp_growth__avg":9.17893670154459, "geo__name":"china", "time":1991 }, { "count":"1", "gdp_growth__avg":-5.04693945214571, "geo__name":"russia", "time":1991 }, { "count":"1", "gdp_growth__avg":-0.0622142217811472, "geo__name":"botswana", "time":1991 }, { "count":"1", "gdp_growth__avg":14.2407063986337, "geo__name":"china", "time":1992 }, { "count":"1", "gdp_growth__avg":-14.5310737731921, "geo__name":"russia", "time":1992 }, { "count":"1", "gdp_growth__avg":3.55494453739944, "geo__name":"united states of america", "time":1992 }, { "count":"1", "gdp_growth__avg":13.9643147001603, "geo__name":"china", "time":1993 }, { "count":"1", "gdp_growth__avg":-8.66854034194856, "geo__name":"botswana", "time":1993 }, { "count":"1", "gdp_growth__avg":2.74204850437989, "geo__name":"united states of america", "time":1993 }, { "count":"1", "gdp_growth__avg":4.04272516401846, "geo__name":"united states of america", "time":1994 }, { "count":"1", "gdp_growth__avg":13.0806818010789, "geo__name":"china", "time":1994 }, { "count":"1", "gdp_growth__avg":-12.5697559787493, "geo__name":"russia", "time":1994 }, { "count":"1", "gdp_growth__avg":10.9249803004994, "geo__name":"china", "time":1995 }, { "count":"1", "gdp_growth__avg":-4.14352840666389, "geo__name":"russia", "time":1995 }, { "count":"1", "gdp_growth__avg":2.71655384149574, "geo__name":"united states of america", "time":1995 }, { "count":"1", "gdp_growth__avg":10.0085233990531, "geo__name":"china", "time":1996 }, { "count":"1", "gdp_growth__avg":3.79848988541973, "geo__name":"united states of america", "time":1996 } ] }

I would like to Map and Reduce and create a new object containing a summation of GDP growth for all countries of the above JSON, which may look something like this:

 { { "gdp_growth__avg":46.23, "geo__name":"united states of america", }, { "gdp_growth__avg":16.23, "geo__name":"china", }, { "gdp_growth__avg":36.23, "geo__name":"russia", }, { "gdp_growth__avg":26.23, "geo__name":"botswana", "time":1991 } }

I looked at map and reduce and am not sure what is the best way to proceed.

I thought something like this could move in the right direction, but it doesn't seem to do what I expected:

  var arr = [{x:1},{x:2},{x:4}]; arr.reduce(function (a, b) { return {x: ax + bx}; }); console.log(arr); //Outputs that same initial array

Although I understand that it is probably better and easier to do this on the server side, I wonder if what I'm trying to do can be done on the client side using JavaScript. Any suggestions? Thank you in advance.

+7
source share
3 answers

Try the following:

 var data = { cells:[...] }; var r = data.cells.reduce(function(pv, cv) { if ( pv[cv.geo__name] ) { pv[cv.geo__name] += cv.gdp_growth__avg; } else { pv[cv.geo__name] = cv.gdp_growth__avg; } return pv; }, {}); console.log(r);

Output Example:

  { 'united states of america': 18.76051995774611, 'china': 71.39814330096999, 'russia': -36.291297610751, 'botswana': -8.730754563729707 }
+3
source

The Array.reduce method Array.reduce not modify the array object; it returns the results in a new array.

+3
source

You can try something like this:

 var data = {"cells": [...]}; data.cells.map(function(datum) { return { geo__name: datum.geo__name, gdp_growth__avg: data.cells.filter(function(o) { return o.geo__name === datum.geo__name; }).reduce(function(sum, o) { return sum + o.gdp_growth__avg; }, 0) }; })

Needless to say, you can also retrieve other properties from datum , such as time . I didn’t do it.

0
source

More articles:


All Articles