Разница между indexOf и функцией findIndex массива

127

Меня смущает разница между двумя функциями indexOf и поиском индекса в массиве.

В документации говорится

findIndex - возвращает индекс первого элемента в массиве, где предикат истинен, и -1 в противном случае.

и

indexOf - возвращает индекс первого вхождения значения в массив.

Рахул Сингх
источник
4
Я думаю, разница в том, что в качестве аргумента принимается функция (позволяющая выполнять более сложные поиски, например, если вы искали первое вхождение значения с определенной подстрокой, а не только целиком), вы просто берете значение, которое вы ' повторно ищем. На самом деле это неплохой вопрос. Голосование против без объяснения причин должно отменяться.
Тим
Иногда лучше начать со спецификации языка (например, ECMA-262) и заполнить пробелы другим материалом: Array.prototype.indexOf (searchElement [, fromIndex]) vs Array.prototype.findIndex (predicate [, thisArg]) .
RobG 03
Спасибо, Тим и РобГ
Рахул Сингх

Ответы:

196

Основное отличие - параметры этих функций:

  • Array.prototype.indexOf()ожидает значение в качестве первого параметра. Это делает его хорошим выбором для поиска индекса в массивах примитивных типов (таких как строка, число или логическое значение).

  • Array.prototype.findIndex()ожидает обратного вызова в качестве первого параметра. Используйте это, если вам нужен индекс в массивах с непримитивными типами (например, объекты) или ваше условие поиска более сложное, чем просто значение.

По ссылкам приведены примеры обоих случаев.

ул
источник
5
Если кому-то интересно, какие примитивные типы являются js, это такие вещи, как string, number, boolean.
Джон Ли
3
Учтите, что indexOfбудет работать поиск предметов. Важно понимать, что он принимает один объект, а не только значение, и сравнивает по равенству, а не по значению. Согласно документам Mozilla: indexOf() compares searchElement to elements of the Array using strict equality (the same method used by the === or triple-equals operator). пожалуйста, измените findIndexобъяснение, включив в него только ветвь «или ваше условие поиска более сложное, чем просто одно значение или ссылка», чтобы исправить это, поскольку оно изначально сбивало меня с пути. Спасибо!
brokenalarms
2
@brokenalarms Это правда, но только если у вас есть ссылка на реальный объект в массиве. Например, [{a:1}].indexOf({a:1})возвращается, -1хотя объект кажется таким же (но это не так). Не уверен, что эта информация полезна для ответа, так как она может сбивать с толку. Если вам нужно узнать больше о точном поведении языка, вы должны прочитать спецификацию.
str
Кроме того, indexOf () сравнивает searchElement с элементами массива, используя строгое равенство (тот же метод, что и для оператора === или тройного равенства).
immirza
Однако стоит отметить, что .indexOf(NaN)он всегда будет возвращаться, -1потому что NaN==NaNвсегда false. NaN является примитивным типом, потому что typeof NaNесть, numberи так есть, nullи undefinedпоэтому я бы исправил это, чтобы не говорить, что indexOfработает с примитивными типами
Мэтью
13

FindIndex полезен, если вы хотите найти первый элемент, соответствующий вашему предикату: в примере W3C есть числа и совпадения, если возраст клиента выше или равен 18.

var ages = [3, 10, 18, 20];

function checkAdult(age) {
    return age >= 18;
}

console.log(ages.findIndex(checkAdult));

приставка:

2

Вы можете найти точный индекс элемента с помощью функции indexOf для Array, но вы не можете передать предикат. Это быстрее, если вы хотите найти определенный элемент:

var ages = [3, 10, 18, 20];
console.log(ages.indexOf(10));

возвращает:

1

Подсчет индекса начинается с 0, поэтому индекс первого элемента равен 0.

Даниэль Кис
источник
4

Основное отличие - параметры этих функций:

-> Array.prototype.indexOf () :

   var fruits = ["Banana", "Orange", "Apple", "Mango"];
   var a = fruits.indexOf("Apple");
   The result of a will be: 2

-> Array.prototype.findIndex () :

       var ages = [3, 10, 18, 20];

       function checkAdult(age) {
        return age >= 18;
       }

       function myFunction() {
         document.getElementById("demo").innerHTML = 
         ages.findIndex(checkAdult);
       }

       The result will be: 2
ashishdudhat
источник
4

Вы также можете использовать includes:

[1, 2, 3].includes(2);      // true
[1, 2, 3].includes(4);      // false
[1, 2, 3].includes(3, 3);   // false

но я предпочитаю indexOfметод:

var vals = [ "foo", "bar", 42, "baz" ];
if (~vals.indexOf( 42 )) {
  // found it!
}
zloctb
источник
1
также включает в себя требует полифилла для IE
MJB
indexOfтоже намного быстрее.
eozzy
4

Другое отличие состоит в том, что с помощью findIndex () пользователь может применить некоторую функцию и найти элемент в массиве, который проходит проверку.

Но то же самое с оператором indexOf () . Пользователь может просто проверить, существует ли конкретный элемент в массиве или нет.

Алок Ранджан
источник
4

Просто - какую структуру массива вы используете?

  • Если массив объектов, findIndex() ,;
  • В противном случае indexOf().

«Я хочу найти индекс в массиве объектов с ключом« Оранжевый ».

let fruits = [
   { type: "Apple", quantity: 9 },
   { type: "Banana", quantity: 2},
   { type: "Orange", quantity: 8},
   { type: "Pear", quantity: 777}
];

let myIndex = fruits.findIndex(fruit => fruit.type === "Orange"); // Returns 2.

«Я хочу найти индекс в простом массиве ».

let fruits = [ "Apple", "Banana", "Pear", "Orange"];

let index = fruits.indexOf("Orange"); // Returns 3.
daCoda
источник
0

Вы можете попробовать коды ниже: -

let city = ['Delhi', 'mumbai']
const a = city.findIndex((item) => 
item.toLowerCase()==='delhi')
console.log(a) // returns 0

let c = city.indexOf('mumbai') // returns 1
console.log(c)
Гулсан Борбхуия
источник
Я не думаю, что этот код требует каких-либо объяснений, потому что этот код выглядит очень простым и легким для понимания «новичком». Кроме того, начинающие люди сталкиваются с трудностями при понимании сложного кода, поэтому я сделал его простым. Поэтому, пожалуйста, не говорите о низком качестве, не понимая моих намерений.
Гулсан Борбхуйя,
Я не нашел ничего низкого качества, отмеченного системой.
Гулсан Борбхуйя,