Lodash features that are available in plain JavaScript

In recent years, new features in JavaScript have been rolling out at a rapid pace. The deficiencies that were filled in by other libraries before have become built-in features of plain JavaScript.

In this article, we’ll look at the methods in Lodash that are now available in plain JavaScript.

Lodash is a JavaScript library that delivers consistency, modularity, performance, & extras.

Map

Lodash has a map method to map each array entry to another by a function that we specify. It takes in an array and a function to transform the entries as arguments.

For example, we can call Lodash’s map method by writing:

const arr = _.map([1, 2, 3], n => n ** 2);

Then, we get back:

[1, 4, 9]

JavaScript’s arrays now have the map method. How it can be used is shown below:

console.log() is used for printing.

Filter

The filter method in Lodash returns a new array that has the filtered entries of the original array. It takes an array and a function that returns the condition for the filter as arguments.

For example, to return an array with only even numbers, we can write:

const arr = _.filter([1, 2, 3], n => n % 2 === 0);

With JavaScript array’s filter method, we can simplify the code a bit since it’s called on the array itself. We can rewrite it as:

Reduce

Like the other two array methods, Lodash’s reduce method now has a plain JavaScript equivalent with the same name. Both of them let us combine our array entries into one thing.

For example, to get the sum of all the entries in an array, we can use the Lodash reduce method:

const arr = _.reduce([1, 2, 3], (total, n) => total + n, 0);

The Lodash version took three arguments: the array to combine, the function used to combine the values, and the initial value for the combined value.

JavaScript array’s reduce method is similar except that we call it directly on the array:

Head

Lodash’s head method returns the first element of an array. For example, the following will get us 3 as the value of first:

const first = _.head([3, 4, 5]);

We can do this with JavaScript by:

Tail

Lodash’s tail method will get us everything except the first entry of an array.

For example:

const rest = _.tail([3, 4, 5]);

Then, we get [4, 5] as the value of rest.

We can write the following to get everything but the first element of an array:

Rest

Lodash’s rest method gets the extra arguments that are passed into the callback function, and are in excess of the number of parameters, and returns a function that lets us do something with those extra arguments.

For example, if we have:

const restFn = _.rest((first, rest) => rest);

Then, calling restFn(“foo”, “bar”, “baz”); will return [“bar”, “baz”].

We have the rest operator to do the same thing in JavaScript’s rest operator:

Spread

Lodash’s spread method will return a function that takes a callback function, and then return a function where we pass in an array that we use as the argument of the callback function we passed in.

For example, if we have:

const spreadFn = _.spread((foo, bar) => `＄{foo} ＄{bar}`);

Then, when we call spreadFn:

spreadFn(["foo", "bar", "baz"])

We get back:

'foo bar'

It’ll take each entry of the array passed into spreadFn and pass it as the arguments of the function that we passed into the spread method.

This is the same as calling a function in JavaScript:

As you can see, lots of methods in Lodash have equivalents in plain JavaScript, especially array methods. So, to reduce the reliance on libraries, we can use more plain JavaScript.