Hello world, great to e-meet you. In my previous post, I wrote about how to use the filter method. In this post, I explain how to use the array find method in JavaScript. Let's get started.
What is the Array.find() method ?
The arr.find() method is used to get the value of the first element in the array that satisfies a condition provided to it.
It achieves this by searching through an array, find and returns the first occurrence of any element in the array, that meets the condition being tested for.
Basically, you provide your array with a condition and every element in the array is tested using the condition provided, if any element in the array meets the provided condition, it stops and return the value of that element.
Syntax
The syntax for the array.find() method is
// Arrow function
array.find((element) => { ... } )
How to Use The Array.find
To use the array.find() method, the required parameter is to provide the method a test function (i.e the function to execute on each value in the array). In its basic form the syntax will be
array.find(testFunction)
Use Cases
Let's now take a look at how to use the array.find method in solving some common javascript tasks you may encounter
- Find A Element Greater Than 10 In An Array You have an array of numbers and you want to find a number greater than 10
const numbers = [1, 4, 21, 10, 15]
//iterate through the array and find the first number greater than 10
const result = numbers.find((number) => number > 10);
console.log(result);
//expected output 21, this is the first element greater than 10
- Find A Name In An Array Of Names
You have an array of names and you want to find a specific name say "Ama" in that array
//define the array
const names = ["Adwoa", "Esi", "Ama", "Kofi"];
//iterate through the array and find the name "Ama"
const result = names.find((name)=> name === "Ama" );
console.log(result)
//expected output will be Ama
- Find An Object In An Array Of Objects
You have an array of objects and you want to find an object that has the name , Ama.
Let see how to go about this
const names = [{name: "Ama", age: 29}, {name:"Kofi", age: 23 }, {name: "Kwasi", age: 12}, {name: "Peter", age: 13}];
const name = names.find((name) => name === "Ama" );
console.log(name)
//output will be {name: "Ama", age: 29}
- Getting An Item In An Array At A Specified Index
You want to find an array element which has a certain index
const names = ["Ama", "Kofi", "Esi", "Robert" ]
// find a name which has an index of 2
const nameAtIndex = names.find((name, index) => index === 2 )
console.log(nameAtIndex)
//expected output , Esi
To get an element which has an specified index, you will need to pass (index) as an parameter
In Conclusion
The Array find method is a very useful way of searching through arrays, it will comb through the array and find the element you are looking for.
Just note, it will return the first element that meets the condition, meaning, if you have more than one element that meets the testing function, only a single element will be returned.
If you want to return multiple element, then use the Array.filter() method
Would love to read your comment on this, Me daa se
PS: Me daa se means "Thank You" in Twi, one of the most popular dialects in my country Ghana