javascript
  1. javascript-find

JavaScript find()

The find() method is an array method in JavaScript that returns the value of the first element in an array that satisfies a given condition. It is similar to the filter() method but the find() method returns only the first match.

Syntax

array.find(function(currentValue, index, arr),thisValue)
  • function(currentValue, index, arr): This parameter specifies the function to be executed on each value in the array.
  • currentValue: The value of the current element being processed in the array.
  • index: Optional parameter that specifies the index of the current element being processed in the array.
  • arr: Optional parameter that specifies the array that the find() method is being called on.
  • thisValue: Optional parameter. A value to be passed to the function to be used as its "this" value.

Example

let numbers = [2, 5, 7, 9];

let result = numbers.find(function(number){
  return number > 5;
});

console.log(result); // Output: 7

Output

7

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Find Function Example</title>
</head>
<body>

<!-- Display the result in this element -->
<div id="result"></div>

<script>
  // Sample array of numbers
  let numbers = [2, 5, 7, 9];

  // Use the find function to find the first number greater than 5
  let result = numbers.find(function(number){
    return number > 5;
  });

  // Display the result on the page
  const resultElement = document.getElementById('result');
  resultElement.innerHTML = `<p> ${result}</p>`;
</script>

</body>
</html>
Try Playground

Explanation

In the above example, we have an array numbers containing four elements. The find() method is called on this array and it takes an anonymous function as a parameter. The anonymous function declares a parameter number and returns the first number greater than 5. The find() method searches for a number greater than 5 and returns the first number that satisfies the condition. Since 7 is the first number greater than 5 in the array, find() returns 7.

Use

The find() method is useful in many scenarios where you have to search for a particular element in an array. It can be used to find objects in an array, certain strings, or numbers, depending on the condition we specify.

Important Points

Here are some important points to keep in mind while using the find() method:

  • The find() method returns the first element that satisfies the given condition. If no element satisfies the condition, it returns undefined.
  • If the array is empty, the find() method always returns undefined.
  • If a thisValue parameter is provided, it becomes the value of this keyword inside the function.

Summary

The find() method in JavaScript allows you to search an array and retrieve the first element that meets a particular condition. It is useful in scenarios where you have to find certain objects, strings or numbers in an array. By specifying a function as its parameter, find() searches for the element that satisfies the given condition and returns it.

Published on: