Borislav Hadzhiev
Reading timeยท6 min
Photo from Unsplash
To check if a JavaScript array contains an object:
Array.some()
method to iterate over the array.Array.some()
will return true
if the object is contained in the array.const people = [ {id: 1, name: 'John'}, {id: 2, name: 'Adam'}, ]; const isFound = people.some(element => { if (element.id === 1) { return true; } return false; }); console.log(isFound); // ๐๏ธ true if (isFound) { // object is contained in the array }
The function we passed to the Array.some() method gets called with each value (object) in the array.
Array.some
method short-circuits and returns true
.On each iteration, we check if the current object has an id
property with a
value of 1
.
If the condition is met, we return true
, otherwise, we return false
.
If the Array.some()
method returns true
, the object is contained in the
array.
If you need to get the matching object, use the Array.find()
method.
To check if a JavaScript array contains an object:
Array.find()
method to iterate over the array.Array.find()
will return the object if the object is contained in the
array.const people = [ {id: 1, name: 'John'}, {id: 2, name: 'Adam'}, ]; const person = people.find(element => { if (element.id === 1) { return true; } return false; }); console.log(person); // ๐๏ธ { id: 1, name: 'John' } if (person !== undefined) { // ๐๏ธ object is contained in the array }
The function we passed to the Array.find() method gets called with each element in the array until it returns a truthy value or iterates over the entire array.
Array.find()
method returns the corresponding array element, otherwise, it returns undefined
.There is an object with an id
of 1
, so the find()
method returns the
object.
Array.find()
method instead of Array.some()
when you need to access additional properties on the object.If you need to get the index of the matching object, use the Array.findIndex()
method.
To check if a JavaScript array contains an object:
Array.findIndex()
method to iterate over the array.findIndex()
method will return the index of the object in the array, or
-1
if the object isn't in the array.const people = [ {id: 1, name: 'John'}, {id: 2, name: 'Adam'}, ]; const index = people.findIndex(element => { if (element.id === 1) { return true; } return false; }); console.log(index); // ๐๏ธ 0 if (index !== -1) { // ๐๏ธ object is contained in the array }
The
Array.findIndex()
method is very similar to the Array.find()
method, but it returns the index of
the element that satisfies the condition and not the element itself.
The Array.findIndex()
method calls its callback function with each element in
the array until a truthy value is returned or the values in the array are
exhausted.
Array.findIndex()
method returns -1
if all calls of the callback function return a falsy value.if you need to get all matching objects, use the Array.filter()
method.
To check if a JavaScript array contains an object:
Array.filter()
method to iterate over the array.Array.filter()
method will return an array containing the objects that
meet the condition (if any).const people = [ {id: 1, name: 'John'}, {id: 2, name: 'Adam'}, ]; const filteredArray = people.filter(element => { if (element.id === 1) { return true; } return false; }); console.log(filteredArray); // ๐๏ธ [ { id: 1, name: 'John' } ] if (filteredArray.length > 0) { // ๐๏ธ object is contained in the array }
The function we passed to the Array.filter() method gets called with each element in the array.
We check if each element (object) in the array contains an id
property with a
value of 1
. If the new array isn't empty, there are matching objects.
Note that the Array.filter()
method returns an array with all of the elements
that meet the condition.
If we had multiple objects with an id
equal to 1
, all of them would get
included in the new array.
const people = [ {id: 1, name: 'John'}, {id: 2, name: 'Adam'}, {id: 1, name: 'Bobby'}, ]; const filteredArray = people.filter(element => { if (element.id === 1) { return true; } return false; }); // ๐๏ธ [ { id: 1, name: 'John' }, { id: 1, name: 'Bobby' } ] console.log(filteredArray); if (filteredArray.length > 0) { // ๐๏ธ object is contained in the array }
There are multiple objects in the array with an id
of 1
, so they all get
included in the new array.
You can also use the Array.includes()
method to check if an object is
contained in an array.
To check if an array contains an object:
Array.include()
method to check if the object is contained in the
array.const obj = {id: 2, name: 'Adam'}; const people = [{id: 1, name: 'John'}]; people.push(obj); if (people.includes(obj)) { // ๐๏ธ this runs console.log('The object is contained in the array'); } else { console.log('The object is NOT contained in the array'); }
Note that this approach only works if you have access to the object that was pushed into the array.
The Array.includes()
method returns true
if the supplied value is contained
in the array and false
otherwise.
However, when we use the includes()
method with an object, it checks by
reference and not by value.
This wouldn't work if you have an object that has the same key-value pairs but has a different reference.
const people = [{id: 1, name: 'John'}]; // ๐๏ธ false console.log(people.includes({id: 1, name: 'John'}));
The code sample returns false
because the object we passed to the
Array.includes()
method has a different reference, even though it has the same
key-value pairs.
Only use the includes()
method to check if an array contains an object if you
have access to the same object (the same location in memory) that is stored in
the array.
const obj = {id: 2, name: 'Adam'}; const people = [{id: 1, name: 'John'}]; people.push(obj); if (people.includes(obj)) { // ๐๏ธ this runs console.log('The object is contained in the array'); } else { console.log('The object is NOT contained in the array'); }
You can also use a for...of
loop to check if an array contains an object.
for...of
loop #To check if an array contains an object:
for...of
loop to iterate over the array.true
.const people = [ {id: 1, name: 'John'}, {id: 2, name: 'Adam'}, ]; let isContained = false; for (const obj of people) { if (obj.id === 1) { isContained = true; console.log(obj); // ๐๏ธ { id: 1, name: 'John' } break; } } console.log(isContained); // ๐๏ธ true
We declared a new variable and initialized it to false
.
The
for...of
statement is used to loop over iterable objects like arrays, strings, Map
,
Set
and NodeList
objects and generators
.
On each iteration, we check if the current object has an id
property with a
value of 1
.
isContained
variable to true
and use the break
statement to exit the loop.The break
statement helps us avoid iterating over the array needlessly once
we've found the matching object.
You can also use a basic for
loop to check if an array contains an object.
for
loop #To check if an array contains an object:
for
loop to iterate over the array.true
if the condition is met.const people = [ {id: 1, name: 'John'}, {id: 2, name: 'Adam'}, ]; let isContained = false; for (let index = 0; index < people.length; index++) { if (people[index].id === 1) { isContained = true; console.log(people[index]); // ๐๏ธ { id: 1, name: 'John' } break; } } console.log(isContained); // ๐๏ธ true
We used a basic for
loop to iterate over the array.
On each iteration, we check if the object at the current index has an id
property with a value of 1
.
If the condition is met, we set the isContained
variable to true
and exit
the for
loop.
Which approach you pick is a matter of personal preference. I'd use the
Array.some()
method as I find it quite direct and intuitive.