Understanding JavaScript Array Series XV - Array Loops & Iteration Part XII

In the last two articles, I talked about iterating over arrays using the Array.indexOf() and the Array.lastIndexOf() array method. You can check it out below:

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

Nedy Udombat ・ Oct 15 '19 ・ 3 min read

#javascript #webdev #beginners

Understanding JavaScript Array Series XIV - Array Loops & Iteration Part XI

Nedy Udombat ・ Oct 16 '19 ・ 3 min read

#javascript #webdev #beginners

The Array.indexOf() and the Array.lastIndexOf() both return the index when the element being searched for exists in the array and the -1 if it doesn't. What if we want it to return a boolean? 🤔 That returns true when the element we are searching for exists and false when it doesn't? Well you are in luck, today we will discuss the Array.includes() method.

Array.includes()

This method checks for a particular element in an array, if the element is found it returns true else it returns false.

It's syntax is similar to that of the Array.indexOf(), save for some differences:

// syntax
arr.includes(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. If the provided index is negative starts the search from arr.length + (startIndex).

Some Examples:

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

console.log(names.includes('nedy')) // true
console.log(names.includes('nedy', 6)) // false

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

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

console.log(names.includes('nedy', 6)) // false
console.log(names.includes('nedy', 30)) // false

In this scenario the array is not searched.

What happens if the calculated startIndex is less than 0?

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

console.log(names.includes('nedy', -30)) // true
console.log(names.includes('nedy', -8)) // false

In the first scenario, the calculated startIndex will be 6 + (-30) which is -24 it returns true, but in the second scenario where the calculated index is 6 + (-8) which is -2 it returns true. This is because for Array.includes() if the calculated startIndex is less than or equal to -1 * arr.length(which is -6 in this case), the entire array will be searched. In this situation, the first scenario -24 is less than -6 so the array will be searched, but in the second scenario -2 is greater than -6, hence, the array will not be searched.

What happens if Nedy or neDy is being searched for?

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

console.log(names.includes('Nedy',)) // false
console.log(names.includes('neDy', 3)) // false

The reason is simple Array.includes() is case sensitive.

Conclusion

Array.includes() should be used when you want to check if an element is present in an array. If you want to check for the position of the element in an array you can use Array.indexOf(), I wrote about it here

That's all for today, tomorrow we will talk about another set of functions used in array Iteration.

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

• What is an Array?
• Alternate ways of Creating an Array.
• Array Properties
• Array Loops & Iteration Part I
• Array Loops & Iteration Part VII (find())
• Array Loops & Iteration Part VIII (findIndex())

Got any question, addition or correction? Please leave a comment.

Thank you for reading. 👍