Learning JavaScript by Implementing Lodash Methods — Picking Items and Getting Sizes

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 Lodash methods that let us pick items and getting sizes of collections.

reject

The reject method takes a collection of items and a predicate with the items that we don’t want to include in the returned array and return an array with the items that are opposite of the predicate.

We can implement this as follows:

const reject = (collection, predicate) => collection.filter(c => !predicate(c));

In the code above, we just called filter with a callback that returns the predicate call negated.

Then we can call it as follows:

const users = [{
    'user': 'foo',
    'active': false
  },
  {
    'user': 'bar',
    'active': true
  }
];

const result = reject(users, o => !o.active);

The code above rejects the users entries that have active set to false as the value.

This means that we return the entries with active set to true . Therefore, we get:

[
  {
    "user": "bar",
    "active": true
  }
]

as the value of result .

sample

The Lodash sample method returns a random element from a collection. Since plain JavaScript has a Math.random method, we can use that to get a random element from an array as follows:

const sample = (collection) => {
  const index = Math.random() * (collection.length);
  return collection[Math.floor(index)];
};

In the code above, we just used the Math.random method which is multiplied by the collection.length to get the index . Then we take the floor of it to get the actual index.

Then when we call it as follows:

const result = sample([1, 2, 3]);

We get a random item from the array.

sampleSize

The sampleSize method takes an array to get the items from and the size of the sample, we want to get.

It returns the array that takes random elements from the collection up to the given size .

We can implement the sampleSize method as follows:

const sampleSize = (collection, size) => {
  let sampled = [];
  for (let i = 1; i <= size; i++) {
    const index = Math.random() * (collection.length);
    sampled.push(collection.splice(index, 1)[0]);
  }
  return sampled;
};

In the code above, we created a loop that gets the index of the collection to pick by calling the Math.random multiplied by collection.length .

Then we called splice on collection to remove that element from collection and push it into the sampled array.

Once we have enough sampled items, we return sampled .

Then when we call it as follows:

const result = sampleSize([1, 2, 3], 2);

We get 2 different items from the array we passed in as the value of result .

shuffle

The Lodash shuffle method returns an array that’s a shuffled version of the original array.

We can implement it as follows:

const shuffled = (collection) => {
  let shuffled = [];
  const originalLength = collection.length;
  for (let i = originalLength - 1; i >= 0; i--) {
    const index = Math.random() * (collection.length);
    shuffled.push(collection.splice(index, 1)[0]);
  }
  return shuffled;
};

In the code above, we created a loop that loop through the collection ‘s original length. Then we get a random item from the collection and put it into the shuffled array as we did with the sampleSize function above.

Once the loop is done, we returned the shuffled array.

Then when we call shuffle as follows:

const result = shuffled([1, 2, 3]);

We get a shuffled version of the array we passed in.

size

The size method gets the size of a collection, which can be an array or an object. Since we have the length property of arrays and we have the Object.keys method for objects, we can implement it with the following code:

const size = (collection) => {
  if (Array.isArray(collection)) {
    return collection.length;
  } else {
    return Object.keys(collection).length;
  }
};

In the code above, we check if collection is an array. If it is, then we return the length property of it.

Otherwise, we return the array returned by Object.keys ‘s length property.

When we call it as follows:

const result = size([1, 2, 3]);

We get that result is 3.

When we call it with an object:

const result = size({
  'a': 1,
  'b': 2
});

We get that result is 2.

Conclusion

The reject method can be implemented with the filter method by negating the predicate in the callback.

The sample family of methods and shuffle can be implemented with Math.random and splice .

Finally, the size method can be implemented with the length of the array or length of the array returned by Object.keys .