How to Use the New JS Object GroupBy Method

Recently, fully browser baseline support was reached for the Object groupBy method, which is very useful for working with data.
This tutorial explains how the method works and shows a practical demonstration of the method in the browser.
Code from video - github.com/pro...
MDN reference: developer.mozi...
CanIuse reference: caniuse.com/?s...

[@barungh]

Congratulations on 100K subscribers, and thanks a lot for sharing your knowledge and expertise

[@Mark-ms8gk]

100k! It was a long journey but very well deserved. Congratulations!

[@thejarxtv]

I always enjoy your videos, cheers on those 100K!

[@codetechpro]

I always enjoy your videos, something new I learned today, thanks Steve

[@muhammadhossam8557]

very helpful details thanks for your great videos

[@cristian702]

Welcome back! Just noticed your new videos. Yes!

[@shahinza]

Thank you professor for the great video

[@zbjz]

GroupBy Method starts at 5:50

[@LucianoClassicalGuitar]

Finally Steve is back!

[@binodsharma112]

Great video, Thank you

[@sachin.tandon]

Is there a way of using this function to do a 2-level nested grouped Map/Object, if one were to provide a pair of keys, e.g. { key, sub-key }

[@SteveGriffith-Prof3ssorSt3v3]

It really depends on what you are trying to do. You might want to use reduce or flatMap

[@deepakvishwakarma2043]

great ! can we also sort this based on no. of items in series instead of random order (length of keys : []) ?

[@SteveGriffith-Prof3ssorSt3v3]

You can group by length of keys yes. There is no sorting in an object. The order in an object is based on the order that the keys were added.

[@user_8911]

It would be nice to add performance comparison section to the video.

[@SteveGriffith-Prof3ssorSt3v3]

In terms of real world usage, unless you have multiple thousands of objects in your array it is not going to matter which approach you use. This method is for developer convenience.

[@user-dh8rm3ob4f]

Hello Sir, can you please make videos on node js background processes, how the cores come into play?

[@SteveGriffith-Prof3ssorSt3v3]

You can post tutorial requests here - kzbin.info/www/bejne/gnTIq5SuZ9qBacU

[@fellastout]

Lipstick on a pig (map method)? But it looks useful, thanks Steve.

[@SteveGriffith-Prof3ssorSt3v3]

It doesn't return an array, so closer to the reduce method

[@xxapoloxx]

why is this in object and not in array?.

[@SteveGriffith-Prof3ssorSt3v3]

It returns an Object not an array. The Map object also has a groupBy method if the keys are not strings or symbols.

[@xxapoloxx]

@@SteveGriffith-Prof3ssorSt3v3 so does reduce, this clearly a collection processing functionality, this belongs in array, this bad design.

[@aleksandarpopovic3615]

behind the scene movies.reduce((groupBY, item) => { if(!groupBY[item.series]) groupBY[item.series] = []; groupBY[item.series].push(item) return groupBY }, {}) I don't understand the purpose of adding things without some benefit... nothing less code is written... who does not understand reduce, will not understand this either

[@SteveGriffith-Prof3ssorSt3v3]

If all you are doing is what you did in that reduce statement, then with the new groupBy you could reduce all the code into this one line: Object.groupBy(movies, ({series})=>series); which I would argue is much easier to read and understand than the reduce method. I've been teaching Array.reduce to students for years and they frequently struggle with the syntax. The more complex the situation, the more options that you are adding, the longer the code becomes, regardless of which option you pick.

[@lllllllllIIIIIIIIIIl]

You don't see the benefit of writing less code vs. more code? Wow. Where do you work, so we can all know not to apply?

[@xyster7]

I will never use it, seems to me like another overengineered noise and distraction from the minimalism and simplicity

[@UsernameUsername0000]

????????!!! This exists in almost every main language out there. It’s not over engineering. It’s a common task that shouldn’t need so much boilerplate to achieve.