My favorite Lodash Functions
Sometimes it's easy to question the relevancy of Lodash with things like:
- Optional Chaining.
- The nice
Array.prototypefunctions like map, filter, and reduce.
- Nice Object functions like Object.entries, Object.keys, and Object.values.
Lodash is still very helpful in everyday use. I've used these lodash utilities throughout my career and will probably continue to use them until TC39 adds their functionality to ECMAScript.
Groups some number of repeated actions that occur during a time frame.
This is really nice for creating a search-as-you-type input that makes an api call to display the results.
_.debounce, but instead of grouping repeated actions, it ensures that an action is only called once within a certain time frame. This is nice for performance reasons where we can get away with a delay to improve UX.
David Corbacho wrote a great article about the details of both
_.throttle. I'd recommend giving it a read.
Creates an array of consecutive integers, of a given length.
Memoization is a caching technique used for performance.
The basic idea is that given the same input over and over, a memoized function will calculate the return value the first time, cache it, and return that same value instead of actually running the function each time.
I've used this when creating a search index for fast frontend searching with something like fuse.js. With
_.memoize, the search index is only calculated once for the set of items.
You can implement your own memoization helper in vanilla JS, but there are some tricky edge cases lined out in this article, and lodash already has a battle tested one for us.
Really pretty simple. Takes an array, and returns a new array, shuffled! I've found this useful when I want a "random" list of items.
This is very nice to see if two objects have the same values. It deeply checks each object to determine if they have the same values.
I've used this the most to check if an array of items has changed when saving forms.
Pick only a subset of keys from an object. This is really handy when ensuring that only certain values are on an object before sending through an operation.
I've used this mostly as a safety layer before making api requests to make sure that things aren't accidentally getting sent that shouldn't.
Repeat a string
This is nice when you need a dynamic length string of special characters.
I've used this when building a CLI with node and I wanted a box of
* around a word.
Truncate a string when it is longer than a certain number of characters.
I've used this most when I want uniform items in a list, and have a description of some kind for each item. I'll truncate the description so that it only ever wraps 2 lines at most
Capitalize a word for readability. This is really nice because it includes a ton of edge cases for text formatting.
One honorable mention utility is
_.get. I've used
_.get() more that any of the utilites above, but recently
Create React App v3 includes support for Optional Chaining, so I don't use it anymore. 🤷🏻♂️
And that's it! Let me know if I missed a one that you find useful on Twitter.
About the Author
Hi 👋 I'm Tyler. I'm a software engineer with a passion for learning new things. I love solving hard problems and simplifying them down to their pieces. Presently residing in Utah with my two girls and beautiful wife.