How to Use Array indexOf in JavaScript: A Simple Example

The indexOf method in JavaScript is a helpful tool for finding the index of a specific value in an array. It searches the array from the beginning and returns the first index at which the specified element is found. If the element doesn’t exist in the array, it returns -1. In this post, we’ll cover the basics of indexOf() with an easy-to-understand example.

Syntax of indexOf()

The indexOf() method takes two parameters:

array.indexOf(searchElement, fromIndex)

searchElement: The value you’re looking for in the array.
fromIndex (optional): The index from which to start the search. By default, it starts at index 0.

Basic Example: Finding the Index of a Value in an Array

Let’s start with a simple example where we use indexOf() to find the position of a specific number in an array.

const numbers = [1, 3, 5, 7, 9];

const index = numbers.indexOf(5);

console.log(index); // Output: 2

Explanation:

• Original array: We have an array of numbers [1, 3, 5, 7, 9].
• searchElement: We’re searching for the number 5.
• Result: The indexOf() method returns 2, as 5 is located at index 2 in the array.

Using indexOf() with Strings

The indexOf() method works not only with numbers but also with strings. Here’s an example where we search for a string within an array of colors.

const colors = ['red', 'blue', 'green', 'yellow'];

const index = colors.indexOf('green');

console.log(index); // Output: 2

Explanation:

• Original array: We have an array of colors ['red', 'blue', 'green', 'yellow'].
• searchElement: We’re searching for the string 'green'.
• Result: The indexOf() method returns 2, as 'green' is located at index 2 in the array.

Example with fromIndex Parameter

If you want to start searching from a specific index, you can use the optional fromIndex parameter. Let’s say we want to find the index of 7 but want to start searching from index 3.

const numbers = [1, 3, 5, 7, 9, 7];

const index = numbers.indexOf(7, 4);

console.log(index); // Output: 5

Explanation:

• fromIndex: We start our search from index 4 instead of 0.
• Result: The indexOf() method returns 5, as 7 appears again at index 5 after index 4.

Handling Values Not Found in the Array

If the element you’re looking for doesn’t exist in the array, indexOf() will return -1. This can be useful for conditional checks.

const fruits = ['apple', 'banana', 'mango'];

const index = fruits.indexOf('orange');

console.log(index); // Output: -1

Explanation:

• Non-existent value: Since 'orange' is not in the array, indexOf() returns -1.

Conclusion

The indexOf() method is a straightforward way to find the position of a specific element in an array. Here’s a quick summary:

• Returns Index: Finds the index of the first occurrence of the specified element.
• Returns -1 if Not Found: If the element doesn’t exist in the array, it returns -1.
• fromIndex Option: Allows you to set a starting point for the search.

By using indexOf(), you can easily locate elements in arrays, making it a handy method for JavaScript developers.

Happy Coding…

Subscribe to Youtube Channel