JavaScript ist eine dynamische Programmiersprache, die sowohl auf der Client- als auch auf der Serverseite verwendet werden kann. JavaScript wird zum Erstellen interaktiver Webseiten verwendet. Es verfügt über viele Frameworks wie React JS, Angular JS, Node JS usw. JavaScript bietet einige Methoden, um den Index eines bestimmten Elements abzurufen. indexOf und findIndex sind diese Methoden.
indexOf-Funktion in JavaScript
Mit der indexOf-Funktion in JavaScript können wir nach einem Element in einem Array suchen und den ersten gefundenen Index in diesem Array zurückgeben. Wenn das Element nicht gefunden wird, wird -1 zurückgegeben. Die Syntax dieser Methode lautet wie folgt:
array.indexOf(element, index)
Nach dem Login kopieren
Hier ist Array die Liste der Elemente, die die indexOf-Methode ausführen sollen. Element stellt das zu durchsuchende Element dar und Index ist die Startposition des zu durchsuchenden Elements.
Beispiel
Betrachten wir eine Reihe von Monatsnamen. Wir werden die indexOf-Methode verwenden, um den Index des Monats „März“ zu finden
const months = ['Jan', 'Feb', 'Mar', 'April', 'May']
console.log (months.indexOf('Mar'))
Nach dem Login kopieren
Ausgabe
2
Nach dem Login kopieren
Der ausgegebene Ausgabeindex ist „2“. Wenn das Suchelement nicht im Array vorhanden ist, wird „-1“ als Ausgabe zurückgegeben.
Console.log (months.indexOf('Aug'))
Nach dem Login kopieren
Da das Element im Monatsarray nicht vorhanden ist, gibt die Funktion indexOf „-1“ zurück.
findIndex-Funktion JavaScript
Die Funktion array.findIndex() von JavaScript wird verwendet, um den Index des ersten im Array vorhandenen Elements zurückzugeben, wenn die in der Funktion angegebene Bedingung erfüllt ist. Dieses Element wird vom Benutzer beim Funktionsaufruf übergeben. Wenn das Element im Array nicht vorhanden ist, wird -1 zurückgegeben.
Die Syntax der
findIndex-Methode lautet wie folgt:
arr.findIndex (func(element, index, arr), thisArg)
Nach dem Login kopieren
Hier stellt „arr“ das Array dar, auf dem die findIndex-Funktion ausgeführt wird.
Die
findIndex-Methode hat die folgenden Parameter:
func – Dies ist eine Rückruffunktion, die eine Bedingung angibt. Es werden folgende Parameter benötigt:
o Element – es ist das aktuelle Element im Array
o Index – der Index des aktuellen Elements, optional
o arr – Gibt an, dass das Array, auf dem diese Methode ausgeführt wird, ebenfalls optional ist
thisArg – Dies ist ein optionaler Wert
Die findIndex-Methode kann auf zwei Arten verwendet werden, nämlich mit dem Schlüsselwort „return“ und mit der Funktion „inline“. Wenn wir hier eine Funktion an eine andere Funktion übergeben, werden sie „Rückruffunktionen“ genannt.
Verwenden Sie das Schlüsselwort „return“
Angenommen, wir haben eine Reihe von Farben wie Rot, Grün, Blau, Gelb, Orange. Wir wollen gelbe Indizes.
Beispiel
const colors = ['red', 'green', 'blue', 'yellow', 'orange']
function is_yellow (element) {
return element === 'yellow'
}
result = colors.findIndex(is_yellow)
console.log ("The index of 'yellow' is: " + result)
Nach dem Login kopieren
Ausgabe
Es wird die folgende Ausgabe erzeugt:
The index of 'yellow' is: 3
Nach dem Login kopieren
Hier erhalten wir die Ausgabe „3“, da das Element „gelb“ an der Indexposition „3“ erscheint.
Verwenden Sie Inline-Funktionen
Das gleiche oben erwähnte Programm kann auch wie folgt geschrieben werden:
Beispiel
let colors = ['red', 'green', 'blue', 'yellow', 'orange']
let index = colors.findIndex(color => color === 'blue')
console.log("The index of color 'blue' is: " + index)
Nach dem Login kopieren
Ausgabe
Es wird die folgende Ausgabe erzeugt:
The index of color 'blue' is: 2
Nach dem Login kopieren
Wir erhalten die Ausgabe „2“, da das Element „blau“ an der zweiten Position im angegebenen Array erscheint.
Unterschied zwischen den Funktionen indexOf und findIndex
Es gibt zwei Hauptunterschiede zwischen den Methoden indexOf und findIndex:
Der erste Unterschied
„Die indexOf-Methode verwendet das Element als Parameter; während in der findIndex-Methode die Callback-Funktion als Parameter übergeben wird.“
Beispiel
Das folgende Beispiel erklärt dies:
const fruits = ['apple', 'banana', 'mango', 'grapes']
console.log("The index of 'banana' is: " + fruits.indexOf('banana'))
console.log ("Index: " + fruits.findIndex(index => index === 'banana'))
Nach dem Login kopieren
Ausgabe
Es wird die folgende Ausgabe erzeugt:
The index of 'banana' is: 1
Index: 1
Nach dem Login kopieren
In beiden Fällen wird die Ausgabe als „1“ angegeben, da das Element „Banane“ am ersten Index erscheint. In der indexOf-Methode wird das gesuchte Element als Parameter übergeben und die Funktion vergleicht jedes Element des Arrays und gibt die erste Position zurück, an der das Element gefunden wird.
In findIndex sendet diese Methode jedes Element im Array an eine Funktion, die das Array auf das angegebene Element überprüft. Wenn das Element gefunden wird, wird ein boolescher Wert zurückgegeben, der „True“ ist, und die Methode findIndex gibt diesen spezifischen Index zurück.
In beiden Fällen geben beide Methoden „-1“ als Ausgabe zurück, wenn der Wert oder das Element nicht im Array vorhanden ist.
Der zweite Unterschied
Die Methode
indexOf eignet sich hervorragend zum Abrufen des Index eines einfachen Elements. Diese Methode funktioniert jedoch nicht richtig, wenn wir nach dem Index von etwas Komplexerem suchen, beispielsweise einem Objekt. Dies liegt an der „Referenzgleichheit“.
Gemäß der Referenzgleichheit gibt ein Vergleich nur dann „true“ zurück, wenn sich die beiden verglichenen Objekte auf genau dasselbe Objekt beziehen. In JavaScript sind zwei identische Objekte nicht identisch, es sei denn, sie verweisen auf dasselbe Objekt.
Beispiel
Lassen Sie uns dies anhand des folgenden Beispiels verstehen:
const obj = {banana:3}
const array = [{mango:7}, obj, {orange:5}]
console.log ("Index: " + array.indexOf({banana:3}))
console.log ("Index: " + array.findIndex(index => index.banana === 3))
console.log ("Index: " + array.indexOf(obj))
Nach dem Login kopieren
Ausgabe
Es wird die folgende Ausgabe erzeugt:
Index: -1
Index: 1
Index: 1
Nach dem Login kopieren
In der ersten indexOf-Funktion kann das Objekt im angegebenen Array nicht gefunden werden, obwohl es dasselbe ist, und gibt daher „-1“ zurück.
Wenn wir in der am Ende verwendeten indexOf-Methode die eigentliche Referenz übergeben, wird der Index des Objekts zurückgegeben. Die Methode findIndex überprüft alle Schlüssel-Wert-Paare im angegebenen Array, um den richtigen Index für dieses bestimmte Objekt zu finden und zurückzugeben.
Fazit
Die Methoden
indexOf und findIndex geben beide den ersten Index des angegebenen Elements zurück. Die Methode indexOf verwendet das Element, dessen Index zurückgegeben werden soll, als Parameter, während die Methode findIndex eine Funktion als Parameter akzeptiert. Aber beide Funktionen geben als Ausgabe „-1“ zurück.
Das obige ist der detaillierte Inhalt vonUnterschied zwischen den Funktionen indexOf und findIndex. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
