How to Use find() Method in JavaScript (With Examples)


While working with arrays in JavaScript, searching for any element that meets certain conditions is frequently needed. For doing this, the “find()” method is utilized. It offers a quick and effective approach to finding items in an array. The callback function is used to specify the condition, which is invoked for each array element until a match is discovered or the entire array has been traversed.

This post will describe the find() method in JavaScript.

How to Utilize the “find()” Method in JavaScript?

The “find()” method is a pre-built JavaScript method that searches for specific elements in an array based on a particular condition. This method uses a callback function that iterates over each element of the array and outputs the first element that meets the given condition. If no element is found it gives an “undefined”

Syntax

The following syntax is used for the find() method:

array.find(callbackfunction(currentValue, index, array),thisValue);

In the above syntax:

  • The “callbackfunction” is a function that is invoked for every array element. It accepts three arguments:
  • The “currentValue” is the element that is currently being processed in the array.
  • index” is an optional argument in the callback function which indicates the index of the currently being processed element.
  • Pass the “array” name which is an optional parameter that indicates on which array the find() method is called.
  • thisValue” is the optional parameter of the find() method that is used while executing the callback function.

Example

First, create an array of numbers that contains positive and negative numbers:

const numArray = [-5, -2, 11, 3, 8, 15];

Call the find() method where the callback function will identify the element that is greater than “0”:

const result = numArray.find((element) => element > 0);

Finally, display the resultant value on the console:

console.log(result);

As you know, the find() method gives the first instance that satisfies the provided condition, so the output prints “11” on the console:

Example

Create an array of objects named “info”:

const info = [ 
{ id: 1, name: 'John' }, 
{ id: 3, name: 'Joseph' }, 
{ id: 5, name: 'Jenny' }, 
{ id: 7, name: 'Jeremy' } 
];

Call the find() method by to identify the object whose id is equivalent to “5”:

const result = info.find((user) => user.id === 5);

Print the resultant object on the console using the “console.log()” method:

console.log(result);

Output

Now, we will find the object whose id is “2”:

const result = info.find((user) => user.id === 2);
console.log(result);

The output gives “undefined” because there is no object with the id “2”:

That’s all about the find() method in JavaScript.

Conclusion

The “find()” method is a JavaScript array method that returns the first matching element that meets the specified condition. If you want to determine all elements that satisfy a condition, you can use the “filter()” method instead. This post explained the JavaScript find() method.

Print Friendly, PDF & Email
Categories