cft

JS - Some very useful lodash/fp functions

Lodash is a very powerful and useful library that provides several easy-to-use functions to deal with different data structures across your application. In this article I introduce you to some its functional programming functions.


user

Pablo Veiga

3 years ago | 4 min read

If you still don't know Lodash, it's time for you to try it. Lodash is a modern JavaScript utility library that

makes JavaScript easier by taking the hassle out of working with arrays, numbers, objects, strings, etc.

Source: https://lodash.com

It's okay if you prefer to deal with data types and structures the old fashion way by implementing your own algorithms, but I strongly believe that, in several cases, using Lodash will leverage your productivity and avoid some lines of code.

Besides, it is a very popular library, used by more then 10 million other projects on GitHub, and it's been downloaded more than 40 million times from NPM.

Lodash also provides a Functional Programming Module, which, according to them:

promotes a more functional programming (FP) friendly style by exporting an instance of Lodash with its methods wrapped to produce immutable auto-curried iteratee-first data-last methods.

Source: https://github.com/lodash/lodash/wiki/FP-Guide

In this article I'm going to introduce some
Lodash FP methods that will save some of your precious development hours by helping you to deal easily with different data structures in several situations:

  • isEmpty
  • get
  • getOr
  • at
  • pick
  • omit
  • orderBy
  • intersectionBy



isEmpty

Let's start with one of the simplest methods of Lodash FP module. It is the isEmpty one.
This method provides you an easy way to verify if a variable is empty or not (really?! 😒). It works well for arrays, objects and strings. But take care when checking Boolean or Numeric values.

Take a look at the examples below:

lodash/fp/isEmpty usage
lodash/fp/isEmpty usage

Initially, isEmpty was designed to deal only with arrays, objects and strings so, when dealing with Boolean, numeric or Function values, you need to be a little bit more cautious because it will always return true for these types no matter what.

lodash/fp/isEmpty usage - numbers
lodash/fp/isEmpty usage - numbers

You can check its full implementation to understand why this happens here

get

The next method on our list is the get method.
It allows you to get (again, b*tch?!) values from objects or arrays that you're not sure if they're available.
This helps a lot when dealing with dynamic structures within implementations that might continue even if specific values are not available at runtime.

Here are some examples:

lodash/fp/get usage
lodash/fp/get usage

It's important to mention that, if the searched value is null, the result will be null

You may use get to grab values regardless of the level the information is at within an object. For example:

lodash/fp/get usage - null vs undefined
lodash/fp/get usage - null vs undefined

You may also use get to get (😒) values from arrays by their indexes using the [index] notation. You might even combine the . and the [index] notations to grab data from complex structures.

lodash/fp/get indexes usage
lodash/fp/get indexes usage

This is how you deal with simple arrays:

lodash/fp/get simple array usage
lodash/fp/get simple array usage

And last, but not least, you may also need to get dynamic properties according to a given variable:

lodash/fp/get variable usage
lodash/fp/get variable usage

getOr

The getOr method increments a little bit what the get method does. The only difference here is that there is a third parameter that will be used in case of the property or index doesn't exist.

lodash/fp/getOr basic usage
lodash/fp/getOr basic usage

It's important to keep in mind that, regardless of the attribute/item value, if it exists it will be returned.
The fallback value (first parameter) will only be used if the attribute or item searched does not exist or is undefined.

Check the example:

lodash/fp/getOr nulll usage
lodash/fp/getOr nulll usage

If the intention is to get the value 'Unknown House' in a situation like above, the correct way of doing it would be using get:

lodash/fp/get vs lodash/fp/getOr
lodash/fp/get vs lodash/fp/getOr

You may also use getOr to grab data from arrays or even combine the object and array notations to get values from complex structures:

lodash/fp/getOr array usage
lodash/fp/getOr array usage

Take a look at all get examples. You may implement all of them using getOr following the same logic.

at

The at method is quite useful when you need to get more than one attribute/index from the same object regardless of the level the information is. It will return an array containing all of the found values and undefined for those that weren't found. The coolest thing about it is that you can use the Destructuring Assignment syntax and use the variables straight away:

lodash/fp/at destructuring assignment usage
lodash/fp/at destructuring assignment usage

The same rule to get items from arrays using their indexes with get or getOr is applied for at.

lodash/fp/at destructuring assignment usage with indexes
lodash/fp/at destructuring assignment usage with indexes

pick

The pick method is very useful when you need to get just some of the attributes of a given object and, by using it, your code will become more understandable for those who read. To use it, you need to specify the attributes you want to retrieve within an array.

lodash/fp/pick basic usage
lodash/fp/pick basic usage

Notice that you can also get nested attributes from your object. When using 'father.firstName', the pick method will get the father object but containing only its firstName property.

omit

The omit is like the "opposite" of pick.
Instead of getting the attributes specified, it will hide them from the result.

lodash/fp/omit basic usage
lodash/fp/omit basic usage

The same rule for hiding nested attributes works here. Notice that, by using 'father.firstName' it means that the firstName will be omitted and only the lastName will be gotten from father attribute.

If you need a more complex logic do pick or omit fields, I suggest you to take a look at:

orderBy

The orderBy method is useful to sort an array of objects considering a given property. You can sort value in both ascending and descending orders.

Take a look:

lodash/fp/orderBy basic usage
lodash/fp/orderBy basic usage

If you want to order items in ascending order, all you need to do is replace the 'desc' parameter by 'asc'.

orderBy is an evolved version of sortBy

intersectionBy

The intersectionBy method is useful to find items that belong to two different groups. You just need to pass the name of the property that will play as criteria for the intersection.

Check the examples:

lodash/fp/intersectionBy basic usage
lodash/fp/intersectionBy basic usage

To deal with arrays of primitive values (numbers, strings) you may use the intersection method.

These were some of the methods from Lodash Functional Programming Module that might be useful for you in a daily basis.
There a lot of other methods that can be used.

Attention: some links in this article take you to the basic Lodash documentation. In order to use the FP version of the method, the parameters need to be ordered differently.

I hope you liked it.
Please, comment and share!

Cover image by: Mika Baumeister

Upvote


user
Created by

Pablo Veiga

JavaScript expert | Agile developer | Amateur writer | Beer lover


people
Post

Upvote

Downvote

Comment

Bookmark

Share


Related Articles