TypeScript Array find()

In this chapter, we will explore the find() method for arrays in TypeScript. This method is a built-in function that helps in finding the first element in an array that satisfies a provided testing function. Understanding how to use find() is useful for locating elements within arrays based on specific criteria.

Table of Contents

  1. Definition
  2. Syntax
  3. Examples
  4. Conclusion

1. Definition

The find() method returns the value of the first element in the provided array that satisfies the provided testing function. If no elements satisfy the testing function, undefined is returned.

2. Syntax

array.find(callback(element, index, array), thisArg?);

Parameters

  • callback: A function to execute on each value in the array, taking three arguments:
    • element: The current element being processed in the array.
    • index (optional): The index of the current element being processed in the array.
    • array (optional): The array find was called upon.
  • thisArg (optional): Object to use as this when executing callback.

Return Value

The method returns the value of the first element in the array that satisfies the provided testing function. Otherwise, it returns undefined.

3. Examples

Let's look at some examples to understand how find() works in TypeScript.

Example 1: Basic Usage

In this example, we find the first element in the array that is greater than 10.

let numbers: number[] = [5, 12, 8, 130, 44];
let result = numbers.find((num) => num > 10);
console.log(result); // Output: 12

Example 2: Finding an Even Number

In this example, we find the first even number in the array.

let numbers: number[] = [1, 3, 7, 8, 5];
let result = numbers.find((num) => num % 2 === 0);
console.log(result); // Output: 8

Example 3: Using Index and Array in Callback

In this example, we use the index and the array itself within the callback function to find an element.

let numbers: number[] = [1, 3, 7, 8, 5];
let result = numbers.find((num, index, arr) => {
  console.log(`Element: ${num}, Index: ${index}, Array: ${arr}`);
  return num > 6;
});
console.log(result); // Output: 7
// Console will also log each element, index, and array.

Example 4: Finding an Object in an Array

In this example, we find the first object in an array with a specific property value.

interface Person {
  name: string;
  age: number;
}

let people: Person[] = [
  { name: "Ravi", age: 25 },
  { name: "Ankit", age: 30 },
  { name: "Priya", age: 28 },
];

let result = people.find((person) => person.age > 25);
console.log(result); // Output: { name: 'Ankit', age: 30 }

Example 5: No Match Found

In this example, we use find() with a condition that no elements satisfy, resulting in undefined.

let numbers: number[] = [1, 3, 5, 7];
let result = numbers.find((num) => num > 10);
console.log(result); // Output: undefined

4. Conclusion

In this chapter, we explored the find() method for arrays in TypeScript, which is used to find the first element in an array that satisfies a provided testing function. We covered its definition, syntax, parameters, return value, and provided several examples to demonstrate its usage. Understanding how to use find() effectively can help in various array manipulation tasks in TypeScript, especially when locating elements within arrays based on specific criteria.

Comments

Spring Boot 3 Paid Course Published for Free
on my Java Guides YouTube Channel

Subscribe to my YouTube Channel (165K+ subscribers):
Java Guides Channel

Top 10 My Udemy Courses with Huge Discount:
Udemy Courses - Ramesh Fadatare