JavaScript find() Method

Introduction

The find() method in JavaScript is a useful array method for searching for an element that matches a specific condition.

The find() method returns the first element that satisfies the condition. If no element matches, it returns undefined.

What is JavaScript find() Method?

The JavaScript find() method returns the first element in an array that satisfies a specified condition.

πŸ“–
Important:
  • It returns the first element that matches the condition.
  • If no elements match, it returns undefined.

Syntax of find()


array.find(function(currentValue,index,array){})

Explanation of Parameters:

The callback function accepts three parameters.

  1. currentValue: Current element
  2. index: Current index
  3. array: Original array

Basic Examples of find()

You will see some basic examples.

Example 1: Find a Number Greater Than 10


let numbers = [5,10,15,20];
let result = numbers.find(num => num>10);
console.log(result);

Output:

15

Example 2: Find an Even Number


let nums = [1,3,4,6];
let result = nums.find(num => num%2===0);
console.log(result);

Output:

4

Note: Only the first even number is returned.

Example 3: Find a string from the Array


let fruits= ["Apple","Banana","Mango"];

let result = fruits.find( fruit => fruit==="Banana");

console.log(result);

Output:

Banana

find() with Objects


let users=[
{id:1,name:"John"},

{id:2,name:"Tom"},

{id:3,name:"Rom"}
];

let user = users.find( item => item.id === 2);

console.log(user);

Output:

{ id:2, name:”Tom” }

Real-Life Example:

You will see many real-life examples of the find() method.

Real-Life Example 1: Find Product by ID


let products=[
{id:1,name:"Laptop"},

{id:2,name:"Phone"}
];

let product= products.find( item => item.id === 2);

console.log(product);

Output:

{ id:2, name:”Phone” }

Real-Life Example 2: Student Marks

Find the first student scoring above 80.


let marks = [50,60,90,95];

let result = marks.find( mark => mark>80);

console.log(result);

Output:

90

Real-Life Example 3: Search Active User


let users=[
{
name:"John",
active:false
},
{
name:"Tom",
active:true
}
];

let result = users.find(user => user.active);

console.log(result);

Output:

{ name:”Tom”, active:true }

Difference Between find() and filter()

Beginners often confuse them.

Feature find() filter()
Return First match All matches
Return Type Value/Object Array
No Match undefined []
Example
[1,2,3,4]
.find(
  x => x > 2
)

Output: 3
[1,2,3,4]
.filter(
  x => x > 2
)

Output: [3,4]

Common Mistakes in find()

Beginners make some common mistakes. You will see some common mistakes.

Mistake 1: Expecting Multiple Results

Wrong expectation:


let results = [1,2,3,4].find( x => x > 2); 
console.log(results);

Expected:

[3,4]

Actual:

3

Mistake 2: Forgetting Return Statement

Wrong:


let nums = [1,2,3,4,5,6,7];
results = nums.find( num=>{ num>5 });
console.log(results);

Output:

undefined

Correct:


let nums = [1,2,3,4,5,6,7];
results = nums.find( num=>{ return num>5 });
console.log(results);

Output:

6

find() method – Interview Questions

Q 1: What does find() do?
Ans: Returns the first matching element.
Q 2: Does it return an array?
Ans: No, returns element.
Q 3: Does it stop after the match?
Ans: Yes.
Q 4: If no match is found?
Ans: Returns undefined.
Q 5: Use case?
Ans: Finding a single record.

find() method– Objective Questions (MCQs)

Q1. The find() method returns ______.






Q2. If no element matches, find() returns ______.






Q3. find() stops searching after ______.






Q4. Which method returns index instead of value?






Q5. find() works on ______.






Conclusion

The JavaScript find() method is a powerful array method that locates the first element that matches a condition. It is widely used in user search systems, e-commerce websites, API handling, and data processing.

Unlike filter(), the find() method returns only the first matching element, making it faster when only one result is needed.