Managing, sorting, and manipulating knowledge with JavaScript is a ability we have usually delegated to 3rd occasion libraries like lodash. Because the JavaScript language progresses, nonetheless, these options finally get. added to the JavaScript specification. Two such APIs for grouping of Array knowledge are `Array.prototype.group and Array.prototype.groupToMap.
Array.prototype.group
To group an array of objects by a given property, name the group methodology with operate that returns the grouping string:
const groups = [
{ name: "Arsenal", origin: "London", tier: "legendary" },
{ name: "Manchester United", origin: "Manchester", tier: "legendary" },
{ name: "Liverpool", origin: "Liverpool", tier: "legendary" },
{ name: "Newcastle United", origin: "Newcastle", tier: "mid" },
// Lol, awful club
{ name: "Tottenham", origin: "London", tier: "lol" },
];
const tieredTeams = groups.group(({ tier }) => tier);
The results of the array’s group is an object with keys that match the grouping key:
{
legendary: [
{name: "Arsenal", origin: "London", tier: "legendary"},
{name: "Manchester United", origin: "Manchester", tier: "legendary"},
{name: "Liverpool", origin: "Liverpool", tier: "legendary"}
],
mid: [
{name: "Newcastle United", origin: "Newcastle", tier: "mid"}
],
lol: [
{name: "Tottenham", origin: "London", tier: "lol"}
]
}
Array.prototype.groupToMap
groupToMap returns a Map occasion as a substitute of an object literal:
const tieredTeamsMap = groups.group(({ tier }) => tier);
tieredTeamsMap.has('lol') // true
tieredTeamsMap.get('lol') // [{name: "Tottenham", origin: "London", tier: "lol"}]
As of the time of publish, group and groupToMap are solely out there in Safari. These two strategies are essential to knowledge administration transferring ahead. Whether or not you are manipulating knowledge on shopper or server facet, these newly added native strategies are a lot welcomed.
