Check out my books on Amazon at https://www.amazon.com/John-Au-Yeung/e/B08FT5NT62
Subscribe to my email list now at http://jauyeung.net/subscribe/
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 the head
, indexOf
, initial
, intersection
, intersectionBy
, and intersectionWith
methods.
head
The head
method gets the first element of an array and returns it. first
is an alias of head
.
It takes an array as its only argument.
We can use it as follows:
import * as _ from "lodash";
const array = [1, 2, 3];
const result = _.head(array);
console.log(result);
Then we get 1 for result
. head
returns undefined
is the array passed in is empty.
indexOf
indexOf
gets the index of the first occurrence of the item found in the array that’s passed into the argument and returns it.
It takes up to 3 arguments. The first is the array to search. The second argument is the value to look for. The third is an optional argument for the index to start the search from.
For example, we can use it as follows:
import * as _ from "lodash";
const array = [1, 2, 3];
const result = _.indexOf(array, 2, 1);
console.log(result);
Then we get 1 since 2 is in the 2nd position and we search from the start.
initial
The initial
method gets all but the last element of an array and returns it.
It takes an array as its only argument.
For example, we can use it as follows:
import * as _ from "lodash";
const array = [1, 2, 3];
const result = _.initial(array);
console.log(result);
Then we get [1, 2]
for result
.
intersection
The intersection
method returns an array of values that are included in all given arrays. Equality comparison is done with the SameValueZero comparison which is the same as ===
except that NaN
is considered equal to itself.
It takes a comma-separated list of arrays to return the intersection from.
For example, we can use it as follows:
import * as _ from "lodash";
const arr1 = [1, 2, 3];
const arr2 = [3, 4, 5];
const result = _.intersection(arr1, arr2);
console.log(result);
Then we get [3]
since only 3 are present in both arr1
and arr2
.
intersectionBy
intersectionBy
is like intersection
except that it takes a function which is invoked for each element of each array to generate the criterion for which items are compared. The first array determines the order and reference of results.
It takes a comma-separated list of arrays as arguments and a function for the criterion to compare to find the intersection with or a string with the property name to compare.
For example, we can use it as follows:
import * as _ from "lodash";
const arr1 = [
{ name: "Joe", age: 10 },
{ name: "Mary", age: 12 },
{ name: "Jane", age: 13 }
];
const arr2 = [
{ name: "Joe", age: 10 },
{ name: "Jerry", age: 12 },
{ name: "Amy", age: 13 }
];
const result = _.intersectionBy(arr1, arr2, a => a.name);
console.log(result);
Then we get:
[
{
"name": "Joe",
"age": 10
}
]
for result
.
We can replace a => a.name
with 'name'
as follows:
import * as _ from "lodash";
const arr1 = [
{ name: "Joe", age: 10 },
{ name: "Mary", age: 12 },
{ name: "Jane", age: 13 }
];
const arr2 = [
{ name: "Joe", age: 10 },
{ name: "Jerry", age: 12 },
{ name: "Amy", age: 13 }
];
const result = _.intersectionBy(arr1, arr2, "name");
console.log(result);
Then we get the same thing.
intersectionWith
intersectionWith
is like intersection
except that it takes a comparator function as the last argument. The parameters for the function are 2 entries of from the arrays to compare against.
It takes a comma-separated list of arrays as arguments and the comparator function as the last argument.
For example, we can use it as follows:
import * as _ from "lodash";
const arr1 = [
{ name: "Joe", age: 10 },
{ name: "Mary", age: 12 },
{ name: "Jane", age: 13 }
];
const arr2 = [
{ name: "Joe", age: 10 },
{ name: "Jerry", age: 12 },
{ name: "Amy", age: 13 }
];
const result = _.intersectionWith(arr1, arr2, (a, b) => a.name === b.name);
console.log(result);
Then we get:
[
{
"name": "Joe",
"age": 10
}
]
for result
.
The head
method gets the first element of an array and returns it. first
is an alias of head
.
indexOf
gets the index of the first occurrence of the item found in the array that’s passed into the argument and returns it. It can take a starting index to search from which defaults to 0.
initial
gets all but the last element of an array and returns it.
To find array entries that are in all arrays, we can use the intersection
, intersectionBy
, and intersectionWith
methods. They differ in that they may take functions for the criterion to compare or a comparator method to compare for equality respectively.