Enter
    Расширенный поиск
    Клавиша / esc

    JavaScript

    .indexOf()

    Ищет вхождение элемента в массив или подстроки в строку и возвращает индекс.

    Время чтения: меньше 5 мин

    Кратко

    Скопировано

    Этот метод служит для поиска. Он определён для массивов и строк.

    При вызове нужно передать, что искать. Вернётся индекс первого найденного элемента или -1, если ничего не нашлось.

    Как пишется

    Скопировано

    Искомый элемент передаётся первым аргументом — array1.indexOf('иголка')

            
          
          const example = ['чебурашка', 'гена', 'шапокляк', 'лариска']console.log(example.indexOf('гена'))// 1
          const example = ['чебурашка', 'гена', 'шапокляк', 'лариска']

console.log(example.indexOf('гена'))
// 1

    Как понять

    Скопировано

    Для массивов: ищет переданный элемент в массиве. Если элемент один, то возвращает индекс этого элемента. Если элементов много — возвращает индекс первого подходящего элемента. Элемента в массиве нет — вернёт -1

            
          
          const haystack = ['Петя', 'Настя', 'Артур', 'Лена', 'Настя']console.log(haystack.indexOf('Лена'))// 3console.log(haystack.indexOf('Настя'))// 1console.log(haystack.indexOf('Эдуард Аркадьевич'))// -1
          const haystack = ['Петя', 'Настя', 'Артур', 'Лена', 'Настя']

console.log(haystack.indexOf('Лена'))
// 3
console.log(haystack.indexOf('Настя'))
// 1
console.log(haystack.indexOf('Эдуард Аркадьевич'))
// -1

    Для строк: работает так же, как с массивами, но можно искать не только буквы в строке, но и подстроки. Например:

            
          
          const haystack = 'Мама мыла раму'console.log(haystack.indexOf('а'))// 1console.log(haystack.indexOf('мыла'))// 5console.log(haystack.indexOf('ё'))// -1
          const haystack = 'Мама мыла раму'

console.log(haystack.indexOf('а'))
// 1

console.log(haystack.indexOf('мыла'))
// 5

console.log(haystack.indexOf('ё'))
// -1

    На практике

    Скопировано

    Николай Лопин советует

    Скопировано

    Найти индексы всех подходящих элементов

    Скопировано

    Чтобы найти индексы всех искомых элементов, используют второй аргумент. Он указывает, с какого места начинать поиск. Таким образом можно проигнорировать те элементы, которые уже нашли, и начинать поиск сразу после них:

            
          
          const haystack = 'мама мыла раму'let lastResult// Напечатаем индексы всех «м» во фразеwhile (lastResult !== -1) {  lastResult = haystack.indexOf('м', lastResult + 1)  if (lastResult !== -1) {    console.log(lastResult)  }}
          const haystack = 'мама мыла раму'
let lastResult

// Напечатаем индексы всех «м» во фразе
while (lastResult !== -1) {
  lastResult = haystack.indexOf('м', lastResult + 1)
  if (lastResult !== -1) {
    console.log(lastResult)
  }
}

    indexOf() или includes()

    Скопировано

    Не используйте indexOf() для проверки вхождения элемента в массив или строку. Для этого есть метод includes().

    Раньше методом indexOf() часто проверяли, есть ли элемент в массиве. Эта задача проще, индекс здесь не нужен, но других методов для этого не было. Поэтому в старых скриптах можно увидеть такой код:

            
          
          const guestList = ['Петя', 'Настя', 'Артур', 'Лена', 'Настя', 'Эммануил']const guest = // Получаем откуда-нибудь имя гостяif (guestList.indexOf(guest) >= 0) {  // Пускаем на вечеринку} else {  // Отправляем домой}
          const guestList = ['Петя', 'Настя', 'Артур', 'Лена', 'Настя', 'Эммануил']
const guest = // Получаем откуда-нибудь имя гостя

if (guestList.indexOf(guest) >= 0) {
  // Пускаем на вечеринку
} else {
  // Отправляем домой
}

    🤖 Из-за того, что indexOf() возвращает индекс, в условии обязательно нужна проверка >= 0 или !== -1. Если так не сделать, появится неприятный баг: мы будем пускать на вечеринку всех, кроме первого гостя в списке.

    Дело в том, что JavaScript интерпретирует ненулевые числа как истину (true), и будет запускать первую ветку if. На первом госте indexOf() вернёт 0, что считается ложным (false), и наш скрипт не пустит человека на вечеринку.

    Читайте также