How To Check If An Array Contains an Item In JavaScript? – Detailed Guide

Arrays can be used to store multiple values in a variable. When you work with Arrays, you may require to check if an array contains an Item in Javascript.

You can check if an array contains an Item using array.includes("searchValue") in JavaScript.

Basic Example

    var birds = ["dove", "owl", "parrot", "finch", "cuckoos"];

    console.log(birds.includes("owl"));

Output

    true

This tutorial teaches you the different methods to check if an array contains an object in JavaScript and when it is appropriate to use each method

Check If An Array Contains an Item Using Array.includes()

The Array.includes() method checks if an array contains an item and returns True if it exists. Else, False.

Use this method when you want to check if an array contains an item and return the result as a boolean True or False.

Syntax

arr.includes(searchValue)

arr.includes(searchValue, fromIndex)

Code

The following code demonstrates how to check if an array contains a specific item using the includes() method.

    var birds = ["dove", "owl", "parrot", "finch", "cuckoos"];

    console.log(birds.includes("owl"));

Output

    true

Code

The following code demonstrates how to use the fromindex while using the includes() method.

    var birds = ["dove", "owl", "parrot", "finch", "cuckoos"];

    console.log(birds.includes("owl", 1));

Output

You can see the includes() is having two parameters, searchValue as “owl” and fromIndex as 1.

In this case, fromIndex is a positive number, so the search will start from the fromIndex position, which is the index position 1. SearchValue(“owl”) is present at position 1, so includes() returns true.

    true

Let’s see another example of fromIndex having passed with negative values.

Code

    var birds = ["dove", "owl", "parrot", "finch", "cuckoos"];

    console.log(birds.includes("owl", -1));

Output

The fromIndex is a negative value. In order to determine the first search position, array.includes() will calculate the arr.length(5) + fromIndex(-1) which is 4. The first search position will start at 4, as searchValue(“owl”) is present at index 1, .includes("owl", -1) will return false.

    false

The array.includes() uses the sameValueZero algorithm to identify whether the given element is found.

Check If An Array Contains an Item Using Array.indexOf()

The indexOf() method returns the first index position of the search item if it is present else returns -1.

Use this method when you want to check if an array contains a specific item and return its index value.

Code

The following code demonstrates how to use the indexOf() method to check if an item is available in the array.

    var birds = ["dove", "owl", "parrot", "finch", "cuckoos"];

    console.log(birds.indexOf("owl"));

Output

Here, indexOf() will return the index position(1), as the searchValue(“owl”) is present at index position 1.

    1

Let us see an example of fromIndex having passed with a positive value.

Code

    var birds = ["dove", "owl", "parrot", "finch", "cuckoos"];

    console.log(birds.indexOf("owl",3) );

Output

In this example, the result is false because indexOf("owl",3) is forced to start the search from the 3rd index position, and as the ‘owl’ value is present at index position 1, indexOf() concludes that value is not present in the array and returns -1.

-1

includes() vs indexOf()

This section explains the behaviour of includes() and indexOf() for different primitive types.

const symbol = Symbol('owl');

const array = [
  symbol, 
  0,
  200,
  null,
  undefined,
  'string'
];
array.includes()array.indexOf()
array.includes(symbol); // truearray.indexOf(symbol) !== -1; // true
array.includes(0); // truearray.indexOf(0) !== -1; // true
array.includes(200); // truearray.indexOf(200) !== -1; // true
array.includes(null); // truearray.indexOf(null) !== -1; // true
array.includes(undefined); // truearray.indexOf(undefined) !== -1; // true
array.includes(‘string’); // truearray.indexOf(‘string’) !== -1; // true

You can see both includes() and indexOf() behaviours are similar on the above primitive types.

But there is one type for which the results will be different.

const array = [NaN];
array.includes()array.indexOf()
array.includes(NaN) // truearray.indexOf(NaN) !== -1 // false

Check If An Array Contains an Item Using For Loop

This section teaches you how to use the forloop to iterate over an array and check if an item exists in the array.

This is the traditional way of accessing the items of the array.

It is not recommended to use this method considering the performance.

Code

The following code demonstrates how to use the for loop to iterate over the array and check if an item exists in the array.

    var birds = ["dove", "owl", "parrot", "finch", "cuckoos"];

    var len = birds.length;

    var searchValue = 'owl';

    for (var i=0; i<len ; i++){
        if(birds[i] == searchValue){
            console.log("true");
        }
    }

Output

    true

JSfiddle

This tutorial is available in this JSFiddle.

Additional Resources

Leave a Comment