Useful Lodash Array Functions — Fill and Find
Tags: javascript
Published: 2020-07-28 01:24:22

---
title: Useful Lodash Array Functions — Fill and Find
published: true
date: 2020-07-24 00:39:43 UTC
tags: JavaScript
canonical_url: https://thewebdev.info/2020/07/24/useful-lodash-array-functions%e2%80%8a-%e2%80%8afill-and-find/?utm_source=rss&utm_medium=rss&utm_campaign=useful-lodash-array-functions%25e2%2580%258a-%25e2%2580%258afill-and-find
---

Lodash is a utility library that has lots of methods for manipulating objects. It has stuff that we use all the time and also things that we don’t use frequently or don’t think of using.

In this article, we’ll look at more useful Lodash array methods, including `fill` , `findIndex` , and `findLastIndex` .

### `fill`

The `fill` method fills elements of an array with `value` from the `start` index inclusive but not including the `end` index.

It takes up to 4 arguments. The first argument is the `array` to fill in the items into. The second is the `value` to fill the `array` with.

The third is an optional argument for the `start` index to fill entries with. The default value is 0.

The last argument is an optional argument for the `end` index to fill it up to. The default value is the `array` ‘s `length` .

It returns a new array with the filled entries.

For example, we can use it as follows:

```
import * as _ from "lodash";

const result = _.fill(new Array(5), 1, 0, 2);
console.log(result);

```

Then we get:

```
[
  1,
  1,
  null,
  null,
  null
]

```

and assigned to `result`. Entries that aren’t filled are `null` .

If the `end` is bigger than the array’s `length` , as in the following code:

```
import * as _ from "lodash";

const result = _.fill(new Array(5), 1, 0, 10);
console.log(result);

```

Then we get all the arrays filled:

```
[
  1,
  1,
  1,
  1,
  1
]

```

and assigned to `result`. We can also fill items in the middle of an array as follows:

```
import * as _ from "lodash";

const result = _.fill(new Array(5), 1, 1, 2);
console.log(result);

```

Then we get:

```
[
  null,
  1,
  null,
  null,
  null
]

```

and assigned to `result`.

![](https://cdn-images-1.medium.com/max/800/0*MB-oyQ4QACN-M4yU)Photo by [Gabrielle Costa](https://unsplash.com/@lbrto?utm_source=medium&utm_medium=referral) on [Unsplash](https://unsplash.com?utm_source=medium&utm_medium=referral)

### `findIndex`

The `findIndex` method gets the first match of an object from an array that satisfies a given condition.

It takes up to 3 arguments. The first is the `array` to search for items with. The second is an optional argument where we pass in the callback function that returns the condition to look for. Finally, the third argument is an optional argument to specify where to start.

It returns the index of the entry if a match is found. Otherwise, it returns -1.

We can use it as follows:

```
import * as _ from "lodash";

const people = [
  { name: "Joe", age: 10 },
  { name: "Mary", age: 12 },
  { name: "Jane", age: 13 }
];
const result = _.findIndex(people, p => p.age === 10);

```

Then we get 0 for `result`.

We can also pass in a starting index as follows:

```
import * as _ from "lodash";

const people = [
  { name: "Joe", age: 10 },
  { name: "Mary", age: 12 },
  { name: "Jane", age: 13 }
];
const result = _.findIndex(people, p => p.age === 10, 1);

```

Then we get -1 since nothing from the index 1 and on has an entry with `age` 10.

### `findLastIndex`

This is similar to `findIndex` but it finds the last match instead of the first match. The search is also done from end to start.

The arguments are the same as the same as `findIndex` , except that the third argument takes the end index which too starts the search from the index of the first index.

For example, we can use it as follows:

```
import * as _ from "lodash";

const people = [
  { name: "Joe", age: 10 },
  { name: "Mary", age: 12 },
  { name: "Jane", age: 13 }
];
const result = _.findLastIndex(people, p => p.age === 12);

```

Then we get 1 for `result` since the entry match the condition is in the 2nd entry.

We can also pass in the end index as the third argument. For example, we can write:

```
import * as _ from "lodash";

const people = [
  { name: "Joe", age: 10 },
  { name: "Mary", age: 12 },
  { name: "Jane", age: 13 }
];
const result = _.findLastIndex(people, p => p.age === 13, 1);

```

Then we get -1 since the search starts at index 1 and goes down to 0. Nothing in index 1 or less meets the condition, so we get -1.

The `fill` method fills elements of an array with `value` from the `start` index inclusive but not including the `end` index.

The `findIndex` method gets the first match of an object from an array that satisfies a given condition and returns the index of that entry.

`findLastIndex` is similar to `findIndex` but it finds the last match instead of the first match. The search is also done from the end index to the start.

The post [Useful Lodash Array Functions — Fill and Find](https://thewebdev.info/2020/07/24/useful-lodash-array-functions%e2%80%8a-%e2%80%8afill-and-find/) appeared first on [The Web Dev](https://thewebdev.info).