Related
Grouping elements in array by multiple properties is the closest match to my question as it indeed groups objects by multiple keys in an array. Problem is this solution doesn't sum up the properties value then remove the duplicates, it instead nests all the duplicates in a two-dimensional arrays.
Expected behavior
I have an array of objects which must be grouped by shape and color.
var arr = [
{shape: 'square', color: 'red', used: 1, instances: 1},
{shape: 'square', color: 'red', used: 2, instances: 1},
{shape: 'circle', color: 'blue', used: 0, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 4},
{shape: 'circle', color: 'red', used: 1, instances: 1},
{shape: 'circle', color: 'red', used: 1, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 5},
{shape: 'square', color: 'red', used: 2, instances: 1}
];
Objects in this array are considered duplicates only if both their shape and color are the same. If they are, I want to respectively sum up their used and instances values then delete the duplicates.
So in this example result array may only contain four combinations : square red, square blue, circle red, circle blue
Problem
I tried a simpler approach here:
var arr = [
{shape: 'square', color: 'red', used: 1, instances: 1},
{shape: 'square', color: 'red', used: 2, instances: 1},
{shape: 'circle', color: 'blue', used: 0, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 4},
{shape: 'circle', color: 'red', used: 1, instances: 1},
{shape: 'circle', color: 'red', used: 1, instances: 0},
{shape: 'square', color: 'red', used: 4, instances: 4},
{shape: 'square', color: 'red', used: 2, instances: 2}
];
result = [];
arr.forEach(function (a) {
if ( !this[a.color] && !this[a.shape] ) {
this[a.color] = { color: a.color, shape: a.shape, used: 0, instances: 0 };
result.push(this[a.color]);
}
this[a.color].used += a.used;
this[a.color].instances += a.instances;
}, Object.create(null));
console.log(result);
but it outputs
[{shape: "square", color: "red", used: 11, instances: 9},
{shape: "circle", color: "blue", used: 4, instances: 4}]
instead of expected result:
[{shape: "square", color: "red", used: 5, instances: 3},
{shape: "circle", color: "red", used: 2, instances: 1},
{shape: "square", color: "blue", used: 11, instances: 9},
{shape: "circle", color: "blue", used: 0, instances: 0}]
How can I get my function to properly group the objects by shape and color ? i.e. sum up their values and remove the duplicates ?
Use Array#reduce with a helper object to group similar objects. For each object, check if the combined shape and color exists in the helper. If it doesn't, add to the helper using Object#assign to create a copy of the object, and push to the array. If it does, add it's values to used and instances.
var arr = [{"shape":"square","color":"red","used":1,"instances":1},{"shape":"square","color":"red","used":2,"instances":1},{"shape":"circle","color":"blue","used":0,"instances":0},{"shape":"square","color":"blue","used":4,"instances":4},{"shape":"circle","color":"red","used":1,"instances":1},{"shape":"circle","color":"red","used":1,"instances":0},{"shape":"square","color":"blue","used":4,"instances":5},{"shape":"square","color":"red","used":2,"instances":1}];
var helper = {};
var result = arr.reduce(function(r, o) {
var key = o.shape + '-' + o.color;
if(!helper[key]) {
helper[key] = Object.assign({}, o); // create a copy of o
r.push(helper[key]);
} else {
helper[key].used += o.used;
helper[key].instances += o.instances;
}
return r;
}, []);
console.log(result);
If you can use ES6, you use a Map to collect the values, and then convert it back to an array by spreading the Map#values:
const arr = [{"shape":"square","color":"red","used":1,"instances":1},{"shape":"square","color":"red","used":2,"instances":1},{"shape":"circle","color":"blue","used":0,"instances":0},{"shape":"square","color":"blue","used":4,"instances":4},{"shape":"circle","color":"red","used":1,"instances":1},{"shape":"circle","color":"red","used":1,"instances":0},{"shape":"square","color":"blue","used":4,"instances":5},{"shape":"square","color":"red","used":2,"instances":1}];
const result = [...arr.reduce((r, o) => {
const key = o.shape + '-' + o.color;
const item = r.get(key) || Object.assign({}, o, {
used: 0,
instances: 0
});
item.used += o.used;
item.instances += o.instances;
return r.set(key, item);
}, new Map).values()];
console.log(result);
Use this method to specify multiple properties:
public static groupBy(array, f) {
let groups = {};
array.forEach(function (o) {
var group = JSON.stringify(f(o));
groups[group] = groups[group] || [];
groups[group].push(o);
});
return Object.keys(groups).map(function (group) {
return groups[group];
})
}
Call this method like:
var result = Utils.groupBy(arr, function (item) {
return [item.shape, item.color];
});
You can use reduce() to create one object of unique shape|color properties and Object.values() to return array of those values.
var arr =[{"shape":"square","color":"red","used":1,"instances":1},{"shape":"square","color":"red","used":2,"instances":1},{"shape":"circle","color":"blue","used":0,"instances":0},{"shape":"square","color":"blue","used":4,"instances":4},{"shape":"circle","color":"red","used":1,"instances":1},{"shape":"circle","color":"red","used":1,"instances":0},{"shape":"square","color":"blue","used":4,"instances":5},{"shape":"square","color":"red","used":2,"instances":1}]
var result = Object.values(arr.reduce(function(r, e) {
var key = e.shape + '|' + e.color;
if (!r[key]) r[key] = e;
else {
r[key].used += e.used;
r[key].instances += e.instances
}
return r;
}, {}))
console.log(result)
You could use a hash table and the keys for grouping same groups.
var array = [{ shape: 'square', color: 'red', used: 1, instances: 1 }, { shape: 'square', color: 'red', used: 2, instances: 1 }, { shape: 'circle', color: 'blue', used: 0, instances: 0 }, { shape: 'square', color: 'blue', used: 4, instances: 4 }, { shape: 'circle', color: 'red', used: 1, instances: 1 }, { shape: 'circle', color: 'red', used: 1, instances: 0 }, { shape: 'square', color: 'blue', used: 4, instances: 5 }, { shape: 'square', color: 'red', used: 2, instances: 1 }],
hash = Object.create(null),
grouped = [];
array.forEach(function (o) {
var key = ['shape', 'color'].map(function (k) { return o[k]; }).join('|');
if (!hash[key]) {
hash[key] = { shape: o.shape, color: o.color, used: 0, instances: 0 };
grouped.push(hash[key]);
}
['used', 'instances'].forEach(function (k) { hash[key][k] += o[k]; });
});
console.log(grouped);
.as-console-wrapper { max-height: 100% !important; top: 0; }
ES6 answers as requisted by user:
// To call this function:
// const result = this.toolBox.multipleGroupByArray(
// dataArray, (property: IProperty) => [property.prop1, property.prop2, property.prop3]);
multipleGroupByArray(dataArray, groupPropertyArray) {
const groups = {};
dataArray.forEach(item => {
const group = JSON.stringify(groupPropertyArray(item));
groups[group] = groups[group] || [];
groups[group].push(item);
});
return Object.keys(groups).map(function(group) {
return groups[group];
});
}
Here is a more general grouping and summing function that accepts an array of objects, an array of keys to group by, and an array of keys to sum.
function groupAndSum(arr, groupKeys, sumKeys){
return Object.values(
arr.reduce((acc,curr)=>{
const group = groupKeys.map(k => curr[k]).join('-');
acc[group] = acc[group] || Object.fromEntries(
groupKeys.map(k => [k, curr[k]]).concat(sumKeys.map(k => [k, 0])));
sumKeys.forEach(k => acc[group][k] += curr[k]);
return acc;
}, {})
);
}
Demo:
var arr = [
{shape: 'square', color: 'red', used: 1, instances: 1},
{shape: 'square', color: 'red', used: 2, instances: 1},
{shape: 'circle', color: 'blue', used: 0, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 4},
{shape: 'circle', color: 'red', used: 1, instances: 1},
{shape: 'circle', color: 'red', used: 1, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 5},
{shape: 'square', color: 'red', used: 2, instances: 1}
];
function groupAndSum(arr, groupKeys, sumKeys){
return Object.values(
arr.reduce((acc,curr)=>{
const group = groupKeys.map(k => curr[k]).join('-');
acc[group] = acc[group] || Object.fromEntries(groupKeys.map(k => [k, curr[k]]).concat(sumKeys.map(k => [k, 0])));
sumKeys.forEach(k => acc[group][k] += curr[k]);
return acc;
}, {})
);
}
const res = groupAndSum(arr, ['shape', 'color'], ['used', 'instances']);
console.log(res);
If you want groupBy keys as per conditional fields then here is the modification for #Abbes answer:
function groupBy(array, f) {
let groups = {};
array.forEach((o) => {
var group = f(o).join('-');
groups[group] = groups[group] || [];
groups[group].push(o);
});
return groups;
}
And use it like:
groupBy(connectedServers, (item) => {
return [item.key1, item.key2];
});
In case if you need an array of 'used' and 'instances' based on the colour or shape property; then you can use this code .
(PS : I know this is not what you are looking for but in future it may help someone. Also am reusing Nenand's code for this purpose . If the code is useful to you just thank him )
var array = [{ shape: 'square', color: 'red', used: 1, instances: 1 }, { shape: 'square', color: 'red', used: 2, instances: 1 }, { shape: 'circle', color: 'blue', used: 0, instances: 0 }, { shape: 'square', color: 'blue', used: 4, instances: 4 }, { shape: 'circle', color: 'red', used: 1, instances: 1 }, { shape: 'circle', color: 'red', used: 1, instances: 0 }, { shape: 'square', color: 'blue', used: 4, instances: 5 }, { shape: 'square', color: 'red', used: 2, instances: 1 }],
hash = Object.create(null),
grouped = [];
array.forEach(function (o) {
var key = ['shape', 'color'].map(function (k) { return o[k]; }).join('|');
if (!hash[key]) {
hash[key] = { shape: o.shape, color: o.color, YourArrayName : [] };
grouped.push(hash[key]);
}
['used'].forEach(function (k) { hash[key]['YourArrayName'].push({ used : o['used'], instances : o['instances'] }) });
});
console.log(grouped);
The output will be in like
I have a suggestion for you.
If you want to make it easier to do, you try the Underscore library : http://underscorejs.org/
I tried quickly to use it and got the right result :
var arr = [
{shape: 'square', color: 'red', used: 1, instances: 1},
{shape: 'square', color: 'red', used: 2, instances: 1},
{shape: 'circle', color: 'blue', used: 0, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 4},
{shape: 'circle', color: 'red', used: 1, instances: 1},
{shape: 'circle', color: 'red', used: 1, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 5},
{shape: 'square', color: 'red', used: 2, instances: 1}
];
var byshape = _.groupBy(arr, 'shape');
var bycolor = _.map(byshape, function(array) {
return _.groupBy(array, 'color')
});
var output = [];
_.each(bycolor, function(arrayOfShape) {
_.each(arrayOfShape, function(arrayOfColor) {
var computedItem = {shape: "", color: "", used: 0, instances: 0};
_.each(arrayOfColor, function(item) {
computedItem.shape = item.shape;
computedItem.color = item.color;
computedItem.used += item.used;
computedItem.instances += item.instances;
});
output.push(computedItem);
});
});
console.log(output);
http://jsfiddle.net/oLyzdoo7/
This solution groups first data, then you can do what you want after, for example, compute data as ypur wish.
Maybe you can optimize it, let me know if you need more help
/**
* Groups an array of objects with multiple properties.
*
* #param {Array} array: the array of objects to group
* #param {Array} props: the properties to groupby
* #return {Array} an array of arrays with the grouped results
*/
const groupBy = ({ Group: array, By: props }) => {
getGroupedItems = (item) => {
returnArray = [];
let i;
for (i = 0; i < props.length; i++) {
returnArray.push(item[props[i]]);
}
return returnArray;
};
let groups = {};
let i;
for (i = 0; i < array.length; i++) {
const arrayRecord = array[i];
const group = JSON.stringify(getGroupedItems(arrayRecord));
groups[group] = groups[group] || [];
groups[group].push(arrayRecord);
}
return Object.keys(groups).map((group) => {
return groups[group];
});
};
Example:
Assume that we have an array of objects. Each object contains info about a person and the money that possess. We want to sum up the money for all persons with the same Nationality and with the same gender.
const data = [
{Name: 'George', Surname: 'Best', Country: 'Great Britain', Gender: 'Male', Money:8000},
{Name: 'Orion', Surname: 'Papathanasiou', Country: 'Greece', Gender: 'Male', Money: 2000},
{Name: 'Mairy', Surname: 'Wellbeck', Country: 'Great Britain', Gender: 'Female', Money:5000},
{Name: 'Thanasis', Surname: 'Papathanasiou', Country: 'Greece',Gender: 'Male', Money: 3200},
{Name: 'George', Surname: 'Washington', Country: 'Great Britain', Gender: 'Male',Money:4200},
{Name: 'Orfeas', Surname: 'Kalaitzis', Country: 'Greece', Gender: 'Male', Money: 7643},
{Name: 'Nick', Surname: 'Wellington', Country: 'USA', Gender: 'Male', Money:1000},
{Name: 'Kostas', Surname: 'Antoniou', Country: 'Greece', Gender: 'Male', Money: 8712},
{Name: 'John', Surname: 'Oneal', Country: 'USA', Gender: 'Male', Money:98234},
{Name: 'Paulos', Surname: 'Stamou', Country: 'Greece', Gender: 'Male', Money: 3422},
{Name: 'Soula', Surname: 'Spuropoulou', Country: 'Greece', Gender: 'Female', Money:400},
{Name: 'Paul', Surname: 'Pierce', Country: 'USA', Gender: 'Male',Money: 13000},
{Name: 'Helen', Surname: 'Smith', Country: 'Great Britain', Gender: 'Female', Money:1000},
{Name: 'Cathrine', Surname: 'Bryant', Country: 'Great Britain', Gender: 'Female', Money: 8712},
{Name: 'Jenny', Surname: 'Scalabrini', Country: 'USA', Gender: 'Female', Money:92214}];
const groupByProperties = ['Country', 'Gender'];
Calling the function:
const groupResult = groupBy( {Group: data, By: groupByProperties} );
The group result is:
(6) [Array(2), Array(5), Array(3), Array(3), Array(1), Array(1)]
0: Array(2)
0: {Name: "George", Surname: "Best", Country: "Great Britain", Gender: "Male", Money: 8000}
1: {Name: "George", Surname: "Washington", Country: "Great Britain", Gender: "Male", Money: 4200}
length: 2
__proto__: Array(0)
1: Array(5)
0: {Name: "Orion", Surname: "Papathanasiou", Country: "Greece", Gender: "Male", Money: 2000}
1: {Name: "Thanasis", Surname: "Papathanasiou", Country: "Greece", Gender: "Male", Money: 3200}
2: {Name: "Orfeas", Surname: "Kalaitzis", Country: "Greece", Gender: "Male", Money: 7643}
3: {Name: "Kostas", Surname: "Antoniou", Country: "Greece", Gender: "Male", Money: 8712}
4: {Name: "Paulos", Surname: "Stamou", Country: "Greece", Gender: "Male", Money: 3422}
length: 5
__proto__: Array(0)
2: Array(3)
0: {Name: "Mairy", Surname: "Wellbeck", Country: "Great Britain", Gender: "Female", Money: 5000}
1: {Name: "Helen", Surname: "Smith", Country: "Great Britain", Gender: "Female", Money: 1000}
2: {Name: "Cathrine", Surname: "Bryant", Country: "Great Britain", Gender: "Female", Money: 8712}
length: 3
__proto__: Array(0)
3: Array(3)
0: {Name: "Nick", Surname: "Wellington", Country: "USA", Gender: "Male", Money: 1000}
1: {Name: "John", Surname: "Oneal", Country: "USA", Gender: "Male", Money: 98234}
2: {Name: "Paul", Surname: "Pierce", Country: "USA", Gender: "Male", Money: 13000}
length: 3
__proto__: Array(0)
4: Array(1)
0: {Name: "Soula", Surname: "Spuropoulou", Country: "Greece", Gender: "Female", Money: 400}
length: 1
__proto__: Array(0)
5: Array(1)
0: {Name: "Jenny", Surname: "Scalabrini", Country: "USA", Gender: "Female", Money: 92214}
length: 1
__proto__: Array(0)
length: 6
__proto__: Array(0)
So, we got 6 arrays. Each array is grouped by Country and by Gender
Iterating over each array, we can sum up the money!
const groupBy = ({ Group: array, By: props }) => {
getGroupedItems = (item) => {
returnArray = [];
let i;
for (i = 0; i < props.length; i++) {
returnArray.push(item[props[i]]);
}
return returnArray;
};
let groups = {};
let i;
for (i = 0; i < array.length; i++) {
const arrayRecord = array[i];
const group = JSON.stringify(getGroupedItems(arrayRecord));
groups[group] = groups[group] || [];
groups[group].push(arrayRecord);
}
return Object.keys(groups).map((group) => {
return groups[group];
});
};
const data = [
{Name: 'George', Surname: 'Best', Country: 'Great Britain', Gender: 'Male', Money:8000},
{Name: 'Orion', Surname: 'Papathanasiou', Country: 'Greece', Gender: 'Male', Money: 2000},
{Name: 'Mairy', Surname: 'Wellbeck', Country: 'Great Britain', Gender: 'Female', Money:5000},
{Name: 'Thanasis', Surname: 'Papathanasiou', Country: 'Greece',Gender: 'Male', Money: 3200},
{Name: 'George', Surname: 'Washington', Country: 'Great Britain', Gender: 'Male',Money:4200},
{Name: 'Orfeas', Surname: 'Kalaitzis', Country: 'Greece', Gender: 'Male', Money: 7643},
{Name: 'Nick', Surname: 'Wellington', Country: 'USA', Gender: 'Male', Money:1000},
{Name: 'Kostas', Surname: 'Antoniou', Country: 'Greece', Gender: 'Male', Money: 8712},
{Name: 'John', Surname: 'Oneal', Country: 'USA', Gender: 'Male', Money:98234},
{Name: 'Paulos', Surname: 'Stamou', Country: 'Greece', Gender: 'Male', Money: 3422},
{Name: 'Soula', Surname: 'Spuropoulou', Country: 'Greece', Gender: 'Female', Money:400},
{Name: 'Paul', Surname: 'Pierce', Country: 'USA', Gender: 'Male',Money: 13000},
{Name: 'Helen', Surname: 'Smith', Country: 'Great Britain', Gender: 'Female', Money:1000},
{Name: 'Cathrine', Surname: 'Bryant', Country: 'Great Britain', Gender: 'Female', Money: 8712},
{Name: 'Jenny', Surname: 'Scalabrini', Country: 'USA', Gender: 'Female', Money:92214}];
const groupByProperties = ['Country', 'Gender'];
const groupResult = groupBy( {Group: data, By: groupByProperties} );
console.log(groupResult);
I found some of these answers a little hard to reuse so here is a reusable function that you can pass in what keys you want your grouping to use.
var arr = [
{shape: 'square', color: 'red', used: 1, instances: 1},
{shape: 'square', color: 'red', used: 2, instances: 1},
{shape: 'circle', color: 'blue', used: 0, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 4},
{shape: 'circle', color: 'red', used: 1, instances: 1},
{shape: 'circle', color: 'red', used: 1, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 5},
{shape: 'square', color: 'red', used: 2, instances: 1}
];
const groupByMultipleKeys = (items, keys) =>
items.reduce((acc, item) => {
const isExistingItem = acc
.flatMap(accItem => accItem)
.find(accItem =>
keys.every(key => accItem[key] === item[key])
)
if (isExistingItem) {
return acc;
}
const allRelatedItems = items.filter(ungroupedItem =>
keys.every(key => ungroupedItem[key] === item[key])
)
acc.push(allRelatedItems)
return acc
}, [])
const groupedItem = groupByMultipleKeys(arr, ['shape', 'color'])
console.log('groupedItem', groupedItem)
List item
var arr = [
{shape: 'square', color: 'red', used: 1, instances: 1},
{shape: 'square', color: 'red', used: 2, instances: 1},
{shape: 'circle', color: 'blue', used: 0, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 4},
{shape: 'circle', color: 'red', used: 1, instances: 1},
{shape: 'circle', color: 'red', used: 1, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 5},
{shape: 'square', color: 'red', used: 2, instances: 1}
];
result = [];
arr.forEach(function (a) {
if ( !this[a.color] && !this[a.shape] ) {
this[a.color] = { color: a.color, shape: a.shape, used: 0, instances: 0 };
result.push(this[a.color]);
}
this[a.color].used += a.used;
this[a.color].instances += a.instances;
}, Object.create(null));
console.log(result);
**Output:**
[
{
"color": "red",
"shape": "square",
"used": 11,
"instances": 9
},
{
"color": "blue",
"shape": "circle",
"used": 4,
"instances": 4
}
]
thats all perfetcly working.
Enjoy your coding....
1.sumkeys
3.groupkeys
var arr = [
{shape: 'square', color: 'red', used: 1, instances: 1},
{shape: 'square', color: 'red', used: 2, instances: 1},
{shape: 'circle', color: 'blue', used: 0, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 4},
{shape: 'circle', color: 'red', used: 1, instances: 1},
{shape: 'circle', color: 'red', used: 1, instances: 0},
{shape: 'square', color: 'red', used: 4, instances: 4},
{shape: 'square', color: 'red', used: 2, instances: 2}
];
function groupbykeys(arr, groupKeys, sumKeys){
var hash = Object.create(null),
grouped = [];
arr.forEach(function (o) {
var key = groupKeys.map(function (k) { return o[k]; }).join('|');
if (!hash[key]) {
hash[key] = Object.keys(o).reduce((result, key)=> {
result[key]=o[key];
if(sumKeys.includes(key))
result[key]=0;
return result;
}, { }); //map_(o) //{ shape: o.shape, color: o.color, used: 0, instances: 0 };
grouped.push(hash[key]);
}
sumKeys.forEach(function (k) { hash[key][k] += o[k]; });
});
return grouped;
}
var result=groupbykeys(arr,['shape','color'],['used','instances']);
console.log(result)
Aggregate into an object keyed by the unique combination of shape and color with reduce then take the values out of it:
const aggregate = xs => Object.values(
xs.reduce((acc, {shape, color, used, instances}) => {
const key = shape + color;
acc[key] ??= {shape, color, used: 0, instances: 0};
acc[key].used += used;
acc[key].instances += instances;
return acc;
}, {})
);
console.log(aggregate(arr));
<script>
const arr =
[ {shape: 'square', color: 'red', used: 1, instances: 1}
, {shape: 'square', color: 'red', used: 2, instances: 1}
, {shape: 'circle', color: 'blue', used: 0, instances: 0}
, {shape: 'square', color: 'blue', used: 4, instances: 4}
, {shape: 'circle', color: 'red', used: 1, instances: 1}
, {shape: 'circle', color: 'red', used: 1, instances: 0}
, {shape: 'square', color: 'blue', used: 4, instances: 5}
, {shape: 'square', color: 'red', used: 2, instances: 1}];
</script>
Much more compact ES6 version, which uses JSON.stringify to ensure proper separation between the properties that are being grouped by.
const arr = [{shape: 'square', color: 'red', used: 1, instances: 1}, {shape: 'square', color: 'red', used: 2, instances: 1}, {shape: 'circle', color: 'blue', used: 0, instances: 0}, {shape: 'square', color: 'blue', used: 4, instances: 4}, {shape: 'circle', color: 'red', used: 1, instances: 1}, {shape: 'circle', color: 'red', used: 1, instances: 0}, {shape: 'square', color: 'blue', used: 4, instances: 5}, {shape: 'square', color: 'red', used: 2, instances: 1}];
let grouped = Object.values(arr.reduce((a,c)=> {
let i = a[JSON.stringify([c.shape, c.color])] ??= {...c, used: 0, instances: 0};
i.used += c.used; i.instances += c.instances; return a;
} , {}));
console.log(grouped);
Or, to make it easier to specify arbitrary grouping properties and summing properties:
const arr = [{shape: 'square', color: 'red', used: 1, instances: 1}, {shape: 'square', color: 'red', used: 2, instances: 1}, {shape: 'circle', color: 'blue', used: 0, instances: 0}, {shape: 'square', color: 'blue', used: 4, instances: 4}, {shape: 'circle', color: 'red', used: 1, instances: 1}, {shape: 'circle', color: 'red', used: 1, instances: 0}, {shape: 'square', color: 'blue', used: 4, instances: 5}, {shape: 'square', color: 'red', used: 2, instances: 1}];
function groupAndSum(arr, groupProps, sumProps) {
return Object.values(arr.reduce((a,c)=> {
let i = a[JSON.stringify(groupProps.map(p=>[p,c[p]]))] ??=
{...c, ...Object.fromEntries(sumProps.map(p=>[p, 0]))};
sumProps.forEach(p=>i[p]+=c[p]); return a;
} , {}));
}
console.log(groupAndSum(arr, ['shape', 'color'], ['used', 'instances']));
const v = [{"shape":"square","color":"red","used":1,"instances":1},{"shape":"square","color":"red","used":2,"instances":1},{"shape":"circle","color":"blue","used":0,"instances":0},{"shape":"square","color":"blue","used":4,"instances":4},{"shape":"circle","color":"red","used":1,"instances":1},{"shape":"circle","color":"red","used":1,"instances":0},{"shape":"square","color":"blue","used":4,"instances":5},{"shape":"square","color":"red","used":2,"instances":1}];
function groupBy<T>(
arr: T[],
vInitial: Partial<T>,
fn: (curr: T, acc: T) => void,
...args: Array<keyof T>
) {
return Array.from(
arr
.reduce((r, o) => {
const key = args.map((k) => o[k]).join("|");
const ob = Object.assign({}, o);
const obj = {};
for (const key of Object.keys(ob)) {
if (
vInitial != null &&
vInitial.hasOwnProperty(key) &&
vInitial[key] != null
) {
obj[key] = vInitial[key];
}
}
const item = r.get(key) ?? Object.assign({}, o, obj);
fn(item, o);
return r.set(key, item);
}, new Map<string, T>())
.values(),
);
}
console.log(groupBy(
v,
{},
(item, o) => {
item.used += o.used;
item.instances += o.instances;
},
'shape', 'color'));
I would like to compare the var arrayB with var arrayA in the said condition as arrayA[n].[m].id will be matched with arrayB[ele].optionValue[e].id.
var arrayA = [
[{value: "#0767b9", id: 162,productId: 1}, value: "#f4b7d4",id: 164,productId: 1],
[{value: "#44acd8",id: 102,productId: 2}],
[{value: "#609923",id: 106,productId: 3}, {value: "#ee3b70",id: 107,productId: 3}]
]
var arrayB = [
{
id: 1,
optionValue: [{value: "#002e63",id: 161,productId: 1}, {value: "#0767b9",id: 162,productId: 1},{value: "#010b1d",id: 163,productId: 1}, {value: "#f4b7d4",id: 164,productId: 1}]
},
{
id: 2,
optionValue: [{value: "#EC7063",id: 93,productId: 2}, {value: "#bf0000",id: 94,productId: 2}, {value: "#44acd8",id: 102,productId: 2}, {value: "#ffdbdb",id: 103,productId: 2}]
},
{
id: 3,
optionValue: [{value: "#d861bd",id: 105,productId: 3}, {value: "#609923",id: 106,productId: 3}, {value: "#ee3b70",id: 107,productId: 3}]
},
{
id: 4,
optionValue: [{value: "#44acd8",id: 165,productId: 4}]
}
]
My goal is to return var arrayB with that filtered data that will remove the object which is not in the var arrayA, like this:
var result = [
{
id: 1,
optionValue: [{value: "#0767b9",id: 162,productId: 1},{value: "#f4b7d4",id: 164,productId: 1}]
},
{
id: 2,
optionValue: [{value: "#44acd8",id: 102,productId: 2}]
},
{
id: 3,
optionValue: [{value: "#609923",id: 106,productId: 3},{value: "#ee3b70",id: 107,productId: 3}]
},
{
id: 4,
optionValue: [{value: "#44acd8",id: 165,productId: 4}]
}
]
I have workaround as below but that is not giving the desired output.
const myArray = arrayB.map((el) => {
el.optionValue.filter((fl) => {
arrayA.map(values => {
values.map((value) => {
!value.id.includes(fl.id)
})
})
})
});
Note: For id:4 in result set is the case that is the selected productId for which there is no any value is selected. So in arrayA there is no value for productId:4. So in result for this kind of cases if there is no values are for comparison then it should be return as it is instead of blank array.
If you like to get only common identifier pairs from both, you could collect the identifier and map the filterd array of arrayB.
This approach takes only one loop for every array.
const
arrayA = [[{ value: "#0767b9", id: 162, productId: 1 }, { value: "#f4b7d4", id: 164, productId: 1 }], [{ value: "#44acd8", id: 102, productId: 2 }], [{ value: "#609923", id: 106, productId: 3 }, { value: "#ee3b70", id: 107, productId: 3 }]],
arrayB = [{ id: 1, optionValue: [{ value: "#002e63", id: 161, productId: 1 }, { value: "#0767b9", id: 162, productId: 1 }, { value: "#010b1d", id: 163, productId: 1 }, { value: "#f4b7d4", id: 164, productId: 1 }] }, { id: 2, optionValue: [{ value: "#EC7063", id: 93, productId: 2 }, { value: "#bf0000", id: 94, productId: 2 }, { value: "#44acd8", id: 102, productId: 2 }, { value: "#ffdbdb", id: 103, productId: 2 }] }, { id: 3, optionValue: [{ value: "#d861bd", id: 105, productId: 3 }, { value: "#609923", id: 106, productId: 3 }, { value: "#ee3b70", id: 107, productId: 3 }] }, { id: 4, optionValue: [{ value: "#44acd8", id: 165, productId: 4 }] }],
identifiers = arrayA.reduce((r, a) => {
a.forEach(({ id, productId }) => (r[productId] = r[productId] || {})[id] = true);
return r;
}, {}),
result = arrayB.map(o => identifiers[o.id]
? { ...o, optionValue: o.optionValue.filter(({ id, productId }) => identifiers[productId][id]) }
: o
);
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }
Can try out with this:
var arrayA = [
[{value: "#0767b9", id: 162, productId: 1}, {value: "#f4b7d4", id: 164, productId: 1}],
[{value: "#44acd8", id: 102, productId: 2}],
[{value: "#609923", id: 106, productId: 3}, {value: "#ee3b70", id: 107, productId: 3}]
];
var arrayB = [
{
id: 1,
optionValue: [{value: "#002e63", id: 161, productId: 1}, {
value: "#0767b9",
id: 162,
productId: 1
}, {value: "#010b1d", id: 163, productId: 1}, {value: "#f4b7d4", id: 164, productId: 1}]
},
{
id: 2,
optionValue: [{value: "#EC7063", id: 93, productId: 2}, {
value: "#bf0000",
id: 94,
productId: 2
}, {value: "#44acd8", id: 102, productId: 2}, {value: "#ffdbdb", id: 103, productId: 2}]
},
{
id: 3,
optionValue: [{value: "#d861bd", id: 105, productId: 3}, {
value: "#609923",
id: 106,
productId: 3
}, {value: "#ee3b70", id: 107, productId: 3}]
},
{
id: 4,
optionValue: [{value: "#44acd8", id: 165, productId: 4}]
}
];
let result = [];
for (let i = 0; i < arrayB.length; i++) {
let selectedElem = [];
for (let j = 0; j < arrayB[i].optionValue.length; j++) {
arrayA.forEach(elemA => {
elemA.forEach(subElemA => {
if(subElemA.id === arrayB[i].optionValue[j].id) {
selectedElem.push(arrayB[i].optionValue[j]);
}
})
})
}
if (selectedElem.length !== 0){
arrayB[i].optionValue = selectedElem;
}
result.push(arrayB[i]);
}
console.log('result::', JSON.stringify(result, null, 2));
I have a material with a certain ID number and an array of products that contain an array of materials they consist of. I need to filter out all the products that include that specific material (all the products that have that ID number inside their materials array).
Is there a prompt way to do that with ES6 syntax?
E.g
const myMaterialId = 100
const productsArray = [
{
name: products,
materials: [
{id: 100, amount: 30},
{id: 102, amount: 20},
],
},
{
name: product2,
materials: [
{id: 115, amount: 25},
{id: 120, amount: 50},
],
},
{
name: product2,
materials: [
{id: 100, amount: 35},
{id: 120, amount: 50},
{id: 150, amount: 10},
],
}
];```
You can use the filter function:
var filteredProductsArray = productsArray.filter(product => product.materials.filter(material => material.id === myMaterialId).length > 0);
This will filter all products by filtering their materials to see if the materials array has a material with your material id.
https://jsfiddle.net/8r31zdav/ u can use filter and find method
var result= productsArray.filter(x=>x.materials.find(y=>y.id==myMaterialId));
and also your object is invalid. value of name attribute is string so u need to write it in ""
const productsArray = [
{
name: "products",
materials: [
{id: 100, amount: 30},
{id: 102, amount: 20},
],
},
{
name: "product3",
materials: [
{id: 115, amount: 25},
{id: 120, amount: 50},
],
},
{
name: "product2",
materials: [
{id: 100, amount: 35},
{id: 120, amount: 50},
{id: 150, amount: 10},
],
}
];
I'm trying to transform some data by using Lodash groupBy and map. Here is sample data:
var data = [
{name: 'x', qty: 0, rate: 10},
{name: 'x', qty: 10, rate: 2},
{name: 'y', qty: 5, rate: 20},
{name: 'y', qty: 55, rate: 11}]
I need that data in the format:
var data = [
{name: 'x', pricing: [{qty: 0, rate: 10}, {qty: 10, rate: 2}]},
{name: 'y', pricing: [{qty: 5, rate: 20}, {qty: 55, rate: 11}]}]
The following is my attempt:
var m = _.chain(data)
.groupBy(data, 'name')
.map( function(i) {
return {
name: _.first(i).name,
pricing: _.map(i, function(r) {
return _.pick(r, ['qty', 'rate'])
})
}
})
This produces
[{
"name": "x",
"pricing": [
{"qty": 0, "rate": 10},
{"qty": 10, "rate": 2},
{"qty": 5,"rate": 20},
{"qty": 55,"rate": 11}]
}]
I've been unable to figure out what I'm doing wrong. Maybe this isn't even valid and there is a better way?
You need to map new object and get the picked values.
var data = [{ name: 'x', qty: 0, rate: 10 }, { name: 'x', qty: 10, rate: 2 }, { name: 'y', qty: 5, rate: 20 }, { name: 'y', qty: 55, rate: 11 }],
result = _(data)
.groupBy('name')
.map((pricing, name) => ({
name,
pricing: _.map(pricing, _.partialRight(_.pick, ['qty', 'rate']))
}))
.value();
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js"></script>
You don't need to use lodash for this - standard Javascript array methods work just fine. Reduce into an object indexed by name, then get that object's values:
var data = [
{name: 'x', qty: 0, rate: 10},
{name: 'x', qty: 10, rate: 2},
{name: 'y', qty: 5, rate: 20},
{name: 'y', qty: 55, rate: 11}]
const obj = data.reduce((a, { name, ...rest }) => {
if (!a[name]) a[name] = { name, pricing: [] };
a[name].pricing.push(rest);
return a;
}, {});
const output = Object.values(obj);
console.log(output);
You can do that using reduce()
var data = [
{name: 'x', qty: 0, rate: 10},
{name: 'x', qty: 10, rate: 2},
{name: 'y', qty: 5, rate: 20},
{name: 'y', qty: 55, rate: 11}]
let res = data.reduce((ac,a) => {
let i = ac.findIndex(x => x.name === a.name);
if(i === -1) i = ac.push({name:a.name,pricing:[]}) - 1
ac[i].pricing.push({qty:a.qty,rate:a.rate});
return ac;
},[])
console.log(res);
Your code is actually fine, except for a small mistake. You start a chain with data, and then you try to groupBy the data. Since non of the items return true for this predicate, all are bundled under a single group, and this is the reason for your single object.
You need to change .groupBy(data, 'name') to .groupBy('name').
Example:
var data = [{ name: 'x', qty: 0, rate: 10 }, { name: 'x', qty: 10, rate: 2 }, { name: 'y', qty: 5, rate: 20 }, { name: 'y', qty: 55, rate: 11 }];
var m = _.chain(data)
.groupBy('name') // group by name, and not by data, 'name'
.map(function(i) {
return {
name: _.first(i).name,
pricing: _.map(i, function(r) {
return _.pick(r, ['qty', 'rate'])
})
}
})
console.log(m);
.as-console-wrapper {
max-height: 100% !important;
top: 0;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js"></script>
Grouping elements in array by multiple properties is the closest match to my question as it indeed groups objects by multiple keys in an array. Problem is this solution doesn't sum up the properties value then remove the duplicates, it instead nests all the duplicates in a two-dimensional arrays.
Expected behavior
I have an array of objects which must be grouped by shape and color.
var arr = [
{shape: 'square', color: 'red', used: 1, instances: 1},
{shape: 'square', color: 'red', used: 2, instances: 1},
{shape: 'circle', color: 'blue', used: 0, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 4},
{shape: 'circle', color: 'red', used: 1, instances: 1},
{shape: 'circle', color: 'red', used: 1, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 5},
{shape: 'square', color: 'red', used: 2, instances: 1}
];
Objects in this array are considered duplicates only if both their shape and color are the same. If they are, I want to respectively sum up their used and instances values then delete the duplicates.
So in this example result array may only contain four combinations : square red, square blue, circle red, circle blue
Problem
I tried a simpler approach here:
var arr = [
{shape: 'square', color: 'red', used: 1, instances: 1},
{shape: 'square', color: 'red', used: 2, instances: 1},
{shape: 'circle', color: 'blue', used: 0, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 4},
{shape: 'circle', color: 'red', used: 1, instances: 1},
{shape: 'circle', color: 'red', used: 1, instances: 0},
{shape: 'square', color: 'red', used: 4, instances: 4},
{shape: 'square', color: 'red', used: 2, instances: 2}
];
result = [];
arr.forEach(function (a) {
if ( !this[a.color] && !this[a.shape] ) {
this[a.color] = { color: a.color, shape: a.shape, used: 0, instances: 0 };
result.push(this[a.color]);
}
this[a.color].used += a.used;
this[a.color].instances += a.instances;
}, Object.create(null));
console.log(result);
but it outputs
[{shape: "square", color: "red", used: 11, instances: 9},
{shape: "circle", color: "blue", used: 4, instances: 4}]
instead of expected result:
[{shape: "square", color: "red", used: 5, instances: 3},
{shape: "circle", color: "red", used: 2, instances: 1},
{shape: "square", color: "blue", used: 11, instances: 9},
{shape: "circle", color: "blue", used: 0, instances: 0}]
How can I get my function to properly group the objects by shape and color ? i.e. sum up their values and remove the duplicates ?
Use Array#reduce with a helper object to group similar objects. For each object, check if the combined shape and color exists in the helper. If it doesn't, add to the helper using Object#assign to create a copy of the object, and push to the array. If it does, add it's values to used and instances.
var arr = [{"shape":"square","color":"red","used":1,"instances":1},{"shape":"square","color":"red","used":2,"instances":1},{"shape":"circle","color":"blue","used":0,"instances":0},{"shape":"square","color":"blue","used":4,"instances":4},{"shape":"circle","color":"red","used":1,"instances":1},{"shape":"circle","color":"red","used":1,"instances":0},{"shape":"square","color":"blue","used":4,"instances":5},{"shape":"square","color":"red","used":2,"instances":1}];
var helper = {};
var result = arr.reduce(function(r, o) {
var key = o.shape + '-' + o.color;
if(!helper[key]) {
helper[key] = Object.assign({}, o); // create a copy of o
r.push(helper[key]);
} else {
helper[key].used += o.used;
helper[key].instances += o.instances;
}
return r;
}, []);
console.log(result);
If you can use ES6, you use a Map to collect the values, and then convert it back to an array by spreading the Map#values:
const arr = [{"shape":"square","color":"red","used":1,"instances":1},{"shape":"square","color":"red","used":2,"instances":1},{"shape":"circle","color":"blue","used":0,"instances":0},{"shape":"square","color":"blue","used":4,"instances":4},{"shape":"circle","color":"red","used":1,"instances":1},{"shape":"circle","color":"red","used":1,"instances":0},{"shape":"square","color":"blue","used":4,"instances":5},{"shape":"square","color":"red","used":2,"instances":1}];
const result = [...arr.reduce((r, o) => {
const key = o.shape + '-' + o.color;
const item = r.get(key) || Object.assign({}, o, {
used: 0,
instances: 0
});
item.used += o.used;
item.instances += o.instances;
return r.set(key, item);
}, new Map).values()];
console.log(result);
Use this method to specify multiple properties:
public static groupBy(array, f) {
let groups = {};
array.forEach(function (o) {
var group = JSON.stringify(f(o));
groups[group] = groups[group] || [];
groups[group].push(o);
});
return Object.keys(groups).map(function (group) {
return groups[group];
})
}
Call this method like:
var result = Utils.groupBy(arr, function (item) {
return [item.shape, item.color];
});
You can use reduce() to create one object of unique shape|color properties and Object.values() to return array of those values.
var arr =[{"shape":"square","color":"red","used":1,"instances":1},{"shape":"square","color":"red","used":2,"instances":1},{"shape":"circle","color":"blue","used":0,"instances":0},{"shape":"square","color":"blue","used":4,"instances":4},{"shape":"circle","color":"red","used":1,"instances":1},{"shape":"circle","color":"red","used":1,"instances":0},{"shape":"square","color":"blue","used":4,"instances":5},{"shape":"square","color":"red","used":2,"instances":1}]
var result = Object.values(arr.reduce(function(r, e) {
var key = e.shape + '|' + e.color;
if (!r[key]) r[key] = e;
else {
r[key].used += e.used;
r[key].instances += e.instances
}
return r;
}, {}))
console.log(result)
You could use a hash table and the keys for grouping same groups.
var array = [{ shape: 'square', color: 'red', used: 1, instances: 1 }, { shape: 'square', color: 'red', used: 2, instances: 1 }, { shape: 'circle', color: 'blue', used: 0, instances: 0 }, { shape: 'square', color: 'blue', used: 4, instances: 4 }, { shape: 'circle', color: 'red', used: 1, instances: 1 }, { shape: 'circle', color: 'red', used: 1, instances: 0 }, { shape: 'square', color: 'blue', used: 4, instances: 5 }, { shape: 'square', color: 'red', used: 2, instances: 1 }],
hash = Object.create(null),
grouped = [];
array.forEach(function (o) {
var key = ['shape', 'color'].map(function (k) { return o[k]; }).join('|');
if (!hash[key]) {
hash[key] = { shape: o.shape, color: o.color, used: 0, instances: 0 };
grouped.push(hash[key]);
}
['used', 'instances'].forEach(function (k) { hash[key][k] += o[k]; });
});
console.log(grouped);
.as-console-wrapper { max-height: 100% !important; top: 0; }
ES6 answers as requisted by user:
// To call this function:
// const result = this.toolBox.multipleGroupByArray(
// dataArray, (property: IProperty) => [property.prop1, property.prop2, property.prop3]);
multipleGroupByArray(dataArray, groupPropertyArray) {
const groups = {};
dataArray.forEach(item => {
const group = JSON.stringify(groupPropertyArray(item));
groups[group] = groups[group] || [];
groups[group].push(item);
});
return Object.keys(groups).map(function(group) {
return groups[group];
});
}
Here is a more general grouping and summing function that accepts an array of objects, an array of keys to group by, and an array of keys to sum.
function groupAndSum(arr, groupKeys, sumKeys){
return Object.values(
arr.reduce((acc,curr)=>{
const group = groupKeys.map(k => curr[k]).join('-');
acc[group] = acc[group] || Object.fromEntries(
groupKeys.map(k => [k, curr[k]]).concat(sumKeys.map(k => [k, 0])));
sumKeys.forEach(k => acc[group][k] += curr[k]);
return acc;
}, {})
);
}
Demo:
var arr = [
{shape: 'square', color: 'red', used: 1, instances: 1},
{shape: 'square', color: 'red', used: 2, instances: 1},
{shape: 'circle', color: 'blue', used: 0, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 4},
{shape: 'circle', color: 'red', used: 1, instances: 1},
{shape: 'circle', color: 'red', used: 1, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 5},
{shape: 'square', color: 'red', used: 2, instances: 1}
];
function groupAndSum(arr, groupKeys, sumKeys){
return Object.values(
arr.reduce((acc,curr)=>{
const group = groupKeys.map(k => curr[k]).join('-');
acc[group] = acc[group] || Object.fromEntries(groupKeys.map(k => [k, curr[k]]).concat(sumKeys.map(k => [k, 0])));
sumKeys.forEach(k => acc[group][k] += curr[k]);
return acc;
}, {})
);
}
const res = groupAndSum(arr, ['shape', 'color'], ['used', 'instances']);
console.log(res);
If you want groupBy keys as per conditional fields then here is the modification for #Abbes answer:
function groupBy(array, f) {
let groups = {};
array.forEach((o) => {
var group = f(o).join('-');
groups[group] = groups[group] || [];
groups[group].push(o);
});
return groups;
}
And use it like:
groupBy(connectedServers, (item) => {
return [item.key1, item.key2];
});
In case if you need an array of 'used' and 'instances' based on the colour or shape property; then you can use this code .
(PS : I know this is not what you are looking for but in future it may help someone. Also am reusing Nenand's code for this purpose . If the code is useful to you just thank him )
var array = [{ shape: 'square', color: 'red', used: 1, instances: 1 }, { shape: 'square', color: 'red', used: 2, instances: 1 }, { shape: 'circle', color: 'blue', used: 0, instances: 0 }, { shape: 'square', color: 'blue', used: 4, instances: 4 }, { shape: 'circle', color: 'red', used: 1, instances: 1 }, { shape: 'circle', color: 'red', used: 1, instances: 0 }, { shape: 'square', color: 'blue', used: 4, instances: 5 }, { shape: 'square', color: 'red', used: 2, instances: 1 }],
hash = Object.create(null),
grouped = [];
array.forEach(function (o) {
var key = ['shape', 'color'].map(function (k) { return o[k]; }).join('|');
if (!hash[key]) {
hash[key] = { shape: o.shape, color: o.color, YourArrayName : [] };
grouped.push(hash[key]);
}
['used'].forEach(function (k) { hash[key]['YourArrayName'].push({ used : o['used'], instances : o['instances'] }) });
});
console.log(grouped);
The output will be in like
I have a suggestion for you.
If you want to make it easier to do, you try the Underscore library : http://underscorejs.org/
I tried quickly to use it and got the right result :
var arr = [
{shape: 'square', color: 'red', used: 1, instances: 1},
{shape: 'square', color: 'red', used: 2, instances: 1},
{shape: 'circle', color: 'blue', used: 0, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 4},
{shape: 'circle', color: 'red', used: 1, instances: 1},
{shape: 'circle', color: 'red', used: 1, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 5},
{shape: 'square', color: 'red', used: 2, instances: 1}
];
var byshape = _.groupBy(arr, 'shape');
var bycolor = _.map(byshape, function(array) {
return _.groupBy(array, 'color')
});
var output = [];
_.each(bycolor, function(arrayOfShape) {
_.each(arrayOfShape, function(arrayOfColor) {
var computedItem = {shape: "", color: "", used: 0, instances: 0};
_.each(arrayOfColor, function(item) {
computedItem.shape = item.shape;
computedItem.color = item.color;
computedItem.used += item.used;
computedItem.instances += item.instances;
});
output.push(computedItem);
});
});
console.log(output);
http://jsfiddle.net/oLyzdoo7/
This solution groups first data, then you can do what you want after, for example, compute data as ypur wish.
Maybe you can optimize it, let me know if you need more help
/**
* Groups an array of objects with multiple properties.
*
* #param {Array} array: the array of objects to group
* #param {Array} props: the properties to groupby
* #return {Array} an array of arrays with the grouped results
*/
const groupBy = ({ Group: array, By: props }) => {
getGroupedItems = (item) => {
returnArray = [];
let i;
for (i = 0; i < props.length; i++) {
returnArray.push(item[props[i]]);
}
return returnArray;
};
let groups = {};
let i;
for (i = 0; i < array.length; i++) {
const arrayRecord = array[i];
const group = JSON.stringify(getGroupedItems(arrayRecord));
groups[group] = groups[group] || [];
groups[group].push(arrayRecord);
}
return Object.keys(groups).map((group) => {
return groups[group];
});
};
Example:
Assume that we have an array of objects. Each object contains info about a person and the money that possess. We want to sum up the money for all persons with the same Nationality and with the same gender.
const data = [
{Name: 'George', Surname: 'Best', Country: 'Great Britain', Gender: 'Male', Money:8000},
{Name: 'Orion', Surname: 'Papathanasiou', Country: 'Greece', Gender: 'Male', Money: 2000},
{Name: 'Mairy', Surname: 'Wellbeck', Country: 'Great Britain', Gender: 'Female', Money:5000},
{Name: 'Thanasis', Surname: 'Papathanasiou', Country: 'Greece',Gender: 'Male', Money: 3200},
{Name: 'George', Surname: 'Washington', Country: 'Great Britain', Gender: 'Male',Money:4200},
{Name: 'Orfeas', Surname: 'Kalaitzis', Country: 'Greece', Gender: 'Male', Money: 7643},
{Name: 'Nick', Surname: 'Wellington', Country: 'USA', Gender: 'Male', Money:1000},
{Name: 'Kostas', Surname: 'Antoniou', Country: 'Greece', Gender: 'Male', Money: 8712},
{Name: 'John', Surname: 'Oneal', Country: 'USA', Gender: 'Male', Money:98234},
{Name: 'Paulos', Surname: 'Stamou', Country: 'Greece', Gender: 'Male', Money: 3422},
{Name: 'Soula', Surname: 'Spuropoulou', Country: 'Greece', Gender: 'Female', Money:400},
{Name: 'Paul', Surname: 'Pierce', Country: 'USA', Gender: 'Male',Money: 13000},
{Name: 'Helen', Surname: 'Smith', Country: 'Great Britain', Gender: 'Female', Money:1000},
{Name: 'Cathrine', Surname: 'Bryant', Country: 'Great Britain', Gender: 'Female', Money: 8712},
{Name: 'Jenny', Surname: 'Scalabrini', Country: 'USA', Gender: 'Female', Money:92214}];
const groupByProperties = ['Country', 'Gender'];
Calling the function:
const groupResult = groupBy( {Group: data, By: groupByProperties} );
The group result is:
(6) [Array(2), Array(5), Array(3), Array(3), Array(1), Array(1)]
0: Array(2)
0: {Name: "George", Surname: "Best", Country: "Great Britain", Gender: "Male", Money: 8000}
1: {Name: "George", Surname: "Washington", Country: "Great Britain", Gender: "Male", Money: 4200}
length: 2
__proto__: Array(0)
1: Array(5)
0: {Name: "Orion", Surname: "Papathanasiou", Country: "Greece", Gender: "Male", Money: 2000}
1: {Name: "Thanasis", Surname: "Papathanasiou", Country: "Greece", Gender: "Male", Money: 3200}
2: {Name: "Orfeas", Surname: "Kalaitzis", Country: "Greece", Gender: "Male", Money: 7643}
3: {Name: "Kostas", Surname: "Antoniou", Country: "Greece", Gender: "Male", Money: 8712}
4: {Name: "Paulos", Surname: "Stamou", Country: "Greece", Gender: "Male", Money: 3422}
length: 5
__proto__: Array(0)
2: Array(3)
0: {Name: "Mairy", Surname: "Wellbeck", Country: "Great Britain", Gender: "Female", Money: 5000}
1: {Name: "Helen", Surname: "Smith", Country: "Great Britain", Gender: "Female", Money: 1000}
2: {Name: "Cathrine", Surname: "Bryant", Country: "Great Britain", Gender: "Female", Money: 8712}
length: 3
__proto__: Array(0)
3: Array(3)
0: {Name: "Nick", Surname: "Wellington", Country: "USA", Gender: "Male", Money: 1000}
1: {Name: "John", Surname: "Oneal", Country: "USA", Gender: "Male", Money: 98234}
2: {Name: "Paul", Surname: "Pierce", Country: "USA", Gender: "Male", Money: 13000}
length: 3
__proto__: Array(0)
4: Array(1)
0: {Name: "Soula", Surname: "Spuropoulou", Country: "Greece", Gender: "Female", Money: 400}
length: 1
__proto__: Array(0)
5: Array(1)
0: {Name: "Jenny", Surname: "Scalabrini", Country: "USA", Gender: "Female", Money: 92214}
length: 1
__proto__: Array(0)
length: 6
__proto__: Array(0)
So, we got 6 arrays. Each array is grouped by Country and by Gender
Iterating over each array, we can sum up the money!
const groupBy = ({ Group: array, By: props }) => {
getGroupedItems = (item) => {
returnArray = [];
let i;
for (i = 0; i < props.length; i++) {
returnArray.push(item[props[i]]);
}
return returnArray;
};
let groups = {};
let i;
for (i = 0; i < array.length; i++) {
const arrayRecord = array[i];
const group = JSON.stringify(getGroupedItems(arrayRecord));
groups[group] = groups[group] || [];
groups[group].push(arrayRecord);
}
return Object.keys(groups).map((group) => {
return groups[group];
});
};
const data = [
{Name: 'George', Surname: 'Best', Country: 'Great Britain', Gender: 'Male', Money:8000},
{Name: 'Orion', Surname: 'Papathanasiou', Country: 'Greece', Gender: 'Male', Money: 2000},
{Name: 'Mairy', Surname: 'Wellbeck', Country: 'Great Britain', Gender: 'Female', Money:5000},
{Name: 'Thanasis', Surname: 'Papathanasiou', Country: 'Greece',Gender: 'Male', Money: 3200},
{Name: 'George', Surname: 'Washington', Country: 'Great Britain', Gender: 'Male',Money:4200},
{Name: 'Orfeas', Surname: 'Kalaitzis', Country: 'Greece', Gender: 'Male', Money: 7643},
{Name: 'Nick', Surname: 'Wellington', Country: 'USA', Gender: 'Male', Money:1000},
{Name: 'Kostas', Surname: 'Antoniou', Country: 'Greece', Gender: 'Male', Money: 8712},
{Name: 'John', Surname: 'Oneal', Country: 'USA', Gender: 'Male', Money:98234},
{Name: 'Paulos', Surname: 'Stamou', Country: 'Greece', Gender: 'Male', Money: 3422},
{Name: 'Soula', Surname: 'Spuropoulou', Country: 'Greece', Gender: 'Female', Money:400},
{Name: 'Paul', Surname: 'Pierce', Country: 'USA', Gender: 'Male',Money: 13000},
{Name: 'Helen', Surname: 'Smith', Country: 'Great Britain', Gender: 'Female', Money:1000},
{Name: 'Cathrine', Surname: 'Bryant', Country: 'Great Britain', Gender: 'Female', Money: 8712},
{Name: 'Jenny', Surname: 'Scalabrini', Country: 'USA', Gender: 'Female', Money:92214}];
const groupByProperties = ['Country', 'Gender'];
const groupResult = groupBy( {Group: data, By: groupByProperties} );
console.log(groupResult);
I found some of these answers a little hard to reuse so here is a reusable function that you can pass in what keys you want your grouping to use.
var arr = [
{shape: 'square', color: 'red', used: 1, instances: 1},
{shape: 'square', color: 'red', used: 2, instances: 1},
{shape: 'circle', color: 'blue', used: 0, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 4},
{shape: 'circle', color: 'red', used: 1, instances: 1},
{shape: 'circle', color: 'red', used: 1, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 5},
{shape: 'square', color: 'red', used: 2, instances: 1}
];
const groupByMultipleKeys = (items, keys) =>
items.reduce((acc, item) => {
const isExistingItem = acc
.flatMap(accItem => accItem)
.find(accItem =>
keys.every(key => accItem[key] === item[key])
)
if (isExistingItem) {
return acc;
}
const allRelatedItems = items.filter(ungroupedItem =>
keys.every(key => ungroupedItem[key] === item[key])
)
acc.push(allRelatedItems)
return acc
}, [])
const groupedItem = groupByMultipleKeys(arr, ['shape', 'color'])
console.log('groupedItem', groupedItem)
List item
var arr = [
{shape: 'square', color: 'red', used: 1, instances: 1},
{shape: 'square', color: 'red', used: 2, instances: 1},
{shape: 'circle', color: 'blue', used: 0, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 4},
{shape: 'circle', color: 'red', used: 1, instances: 1},
{shape: 'circle', color: 'red', used: 1, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 5},
{shape: 'square', color: 'red', used: 2, instances: 1}
];
result = [];
arr.forEach(function (a) {
if ( !this[a.color] && !this[a.shape] ) {
this[a.color] = { color: a.color, shape: a.shape, used: 0, instances: 0 };
result.push(this[a.color]);
}
this[a.color].used += a.used;
this[a.color].instances += a.instances;
}, Object.create(null));
console.log(result);
**Output:**
[
{
"color": "red",
"shape": "square",
"used": 11,
"instances": 9
},
{
"color": "blue",
"shape": "circle",
"used": 4,
"instances": 4
}
]
thats all perfetcly working.
Enjoy your coding....
1.sumkeys
3.groupkeys
var arr = [
{shape: 'square', color: 'red', used: 1, instances: 1},
{shape: 'square', color: 'red', used: 2, instances: 1},
{shape: 'circle', color: 'blue', used: 0, instances: 0},
{shape: 'square', color: 'blue', used: 4, instances: 4},
{shape: 'circle', color: 'red', used: 1, instances: 1},
{shape: 'circle', color: 'red', used: 1, instances: 0},
{shape: 'square', color: 'red', used: 4, instances: 4},
{shape: 'square', color: 'red', used: 2, instances: 2}
];
function groupbykeys(arr, groupKeys, sumKeys){
var hash = Object.create(null),
grouped = [];
arr.forEach(function (o) {
var key = groupKeys.map(function (k) { return o[k]; }).join('|');
if (!hash[key]) {
hash[key] = Object.keys(o).reduce((result, key)=> {
result[key]=o[key];
if(sumKeys.includes(key))
result[key]=0;
return result;
}, { }); //map_(o) //{ shape: o.shape, color: o.color, used: 0, instances: 0 };
grouped.push(hash[key]);
}
sumKeys.forEach(function (k) { hash[key][k] += o[k]; });
});
return grouped;
}
var result=groupbykeys(arr,['shape','color'],['used','instances']);
console.log(result)
Aggregate into an object keyed by the unique combination of shape and color with reduce then take the values out of it:
const aggregate = xs => Object.values(
xs.reduce((acc, {shape, color, used, instances}) => {
const key = shape + color;
acc[key] ??= {shape, color, used: 0, instances: 0};
acc[key].used += used;
acc[key].instances += instances;
return acc;
}, {})
);
console.log(aggregate(arr));
<script>
const arr =
[ {shape: 'square', color: 'red', used: 1, instances: 1}
, {shape: 'square', color: 'red', used: 2, instances: 1}
, {shape: 'circle', color: 'blue', used: 0, instances: 0}
, {shape: 'square', color: 'blue', used: 4, instances: 4}
, {shape: 'circle', color: 'red', used: 1, instances: 1}
, {shape: 'circle', color: 'red', used: 1, instances: 0}
, {shape: 'square', color: 'blue', used: 4, instances: 5}
, {shape: 'square', color: 'red', used: 2, instances: 1}];
</script>
Much more compact ES6 version, which uses JSON.stringify to ensure proper separation between the properties that are being grouped by.
const arr = [{shape: 'square', color: 'red', used: 1, instances: 1}, {shape: 'square', color: 'red', used: 2, instances: 1}, {shape: 'circle', color: 'blue', used: 0, instances: 0}, {shape: 'square', color: 'blue', used: 4, instances: 4}, {shape: 'circle', color: 'red', used: 1, instances: 1}, {shape: 'circle', color: 'red', used: 1, instances: 0}, {shape: 'square', color: 'blue', used: 4, instances: 5}, {shape: 'square', color: 'red', used: 2, instances: 1}];
let grouped = Object.values(arr.reduce((a,c)=> {
let i = a[JSON.stringify([c.shape, c.color])] ??= {...c, used: 0, instances: 0};
i.used += c.used; i.instances += c.instances; return a;
} , {}));
console.log(grouped);
Or, to make it easier to specify arbitrary grouping properties and summing properties:
const arr = [{shape: 'square', color: 'red', used: 1, instances: 1}, {shape: 'square', color: 'red', used: 2, instances: 1}, {shape: 'circle', color: 'blue', used: 0, instances: 0}, {shape: 'square', color: 'blue', used: 4, instances: 4}, {shape: 'circle', color: 'red', used: 1, instances: 1}, {shape: 'circle', color: 'red', used: 1, instances: 0}, {shape: 'square', color: 'blue', used: 4, instances: 5}, {shape: 'square', color: 'red', used: 2, instances: 1}];
function groupAndSum(arr, groupProps, sumProps) {
return Object.values(arr.reduce((a,c)=> {
let i = a[JSON.stringify(groupProps.map(p=>[p,c[p]]))] ??=
{...c, ...Object.fromEntries(sumProps.map(p=>[p, 0]))};
sumProps.forEach(p=>i[p]+=c[p]); return a;
} , {}));
}
console.log(groupAndSum(arr, ['shape', 'color'], ['used', 'instances']));
const v = [{"shape":"square","color":"red","used":1,"instances":1},{"shape":"square","color":"red","used":2,"instances":1},{"shape":"circle","color":"blue","used":0,"instances":0},{"shape":"square","color":"blue","used":4,"instances":4},{"shape":"circle","color":"red","used":1,"instances":1},{"shape":"circle","color":"red","used":1,"instances":0},{"shape":"square","color":"blue","used":4,"instances":5},{"shape":"square","color":"red","used":2,"instances":1}];
function groupBy<T>(
arr: T[],
vInitial: Partial<T>,
fn: (curr: T, acc: T) => void,
...args: Array<keyof T>
) {
return Array.from(
arr
.reduce((r, o) => {
const key = args.map((k) => o[k]).join("|");
const ob = Object.assign({}, o);
const obj = {};
for (const key of Object.keys(ob)) {
if (
vInitial != null &&
vInitial.hasOwnProperty(key) &&
vInitial[key] != null
) {
obj[key] = vInitial[key];
}
}
const item = r.get(key) ?? Object.assign({}, o, obj);
fn(item, o);
return r.set(key, item);
}, new Map<string, T>())
.values(),
);
}
console.log(groupBy(
v,
{},
(item, o) => {
item.used += o.used;
item.instances += o.instances;
},
'shape', 'color'));