ES2016 Specifications included the includes()
method for Array data structure. The includes()
method check if an array includes a certain element, returning true
or false
as appropriate.
But in ES5 we are used to performing operations like this with indexOf()
method.
Using includes()
method.
const array = [1,2,3,4,5,6];
if(array.includes(4) ){
console.log("true 4 was found in the array")// true 4 was found in the array
}
Let's perform the same operation with indexOf()
method.
const array = [1,2,3,4,5,6];
if(array.indexOf(4) > -1 ){
console.log("true 4 was found in the array")// true 4 was found in the array
}
Using includes()
method to check for NaN
 const array = [NaN];
if (array.includes(NaN)){
console.log("true. NAN was found in the array");// true. NAN was found in the array
}
This is where things begin to fall apart with indexOf()
method.
const array = [NaN];
if (array.indexOf(NaN) == -1){
console.log("NaN not found in the array");//NaN not found in the array
}
Checking for undefined
with the includes()
method.
const array = [, , , ,];
if(array.includes(undefined)){
console.log("true array elements are undefined");// true array elements are undefined
}
Let's see how indexOf()
method will handle this operation.
const array = [, , , ,];
if(!array.indexOf(undefined) == -1 ){
console.log("true. array elements are undefined");
}else {
console.log("Sorry can't find undefined");// Sorry can't find undefined
}
The includes()
method does not distinguish between -0 and +0
const a = [-0].includes(+0);
console.log(a);//true
Typed Arrays will also have a method includes()
let array = Uint8Array.of(2,6,4);
console.log(array.includes(4));//true
Summary
- The includes method finds NaN and undefined whereas the indexOf method doesn't.
- The includes() method does not distinguish between -0 and +0(This is not a bug, but clearly how javascript works. Check javascript Number type)
- Read more from MDN about Array.prototype.includes()
Top comments (9)
Nice article.
I have one correction for you.
The line:
if(array.indexOf(4) >= -1 )
Needs to be:
if(array.indexOf(4) > -1 )
In order to check, whether an element is in the array. Otherwise the condition would always be true.
Yeah. indexOf() always return -1 if element is not found. Thanks Jonas
I'm wondering about performance. Meaning if
includes
orindexOf
keep searching the array even though already found the element. MDN docs doesn't say ifincludes
breaks the search once finds an element.developer.mozilla.org/en-US/docs/W...
You forgot to mention one of the main differences between
includes()
andindexOf()
.IE does not support
includes()
whereas it supports the other.I think IE11 started supporting
Array.prototype.includes
. Exact version that I'm using is11.904.16299.0
Yeah. Very true.
Thanks
Uhm in all honesty isn't +0 exactly the same as -0? So is there any real life need to distinguish between +0 and -0?
includes looks interesting, thank you for your post.
I'm glad this helped!