How to Check if an Element is Present in an Array in JavaScript?

An array is a data type, which can hold multiple values in a single variable. It is an excellent solution if you have a list of different items and you want to store them. By sorting different elements, it also helps perform searching. Knowing basic array operations is essential to improve your programming skills.

How to Create an Array

The following is an example of JavaScript Array. An array holds more than one value under a single name. Spaces and line breaks are not important while creating an array.

Example

<!DOCTYPE html>
<html>
  <body>
    <h2>JavaScript Arrays</h2>
    <p id="demo"></p>
    <script>
      var flowers = ["rose", "daisy", "lily"];
      document.getElementById("demo").innerHTML = flowers;
    </script>
  </body>
</html>

Very often we need to check whether the element is in an array in JavaScript or not. In this snippet, we are going to learn some methods to do that.

Firstly we’ll have a look at a simple but working solution. We must define statements if element is present in the array, like this:

var array = [11, 20, 8, 6, 17];

var el = 6; //Element to be searched

for(var i=0; i<array.length; i++) {
	if(el === array[i]) {
		console.log('Element Found');
	}
}

As you can see, the array is traversed from index 0 to array.length - 1 index and notice only less than operator (<) and not less than equal to (<=). It works like this: in the if condition we check if an element in the array is equal to the value of the element to be searched. If it is, print "Element found".

Now we will define for conditions and take a variable for telling if an element found.

var array = [11, 20, 8, 6, 17];

var el = 6; //Element to be searched
var flag = 0;  // Initially 0 - Not found

for(var i=0; i<array.length; i++) {
    if(el === array[i]) {
         flag = 1;
    }
}

//Check if flag value changed.
if(flag == 1) {
   console.log('Element Found');
} else { 
   console.log('Element Not Found');
}

If the element found, the flag value will change inside the if condition and that’s how we can check whether it is present or not.

Now let’s consider another method of checking if the element is present in the array or not. It's the includes() method, which is now commonly used.

This method returns true if the array contains the specified element, and false if not, like this:

var array = [11, 20, 8, 6, 17];
console.log( array.includes(6) ); //True

Let’s see another example:

Example

<!DOCTYPE html>
<html>
  <body>
    <h1>Array includes()</h1>
    <p>Check if the flower array contains "Daisy":</p>
    <p id="demo"></p>
    <p><strong>Note:</strong> The includes method is not supported in Edge 13 (and earlier versions).</p>
    <script>
      var flowers = ["Rose", "Daisy", "Lily", "Jasmine"];
      var n = flowers.includes("Daisy");
      
      document.getElementById("demo").innerHTML = n;
      
    </script>
  </body>
</html>
Note that includes() method is case sensitive.

There exists one more method that can be useful. The indexOf method is used to search the index of an array element. It tells whether the array contains the given element or not. If the given element in JavaScript indexOf method found, it will return the index number of that element. If not, the indexOf returns the -1 value.

Here is how the code looks like:

var myArray = ["Rose", "Lily", "Daisy", "Jasmine"];

if (myArray.indexOf(searchTerm) === -1) {
 console.log("element doesn't exist");
}
else {
 console.log("element found");
}

These two methods have two parameters: element and start. Let’s check them out:

Parameter Description
element Required. The element to search for
start Optional. Default 0. At which position in the array to start the search

Do you find this helpful?

Related articles