Różnica między funkcją indexOf i findIndex tablicy

125

Jestem zdezorientowany między różnicą między dwiema funkcjami indexOf i znalezieniem indeksu w tablicy.

Dokumentacja mówi

findIndex - zwraca indeks pierwszego elementu w tablicy, w której predykat ma wartość true, a wartość -1 w innym przypadku.

i

indexOf - zwraca indeks pierwszego wystąpienia wartości w tablicy.

Rahul Singh
źródło
4
Myślę, że różnica polega na tym, że jeden przyjmuje funkcję jako argument (umożliwiając bardziej wyszukane znalezienia, na przykład, że szukałeś pierwszego wystąpienia wartości z określonym podciągiem zamiast tylko całej wartości), po prostu bierze wartość, którą Ty szukasz. Właściwie to nie jest złe pytanie. Głosy przeciw bez wyjaśnienia powinny podlegać głosowaniu przeciw.
Tim Consolazio,
Czasami najlepiej jest zacząć od specyfikacji języka (np. ECMA-262) i uzupełnić luki innym materiałem: Array.prototype.indexOf (searchElement [, fromIndex]) vs Array.prototype.findIndex (predicate [, thisArg]) .
RobG,
Dzięki Tim i RobG
Rahul Singh

Odpowiedzi:

195

Główną różnicą są parametry tych funkcji:

  • Array.prototype.indexOf()oczekuje wartości jako pierwszego parametru. To sprawia, że ​​dobrym wyborem jest znalezienie indeksu w tablicach typów pierwotnych (takich jak string, number lub boolean).

  • Array.prototype.findIndex()oczekuje wywołania zwrotnego jako pierwszego parametru. Użyj tego, jeśli potrzebujesz indeksu w tablicach z typami innymi niż prymitywne (np. Obiekty) lub warunek wyszukiwania jest bardziej złożony niż tylko wartość.

Zobacz linki do przykładów obu przypadków.

str
źródło
5
Jeśli ktoś się zastanawia, jakie typy pierwotne to js, ​​są to rzeczy takie jak string, number, boolean.
John Lee,
3
Pamiętaj, że indexOfbędzie działać, aby znaleźć obiekty. Ważne jest, aby uzyskać rozróżnienie, że akceptuje pojedynczy obiekt, a nie tylko wartość, i porównuje według równości, a nie wartości. Per Mozilla docs: indexOf() compares searchElement to elements of the Array using strict equality (the same method used by the === or triple-equals operator). Proszę zmienić findIndexwyjaśnienie, aby zawierało tylko „lub twój warunek znalezienia jest bardziej złożony niż tylko pojedyncza wartość lub odniesienie”, aby poprawić to, ponieważ pierwotnie sprowadziło mnie na manowce. Dzięki!
brokenalarms
2
@brokenalarms To prawda, ale tylko wtedy, gdy masz odniesienie do rzeczywistego obiektu w tablicy. Na przykład [{a:1}].indexOf({a:1})zwraca, -1chociaż obiekt wydaje się być taki sam (ale tak nie jest). Nie jestem pewien, czy te informacje są pomocne w udzieleniu odpowiedzi, ponieważ mogą być mylące. Jeśli chcesz dowiedzieć się więcej na temat dokładnego zachowania języka, przeczytaj specyfikację.
str.
Ponadto funkcja indexOf () porównuje searchElement z elementami tablicy przy użyciu ścisłej równości (ta sama metoda jest używana przez operator === lub potrójne równe).
immirza
Warto jednak zauważyć, że .indexOf(NaN)zawsze wróci, -1ponieważ NaN==NaNzawsze false. NaN jest prymitywny typ bo typeof NaNto numberi tak są nulli undefinedtak chciałbym zmienić to, aby uniknąć mówiąc indexOfprace na prymitywnych typów
Mt
13

FindIndex jest przydatny, jeśli chcesz znaleźć pierwszy element, który pasuje do twojego predykatu: w przykładzie W3C są liczby i dopasowania, jeśli wiek klienta jest wyższy lub równy 18.

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

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

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

konsola:

2

Możesz znaleźć dokładny indeks elementu za pomocą funkcji indexOf Array, ale nie możesz przekazać predykatu. Szybciej jest, jeśli chcesz znaleźć określony element:

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

zwroty:

1

Zliczanie indeksów zaczyna się od 0, więc indeks pierwszego elementu to 0.

Dániel Kis
źródło
4

Główną różnicą są parametry tych funkcji:

-> 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
źródło
4

Możesz również użyć includes:

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

ale wolę indexOfmetodę:

var vals = [ "foo", "bar", 42, "baz" ];
if (~vals.indexOf( 42 )) {
  // found it!
}
zloctb
źródło
1
zawiera również wymaga wypełnienia dla IE
MJB
indexOfjest również znacznie szybszy.
eozzy
4

Inną różnicą jest to, że dzięki funkcji findIndex () użytkownik może zastosować jakąś funkcję i znaleźć element w tablicy, który przejdzie test.

Ale to samo nie jest prawdą z operatorem indexOf () . Użytkownik może po prostu sprawdzić, czy dany element istnieje w tablicy, czy nie.

Alok Ranjan
źródło
4

Prosty - jakiego rodzaju struktury tablicy używasz?

  • Jeśli tablica obiektów findIndex(),;
  • Indziej indexOf().

„Chcę znaleźć indeks w tablicy obiektów z kluczem„ Pomarańczowy ”.

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.

„Chcę znaleźć indeks w prostej tablicy ”.

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

let index = fruits.indexOf("Orange"); // Returns 3.
daCoda
źródło
0

Możesz wypróbować poniższe kody: -

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)
Gulsan Borbhuiya
źródło
Nie sądzę, aby ten kod wymagał żadnych wyjaśnień, ponieważ wygląda na bardzo prosty i łatwy do zrozumienia dla „początkującego”. Poza tym początkujący mają trudności ze zrozumieniem złożonego kodu, więc uprościłem to. Więc proszę, nie mów, że jest to niska jakość bez zrozumienia moich zamiarów.
Gulsan Borbhuiya
Nie znalazłem nic niskiej jakości oznaczonych przez system.
Gulsan Borbhuiya