How to Use find() for Search in JavaScript Arrays

Use the find() method on an array to search for the first element that matches a condition. Pass a function to find() that returns true for the element you want to find. It returns the element or undefined if no match is found.

Syntax

The find() method is called on an array and takes a callback function as an argument. This callback receives each element and should return true when the desired element is found.

• array.find(callback(element, index, array))
• callback: A function that tests each element.
• element: The current element being checked.
• index: The index of the current element (optional).
• array: The array find() was called on (optional).

The method returns the first element where the callback returns true, or undefined if none match.

javascript

const found = array.find(element => element > 10);

Example

This example shows how to find the first number greater than 10 in an array using find(). It returns the first matching element or undefined if none match.

javascript

const numbers = [4, 9, 16, 25, 29];
const firstOver10 = numbers.find(num => num > 10);
console.log(firstOver10);

Output

16

Common Pitfalls

One common mistake is expecting find() to return all matching elements. It only returns the first match. Use filter() to get all matches.

Another mistake is not returning a boolean from the callback, which can cause unexpected results.

javascript

const nums = [1, 2, 3, 4, 5];

// Wrong: callback does not return a boolean explicitly
const wrongFind = nums.find(num => { return num > 3; });
console.log(wrongFind); // 4

// Right: callback returns a boolean
const rightFind = nums.find(num => num > 3);
console.log(rightFind); // 4

Output

4
4

Quick Reference

• Purpose: Find first element matching a condition.
• Returns: Element or undefined.
• Callback: Should return true or false.
• Use filter(): To get all matching elements.

Key Takeaways

Use find() to get the first element that meets a condition in an array.

The callback function must return a boolean to indicate a match.

find() returns undefined if no element matches.

Use filter() if you want all matching elements, not just the first.

Remember find() stops searching after the first match.