Question

Using jQuery – I would like to compare 2 JSON arrays:

origArray comes from the database/C# API:

var origArray = [   {
        "TypeName": "Single",
        "TypeID": "3121",
        "TypeCount": "2"
        },
    {
        "TypeName": "Double",
        "TypeID": "4056",
        "TypeCount": "2"
        },
    {
        "TypeName": "Family",
        "TypeID": "5654",
        "TypeCount": "4"
        }
];

userArray is gathered from user input:

var userArray = [   {
        "TypeID": "3121",
        "TypeCount": "2"
        },
    {
        "TypeID": "4056",
        "TypeCount": "3"
        },
    {
        "TypeID": "3121",
        "TypeCount": "3"
        }
];

What I would like to do, is loop through the userArray, and “group” by the TypeID, and Sum the TypeCount.

So in the example above:

TypeID: 3121
TypeCount: 5 (ie. 2 + 3)

TypeID: 4056
TypeCount: 3

Meaning there would be a difference of 3 over for TypeID 3121 and 1 over for 4056.

Is there any way of getting that information out of either jQuery or native Javascript (that would work cross-browser)?

Thanks for any help,

Mark

Answer 1

Define a function to group by each array by TypeID and sum TypeCount:

function groupByTypeID (arr) {
    var groupBy = {};
    $.each(arr, function () { 
      var currentCount = groupBy[this.TypeID] || 0; 
      groupBy[this.TypeID] = currentCount + parseInt(this.TypeCount);
    });
    return groupBy;
}

Then, group both arrays, and take their differences:

var userArrayGroups = groupByTypeID(userArray);
var origArrayGroups = groupByTypeID(origArray);

var diff = {};
for (var prop in userArrayGroups) {
  diff[prop] = userArrayGroups[prop] - origArrayGroups[prop];
}

diff will then hold the following:

{
  3121: 3
  4056: 1
}

DEMO.