Start · Sprachen · JavaScript · Referenz · Array.prototype.find()

Array.prototype.find()

Methode

Die Methode <code>find()</code> von <code>Array</code>-Instanzen liefert das erste Element des Arrays, das die Testfunktion erfüllt.

Kategorie: method-property

Signatur

find(callbackFn) / find(callbackFn, thisArg)

Beschreibung

Die Methode find() von Array-Instanzen gibt das erste Element im bereitgestellten Array zurück, das die bereitgestellte Testfunktion erfüllt. Wenn keine Werte die Testfunktion erfüllen, wird undefined zurückgegeben.

  • Wenn Sie den Index des gefundenen Elements im Array benötigen, verwenden Sie findIndex().
  • Wenn Sie den Index eines Wertes finden möchten, verwenden Sie indexOf(). (Dies ähnelt findIndex(), prüft jedoch jedes Element auf Gleichheit mit dem Wert, anstatt eine Testfunktion zu verwenden.)
  • Wenn Sie feststellen möchten, ob ein Wert in einem Array existiert, verwenden Sie includes(). Auch diese Methode prüft jedes Element auf Gleichheit mit dem Wert, statt eine Testfunktion zu verwenden.
  • Wenn Sie prüfen möchten, ob irgendein Element die bereitgestellte Testfunktion erfüllt, verwenden Sie some().
  • Wenn Sie alle Elemente finden möchten, die die bereitgestellte Testfunktion erfüllen, verwenden Sie filter().

Die Methode find() ist eine iterative Methode. Sie ruft die bereitgestellte Funktion callbackFn einmal für jedes Element im Array in aufsteigender Indexreihenfolge auf, bis callbackFn einen truthy Wert zurückgibt. find() gibt dann dieses Element zurück und beendet die Iteration durch das Array. Wenn callbackFn niemals einen truthy Wert zurückgibt, gibt find() undefined zurück. Lesen Sie den Abschnitt zu iterativen Methoden für weitere Informationen darüber, wie diese Methoden generell funktionieren.

callbackFn wird für jeden Index des Arrays aufgerufen, nicht nur für diejenigen mit zugewiesenen Werten. Leere Slots in sparse Arrays verhalten sich wie undefined.

Die Methode find() ist generisch. Sie erwartet lediglich, dass der this-Wert eine length-Eigenschaft und integer-indizierte Eigenschaften besitzt.

Parameter

Name Typ Default Beschreibung
$callbackFn Pflicht Function Eine Funktion, die für jedes Element im Array ausgeführt wird. Sie sollte einen truthy Wert zurückgeben, um anzuzeigen, dass ein passendes Element gefunden wurde, andernfalls einen falsy Wert. Die Funktion wird mit den folgenden Argumenten aufgerufen: element (das aktuell verarbeitete Element im Array), index (der Index des aktuell verarbeiteten Elements) und array (das Array, auf dem find() aufgerufen wurde).
$thisArg any Ein Wert, der als this verwendet wird, wenn callbackFn ausgeführt wird. Siehe iterative Methoden.

Rückgabewert

Typ
any
Beschreibung
Das erste Element im Array, das die bereitgestellte Testfunktion erfüllt. Andernfalls wird undefined zurückgegeben.

Beispiele

Ein Objekt in einem Array anhand einer seiner Eigenschaften finden

const inventory = [
  { name: "apples", quantity: 2 },
  { name: "bananas", quantity: 0 },
  { name: "cherries", quantity: 5 },
];

function isCherries(fruit) {
  return fruit.name === "cherries";
}

console.log(inventory.find(isCherries));
// { name: 'cherries', quantity: 5 }

Verwendung von Pfeilfunktion und Destructuring

const inventory = [
  { name: "apples", quantity: 2 },
  { name: "bananas", quantity: 0 },
  { name: "cherries", quantity: 5 },
];

const result = inventory.find(({ name }) => name === "cherries");

console.log(result); // { name: 'cherries', quantity: 5 }

Die erste Primzahl in einem Array finden

function isPrime(n) {
  if (n < 2) {
    return false;
  }
  if (n % 2 === 0) {
    return n === 2;
  }
  for (let factor = 3; factor * factor <= n; factor += 2) {
    if (n % factor === 0) {
      return false;
    }
  }
  return true;
}

console.log([4, 6, 8, 12].find(isPrime)); // undefined, not found
console.log([4, 5, 8, 12].find(isPrime)); // 5

Verwendung des dritten Arguments von callbackFn

const numbers = [3, -1, 1, 4, 1, 5, 9, 2, 6];
const firstTrough = numbers
  .filter((num) => num > 0)
  .find((num, idx, arr) => {
    // Ohne das arr-Argument gibt es keine einfache Möglichkeit, auf das
    // Zwischen-Array zuzugreifen, ohne es in einer Variablen zu speichern.
    if (idx > 0 && num >= arr[idx - 1]) return false;
    if (idx < arr.length - 1 && num >= arr[idx + 1]) return false;
    return true;
  });
console.log(firstTrough); // 1

find() bei sparse Arrays verwenden

// Array mit fehlenden Elementen an den Indizes 2, 3 und 4 deklarieren
const array = [0, 1, , , , 5, 6];

// Zeigt alle Indizes, nicht nur die mit zugewiesenen Werten
array.find((value, index) => {
  console.log("Visited index", index, "with value", value);
  return false;
});
// Visited index 0 with value 0
// Visited index 1 with value 1
// Visited index 2 with value undefined
// Visited index 3 with value undefined
// Visited index 4 with value undefined
// Visited index 5 with value 5
// Visited index 6 with value 6

// Zeigt alle Indizes, einschließlich gelöschter
array.find((value, index) => {
  // Element 5 in der ersten Iteration löschen
  if (index === 0) {
    console.log("Deleting array[5] with value", array[5]);
    delete array[5];
  }
  // Element 5 wird trotz Löschung besucht
  console.log("Visited index", index, "with value", value);
  return false;
});
// Deleting array[5] with value 5
// Visited index 0 with value 0
// Visited index 1 with value 1
// Visited index 2 with value undefined
// Visited index 3 with value undefined
// Visited index 4 with value undefined
// Visited index 5 with value undefined
// Visited index 6 with value 6

find() für Nicht-Array-Objekte aufrufen

const arrayLike = {
  length: 3,
  "-1": 0.1, // von find() ignoriert, da -1 < 0
  0: 2,
  1: 7.3,
  2: 4,
};
console.log(Array.prototype.find.call(arrayLike, (x) => !Number.isInteger(x)));
// 7.3

// Wichtig · Fallstricke

Die Implementierung von isPrime() dient nur zur Demonstration. Für eine reale Anwendung sollten Sie einen stark memoisierten Algorithmus wie das Sieb des Eratosthenes verwenden, um wiederholte Berechnungen zu vermeiden.