Understanding JavaScript Array Series XIII - Array Loops & Iteration Part X

#javascript #webdev #beginners

In the previous article, I talked about iterating over arrays using the Array.findIndex() array method. You can check it out below:

Understanding Javascript Array Series XII - Array Loops & Iteration Part IX

Nedy Udombat ・ Oct 14 '19 ・ 3 min read

#javascript #webdev #beginners

Today, I will talk about using Array.indexOf() to iterate over arrays.

Array.indexOf()

This method searches the array for a specified element and returns the position, if this element does not exist it returns -1. Let's assume your class teachers asks you to go into the class and look for a certain student called Naza. You go into the class as see Naza sitting by right corner of the class close to the window, and you go ahead to tell your teacher the position in which she is sitting. This is exactly the same way array.indexOf() behaves. It searches for the element in the array and returns the position in which it found that element.

// syntax
arr.indexOf(element, startIndex);

[element]: This is the element that will searched for in the array.

[startIndex]: This is the position(index) of the array to begin the search from. If this value is not supplied it defaults to 0.

Let's take a look at some instances where we find the indexOf nedy in this array ['soji', 'nedy', 'naza', 'chukwudi', 'lii']:

const names = ['soji', 'nedy', 'naza', 'chukwudi', 'lii'];
console.log(names.indexOf('nedy')) // 1

In this scenario the startIndex is not provided so it defaults to zero and the search starts from the beginning of the array

What if we provide a start value that is not 0?

const names = ['soji', 'nedy', 'naza', 'chukwudi', 'lii'];
console.log(names.indexOf('nedy', 2)) // -1
console.log(names.indexOf('naza', 2)) // 2

At position(index) 2 of the array we have naza, when we begin searching the array for nedy at that point we will not find it hence it returns -1. When we begin searching for Naza at that point it is the first item there so it returns the appropriate index.

What if the startIndex is equal to or greater than the length of the array?

const names = ['soji', 'nedy', 'naza', 'chukwudi', 'lii'];

console.log(names.indexOf('nedy', 7)) // -1
console.log(names.indexOf('nedy', 5)) // -1

The method returns -1 because the array will not be searched.

What happens when we pass a negative value as the startIndex?

const names = ['soji', 'nedy', 'naza', 'chukwudi', 'lii'];

console.log(names.indexOf('nedy', -2)) // -1
console.log(names.indexOf('nedy', -4)) // 1

Weird right? When the negative startIndex is passed as argument, the array begins it search from arr.length + (startIndex). In this case the search begins at 5 + (-2) which is equal to 3. Index 3 is chukwudi and at this point nedy can no longer be found in the array.
In the second case the search will start from 5 + (-4) which is equal to 1. At this point we can find nedy at index 1 so the index is returned.

What if we want to find the last position of nedy in this array ['soji', 'nedy', 'naza', 'chukwudi', 'lii', 'nedy']? What do we do 🤔?
Do you know the answer? please do well to tell us in the comment section and share some code snippet of how it can be achieved.

Follow me here @nedyudombat to get the solution to that question in the next part of my series publishing tomorrow.

Here is the link to the other articles on this Array series written by me: