TodayILearned, Work Projects

TIL… How to use Map and Reduce

While working on a React app, I needed to translate a bit of Redux shape into one needed by an Api. Due to the normalization we imposed on the Redux state, I had to navigate to the desired information through s couple of lists. These entities each had a list of ids of children, and I needed the grand-children of a given entity.

Instead of manually composing this list, I found map and reduce were far better suited to the task, as you might imagine. In order to get the list of grandchildren, I first mapped the list of children ids to a list of lists of grand-child ids. These lists were accessed through the children. Then I took the list of lists and reduced it , effectively merging it into a single, long list of all grandchildren. Helpful hit, always include an initial value for the list. It helps avoid bugs when inputs are empty. Finally I mapped the list of grand-child ids to the grandchildren themselves.

As an experiment I did try to manually iterate through the lists without Map and reduce, and found that those three lines replaced something like 12-15 lines. Further, the 12-15 line code was… obtuse at best. Got to love it when succinct code is also easier to understand.


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s