Как проверить массив на наличие элемента в JavaScript?

Массив - это тип данных, который может содержать несколько значений в одной переменной. Это будет отличным решением при наличии списка разных элементов, которые хотите хранить. Сортировка разных элементов также помогает при поиске. Знание основных операций массивов важно для улучшения ваших навыков программирования. Рассмотрим пример массива:

Пример

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

Довольно часто нам может понадобится проверить наличие элемента в массиве JavaScript. В этой статье мы расскажем о подобных методах.

Прежде всего мы ознакомимся с простым, но работающим решением. Нам понадобится указать оператор:

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');
	}
}

Как видите массив переходит из index 0 в array.length - 1 index. Он работает следующим образом: в условном операторе if мы проверяем, равен ли элемент в массиве значению элемента в поиске. Если это так, печатаем ‘Element found’.

Теперь укажем условный оператор for и переменную, чтобы указать найден ли элемент.

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');
}

Если элемент найден, значение flag будет изменен внутри условного оператора if, и именно таким образом мы можем сделать проверку на наличие элемента.

Теперь рассмотрим другой метод проверки, который сегодня часто используется. Этот метод называется includes().

Данный метод возвращает true, если массив содержит указанный элемент, а в противном случае - false:

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

Рассмотрим другой пример:

Пример

<!DOCTYPE html>
<html>
  <body>
    <h1>Array includes()</h1>
    <p>Проверьте, содержит ли массив "Daisy":</p>
    <p id="demo"></p>
    <p><strong>Note:</strong> Метод includes не поддерживается в  Edge 13 (и более старых версиях).</p>
    <script>
      var fruits = ["Rose", "Daisy", "Lily", "Jasmine"];
      var n = flowers.includes("Daisy");
      
      document.getElementById("demo").innerHTML = n;
      
    </script>
  </body>
</html>
Метод includes() чувствителен к регистру.

Есть еще один полезный метод. Метод indexOf method используется, чтобы найти индекс элемента массива. Он указывает, содержит ли массив указанный элемент. Если указанный элемент найден в методе JavaScript indexOf, он возвращает номер индекса данного элемента. Если элемент не найден, indexOf возвращает значение -1. Код будет иметь такой вид:

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

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

Эти два метода имеют два параметра: element и start.

Параметр Описание
element Необходимый параметр. Элемент, который хотим найти.
start Дополнительный параметр. По умолчанию - 0. Указывает, с какой позиции в массиве начать поиск.