Add values in a two-dimensional array with JavaScript

Question

I want to merge and add the following 2D array:

var arr = [
    ["TWENTY", 20],
    ["TWENTY", 20],
    ["TWENTY", 20],
    ["TWENTY", 20],
    ["TEN", 10],
    ["FIVE", 5],
    ["ONE", 1],
    ["QUARTER", 0.25],
    ["QUARTER", 0.25],
    ["DIME", 0.1],
    ["DIME", 0.1],
    ["PENNY", 0.01],
    ["PENNY", 0.01],
    ["PENNY", 0.01],
    ["PENNY", 0.01]
    ];

Resulting in a 2D array that looks like this:

 arr = [
     ["TWENTY", 80],
     ["TEN", 10],
     ["FIVE", 5],
     ["QUARTER", 0.50],
     ["DIME", 0.20],
     ["PENNY", 0.04]
     ];

Basically I'm adding up the number values and condensing the string values. I tried map, reduce, and for loops but this one has me stumped.

Write a for loop that iterates array1, then inside the for loop, use a switch and then increment designated array2 entry with the corresponding value from array1. — Zze
– Zze, Commented Aug 30, 2015 at 0:27

Etheryte · Accepted Answer · 2015-08-30 00:53:51Z

2

All you really need is a reduce and a map, which could probably add up to a good MapReduce joke.

var arr = [
    ["TWENTY", 20],
    ["TWENTY", 20],
    ["TWENTY", 20],
    ["TWENTY", 20],
    ["TEN", 10],
    ["FIVE", 5],
    ["ONE", 1],
    ["QUARTER", 0.25],
    ["QUARTER", 0.25],
    ["DIME", 0.1],
    ["DIME", 0.1],
    ["PENNY", 0.01],
    ["PENNY", 0.01],
    ["PENNY", 0.01],
    ["PENNY", 0.01]
];
var obj = arr.reduce(function (out, el) {
    out[el[0]] = (out[el[0]] || 0) + el[1];
    return out;
}, {});
var out = Object.keys(obj).map(function (key) {
    return [key, obj[key]]
}); //[["TWENTY",80],["TEN",10],["FIVE",5],["ONE",1],["QUARTER",0.5],["DIME",0.2],["PENNY",0.04]]

edited Aug 30, 2015 at 0:53

answered Aug 30, 2015 at 0:41

Etheryte

25.4k12 gold badges77 silver badges121 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Etheryte Over a year ago

@MichaelLaszlo Thanks for the catch, probably didn't notice it since the code still works for integers. However it breaks for floats. Fixed.

Michael Laszlo Over a year ago

By the way, | doesn't add integers either.

Etheryte Over a year ago

@MichaelLaszlo Yes it does, you can confirm it in your console. The reason why the typo works to begin with is that you can use the binary operation |0 to cast things into integers in Javascript, much like how you can ensure something is a number by using ||0.

Michael Laszlo Over a year ago

I don't see what you mean. (2 | 2) == 2. 2 + 2 == 4.

Etheryte Over a year ago

Oh I see where your confusion stems from. In the above code, that's not what it's meant to do. The plus sign is used to add the results together. Doing foo || 0 ensures that the result is a number, whether foo is undefined before or not. That allows us to avoid undefined + 2 === NaN and instead we have (undefined || 0) + 2 === 2. The same holds for (undefined | 0) + 2 === 2 given foo is undefined, but only for integers because (2.5 | 0) === 2.

Michael Laszlo · Accepted Answer · 2015-08-30 01:01:08Z

You have an array with key, value tuples. You can iterate over these tuples, store each new key in an object, and increment the value as you come upon subsequent tuples the same key. If you keep an array of keys in the order in which you encountered them, you can map the array of keys to a result array.

But it would be foolish to go to all this trouble when you could use the purely functional approach shown in Nit's answer.

Below is the ugly approach. Don't do this. Do what Nit says.

function addArray(tuples) {
  var hash = {},
      keys = [];
  tuples.forEach(function (tuple) { // Iterate over [key, value] tuples.
    var key = tuple[0],
        value = tuple[1];
    if (hash[key] === undefined) {  // Is it a new key?
      keys.push(key);               // Then add it to keys.
      hash[key] = value;            // And set the initial value.
    } else {
      hash[key] += value;           // Otherwise, increment the value.
    }
  });
  return keys.map(function (key) {  // Map the keys to tuples.
    return([key, hash[key]]);
  });
};

var arr = [
    ["TWENTY", 20],
    ["TWENTY", 20],
    ["TWENTY", 20],
    ["TWENTY", 20],
    ["TEN", 10],
    ["FIVE", 5],
    ["ONE", 1],
    ["QUARTER", 0.25],
    ["QUARTER", 0.25],
    ["DIME", 0.1],
    ["DIME", 0.1],
    ["PENNY", 0.01],
    ["PENNY", 0.01],
    ["PENNY", 0.01],
    ["PENNY", 0.01]
];

var added = addArray(arr);

added.forEach(function (tuple) {
  document.write(JSON.stringify(tuple) + '<br />');
});

Collectives™ on Stack Overflow

Add values in a two-dimensional array with JavaScript

2 Answers 2

5 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related