Array.indexOf() в JavaScript — позиція елемента в масиві

Опис

Метод indexOf() пропонує простий спосіб визначення позиції елемента в масиві. Він порівнює searchElement з елементами масиву, використовуючи строгий принцип рівності — такий самий, як і у оператора ===. Цікаво, що значення NaN при такому порівнянні завжди вважається нерівним будь-якому іншому значенню, навіть самому собі. Отже, при спробі знайти NaN метод indexOf() завжди поверне -1.

Основна робота методу полягає в тому, що він повертає індекс першого входження searchElement у масив, або -1, якщо такого елемента немає. Таким чином, легко визначити, чи містить масив певний елемент, порівнюючи результат indexOf() з -1.

Приклад:

let fruits = ["apple", "banana", "cherry"];
let index = fruits.indexOf("banana");
console.log(index); // 1

У цьому прикладі ми шукаємо індекс елемента banana в масиві fruits. Метод indexOf() повертає значення 1, оскільки banana є другим елементом масиву (індексація починається з 0).

правити

Загальний опис

правити

Нотатка

Метод indexOf() приймає другий необов'язковий параметр fromIndex, який визначає початкову позицію для пошуку. Якщо цей параметр не вказано, пошук автоматично почнеться з нульового індексу. Якщо вам потрібно розпочати пошук, скажімо, з третьої позиції, ви можете використовувати наступний синтаксис: myArray.indexOf('apple', 2).

автор: Bond правити

Нотатка

Важливо пам'ятати, що indexOf() використовує строгу рівність (===) для порівняння елементів. Це означає, що він порівнює значення елементів за типом та значенням. Для ілюстрації: якщо у вашому масиві є елемент з числовим значенням 5, запит myArray.indexOf('5') поверне результат -1, адже хоча числове 5 та рядкове '5' можуть виглядати однаково, вони є різними типами даних.

автор: Bond правити

Нотатка

Важливо пам'ятати, що indexOf() порівнює елементи за їхніми значеннями, а не за їхніми посиланнями. Тому, наприклад, при пошуку об'єкта в масиві об'єктів, indexOf() не зможе знайти об'єкт, навіть якщо його вміст ідентичний шуканому, якщо вони є різними об'єктами в пам'яті.

автор: Bond правити

Нотатка

Зверніть увагу на те, що при великих масивах або частих операціях пошуку може бути ефективніше використовувати структури даних, які спеціально розроблені для цих цілей, такі як хеш-таблиці або дерева пошуку.

автор: Bond правити

Нотатка

indexOf() є універсальним методом, що вимагає наявності властивості length та інших властивостей з цілочисельними ключами в this.

автор: Bond правити

Нотатка

Зверніть увагу, що indexOf() ігнорує порожні слоти в розріджених масивах.

автор: Bond правити

+ додати пораду чи нотатку

Синтаксис

indexOf(searchElement)
indexOf(searchElement, fromIndex)

Параметри

searchElement

Елемент, який потрібно знайти в масиві.

автор: Bond

правити

fromIndex

Індекс, з якого почати пошук, перетворений у ціле число.

• Від'ємний індекс рахується з кінця масиву - якщо fromIndex < 0, використовується fromIndex + array.length. Зверніть увагу, що в цьому випадку масив все ще проглядається з переду назад.
• Якщо fromIndex < -array.length або fromIndex пропущено, використовується 0, що спричинює пошук по всьому масиву.
• Якщо fromIndex >= array.length, масив не проглядається, і повертається -1.

автор: Bond

правити

Повернення

integer

Індекс першого елемента (який дорівнює searchElement) в масиві. Повертає -1, якщо елемент не знайдено.

автор: Bond

правити

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі Серверні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
	1	1.5	3	9.5	12	9

Підтримка: мобільні переглядачі

Переглядач
	4.4	18	4	1

Підтримка: серверні переглядачі

Переглядач
	0.10.0	1.0

Приклади

+ запропонувати свій приклад у пісочниці

const arrayLike = {
  length: 3,
  0: 2,
  1: 3,
  2: 4,
  3: 5, // ігнорується indexOf(), оскільки length дорівнює 3
};
console.log(Array.prototype.indexOf.call(arrayLike, 2));
// 0
console.log(Array.prototype.indexOf.call(arrayLike, 5));
// -1

<header>
  <h2 class="title">Пошук індексу елемента в масиві</h2>
  <p class="description">У цьому прикладі ми використовуємо метод indexOf() для пошуку індексу певного елемента в масиві.</p>
</header>
<main>
  <pre>const beasts = ['ant', 'bison', 'camel', 'duck', 'bison'];</pre>
  <div id="output"></div>
</main>

body {
  font-size: 16px;
  line-height: 1.5;
  font-family: monospace;
}

pre {
  color: #ff0000;
}

header {
  background-color: #f1f1f1;
  margin-bottom: 25px;
  padding: 15px;
  box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
}

header h2.title {
  padding-bottom: 15px;
  border-bottom: 1px solid #999;
}

header p.description {
  font-style: italic;
  color: #222;
}

main {
  margin-top: 20px;
}

#output {
  font-weight: bold;
}

const beasts = ['ant', 'bison', 'camel', 'duck', 'bison'];

const output = document.getElementById('output');

output.innerHTML += `Індекс елемента "bison": ${beasts.indexOf('bison')}<br>`;
// Очікуваний результат: 1

output.innerHTML += `Індекс елемента "bison" починаючи з індексу 2: ${beasts.indexOf('bison', 2)}<br>`;
// Очікуваний результат: 4

output.innerHTML += `Індекс елемента "giraffe": ${beasts.indexOf('giraffe')}<br>`;
// Очікуваний результат: -1
//# sourceURL=pen.js

const fruits = ['яблуко', 'банан', 'слива'];

console.log("indexOf('банан'):", fruits.indexOf('банан'));  // 1
console.log("indexOf('кавун'):", fruits.indexOf('кавун'));  // -1

// перевірка через if ламається двічі
if (fruits.indexOf('яблуко')) console.log('якби if працював, тут було б «є яблуко»');
if (fruits.indexOf('кавун')) console.log('а замість цього спрацювало «є кавун» — бо -1 істинне');

// як треба
console.log("!== -1 для 'кавун':", fruits.indexOf('кавун') !== -1);  // false
console.log("includes('яблуко'):", fruits.includes('яблуко'));       // true

// строге порівняння: об'єкти за посиланням, NaN не знаходиться
const users = [{ id: 1 }, { id: 2 }];
console.log('indexOf об\'єкта:', users.indexOf({ id: 2 }));           // -1
console.log('findIndex за полем:', users.findIndex(u => u.id === 2)); // 1
console.log('NaN:', [NaN].indexOf(NaN));                              // -1

console.log([1, , 3].indexOf(undefined)); // -1

const array = [2, 9, 9];
array.indexOf(2); // 0
array.indexOf(7); // -1
array.indexOf(9, 2); // 2
array.indexOf(2, -1); // -1
array.indexOf(2, -3); // 0

const indices = [];
const array = ["a", "b", "a", "c", "a", "d"];
const element = "a";
let idx = array.indexOf(element);
while (idx !== -1) {
  indices.push(idx);
  idx = array.indexOf(element, idx + 1);
}
console.log(indices);
// [0, 2, 4]