Learning JavaScript by Implementing Lodash Methods — Loops and Searching

Lodash is a very useful utility library that lets us work with objects and arrays easily.

However, now that the JavaScript standard library is catching up to libraries such as Lodash, we can implement many of the functions in simple ways.

In this article, we’ll look at how to implement some Lodash methods that deal with iterating through and searching for data.

forEachRight

The forEachRight method lets us loop through a collection from end to start. It only loops through arrays.

We can implement it using a regular for loop as follows:

const forEachRight = (collection, iteratee) => {
  for (let i = collection.length - 1; i >= 0; i--) {
    const result = iteratee(collection[i])
    if (result === false) {
      break;
    }
  }
}

In the code above, we have a for loop that loops through our collection in reverse.

Inside the loop, we call iteratee on each item that’s being looped through.

Then if the returned value of the iteratee returns false , we break the loop.

We can then call it as follows:

forEachRight([1, 2], (value) => {
  if (value === 1) {
    return false;
  }
  console.log(value);
});

Once the value is 1, the loop ends, so we get 2 logged only.

every

The Lodash every method checks that a predicate returns truthy for all elements in a collection.

Since plain JavaScript has an every method that does the same thing but called on the array instance instead of passing in an array, we can implement the Lodash as follows:

const every = (arr, predicate) => arr.every(predicate)

Then when we call it as follows:

const result = every([1, 2, 3], x => x > 0);

We get that result is true since every element is bigger than 0.

filter

Lodash’s filter method iterates all elements of a collection and returns an array of all elements that return truthy.

JavaScript array has a filter method that does the same thing, so we can use it as follows:

const filter = (arr, predicate) => arr.filter(predicate)

The JavaScript filter method is part of the array instance, so we just call it to do the filtering for us.

Then when we call it as follows:

const result = filter([1, 2, 3], x => x > 1);

We get that result is [2, 3] since they’re bigger than 1.

find

find loops over a collection and returns the first item that meets the given condition.

The Lodash version of find also takes a starting index to search for.

We can implement our own Lodash find method with the plain JavaScript find method as follows:

const find = (arr, predicate, start) => arr.slice(start).find(predicate)

In the code above, we called slice with the start index to start searching from the start index with find .

Then we can call it as follows:

const result = find([4, 1, 2, 3], x => x > 1, 1);

And we get that result is 2 because it’s the first element that’s bigger than 1 and it’s index 1 or after.

findLast

The Lodash findLast method finds an element from right to left. The arguments are the same as find .

We can implement it with a for loop as follows:

const findLast = (arr, predicate, start = arr.length - 1) => {
  for (let i = start; i >= 0; i--) {
    if (predicate(arr[i])) {
      return arr[i]
    }
  }
}

In the code above, we looped through arr in reverse and call predicate on each entry until one returns a truthy value. If that’s the case, then that item is returned.

Then when we call it as follows:

const result = findLast([4, 1, 2, 3], x => x > 1, 1);

We get that result is 4 since that’s the first element in position less than or equal to 1 that’s bigger than 1.

Conclusion

The Lodash forEachRight method can be implemented with a for loop to loop through the items in reverse.

The every method can be implemented with plain JavaScript’s every method.

Likewise, the filter and find methods can be implemented with the plain JS version.

Finally, the findLast method can be implemented with a for loop that loop through items in reverse.