4

Implementing "groupBy" function on array of object

 2 years ago
source link: https://dev.to/solexy/implementing-groupby-function-on-array-of-object-1gdp
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

Moltivation

There is a an array method called groupBy, i checked the description of the method and saw it as a handy method for grouping array of object base on a key that exist on an object of the array.

As of the time of this writing, i tried it out on my browser but OOPS!! no luck because it is not supported by any browser, i tried using it with typescript but no luck either, ran it with node(v16.14.0) REPL no luck either,i decided to implement it myself since i have read the description, thus the moltivation !!!!

Problem

Let's say we have have some group of data as array of object

  const inventory = [
    { name: 'asparagus', type: 'vegetables', quantity: 5 },
    { name: 'bananas',  type: 'fruit', quantity: 0 },
    { name: 'goat', type: 'meat', quantity: 23 },
    { name: 'cherries', type: 'fruit', quantity: 5 },
    { name: 'fish', type: 'meat', quantity: 22 }
  ];

Enter fullscreen mode

Exit fullscreen mode

using typescript we would define an interface over inventory as

 interface Inventory {
    name: string;
    type: string;
    quantity: number;
  }

Enter fullscreen mode

Exit fullscreen mode

Now we want to be able to group inventory base on a key that exist on inventory. typescript will let us do that with ease such that the result looks like this when we decide to group by type on inventory

{
  vegetables: [ 
    { name: 'asparagus', type: 'vegetables', quantity: 5 } ],

  fruit: [
    { name: 'bananas', type: 'fruit', quantity: 0 },
    { name: 'cherries', type: 'fruit', quantity: 5 }
  ],

  meat: [
    { name: 'goat', type: 'meat', quantity: 23 },
    { name: 'fish', type: 'meat', quantity: 22 }
  ]
}

Enter fullscreen mode

Exit fullscreen mode

My groupBy function

my solution function now looks like this

function groupBy<T>(collection:T[],key: keyof T){
   const groupedResult =  collection.reduce((previous,current)=>{

   if(!previous[current[key]]){
     previous[current[key]] = [] as T[];
    }

   previous[current[key]].push(current);
          return previous;
   },{} as any); // tried to figure this out, help!!!!!
     return groupedResult
 }

Enter fullscreen mode

Exit fullscreen mode

now we can call the inventory in this manner

  console.log(groupBy<Inventory>(inventory,"name"));
  console.log(groupBy<Inventory>(inventory,"quantity"));
  console.log(groupBy<Inventory>(inventory,"type"));

Enter fullscreen mode

Exit fullscreen mode

Notice the explicit indication of the generic type Inventory on the groupBy function at function call is for emphasis and not neccessarily needed since typescript will infer the generic type.

Conclusion

This is my implementation of the groupBy function and i have been using it for sometime now and i decided to share, let me know if there is more efficient way of doing this or if there is something i might do to improve the code. This approach is subject to change. Thanks.


report

Recommend

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK