Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

Array.prototype.find()

Baseline
Weitgehend verfügbar

Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit September 2015 browserübergreifend verfügbar.

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

  • Wenn Sie den Index des gefundenen Elements im Array benötigen, verwenden Sie findIndex().
  • Wenn Sie den Index eines Wertes suchen müssen, verwenden Sie indexOf(). (Es ist ähnlich wie findIndex(), überprüft jedoch jedes Element auf Gleichheit mit dem Wert anstatt eine Testfunktion zu verwenden.)
  • Wenn Sie wissen müssen, ob ein Wert im Array vorhanden ist, verwenden Sie includes(). Auch hier wird jedes Element auf Gleichheit mit dem Wert überprüft, anstatt eine Testfunktion zu verwenden.
  • Wenn Sie herausfinden möchten, ob irgendein Element die angegebene Testfunktion erfüllt, verwenden Sie some().
  • Wenn Sie alle Elemente finden müssen, die die angegebene Testfunktion erfüllen, verwenden Sie filter().

Probieren Sie es aus

const array = [5, 12, 8, 130, 44];

const found = array.find((element) => element > 10);

console.log(found);
// Expected output: 12

Syntax

js
find(callbackFn)
find(callbackFn, thisArg)

Parameter

callbackFn

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, und einen falsy-Wert andernfalls. Die Funktion wird mit den folgenden Argumenten aufgerufen:

element

Das aktuelle Element, das im Array verarbeitet wird.

index

Der Index des aktuellen Elements, das im Array verarbeitet wird.

array

Das Array, auf das find() angewandt wurde.

thisArg Optional

Ein Wert, der als this beim Ausführen von callbackFn verwendet wird. Siehe iterative Methoden.

Rückgabewert

Das erste Element im Array, das die angegebene Testfunktion erfüllt. Andernfalls wird undefined zurückgegeben.

Beschreibung

Die find()-Methode ist eine iterative Methode. Sie ruft eine angegebene callbackFn-Funktion einmal für jedes Element in einem Array in aufsteigender Indexreihenfolge auf, bis callbackFn einen truthy-Wert zurückgibt. find() gibt dann dieses Element zurück und stoppt die Iteration durch das Array. Wenn callbackFn nie 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 im Allgemeinen funktionieren.

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

Die find()-Methode ist generisch. Sie erwartet lediglich, dass der this-Wert eine length-Eigenschaft und integer-basierte Schlüssel-Eigenschaften hat.

Beispiele

Ein Objekt in einem Array nach einer seiner Eigenschaften finden

js
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 }

Verwenden einer Pfeilfunktion und Destructuring

js
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

Das folgende Beispiel gibt das erste Element im Array zurück, das eine Primzahl ist, oder undefined, falls keine Primzahl vorhanden ist.

js
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

Hinweis: Die isPrime()-Implementierung dient nur zur Veranschaulichung. In einer realen Anwendung möchten Sie einen stark memoisierten Algorithmus wie das Siebs des Eratosthenes verwenden, um wiederholte Berechnungen zu vermeiden.

Verwenden des dritten Arguments von callbackFn

Das array-Argument ist nützlich, wenn Sie auf ein anderes Element im Array zugreifen möchten, insbesondere wenn Sie keine vorhandene Variable haben, die sich auf das Array bezieht. Das folgende Beispiel verwendet zuerst filter(), um die positiven Werte zu extrahieren, und dann find(), um das erste Element zu finden, das kleiner ist als seine Nachbarn.

js
const numbers = [3, -1, 1, 4, 1, 5, 9, 2, 6];
const firstTrough = numbers
  .filter((num) => num > 0)
  .find((num, idx, arr) => {
    // Without the arr argument, there's no way to easily access the
    // intermediate array without saving it to a variable.
    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

Verwendung von find() auf lückenhaften Arrays

Leere Slots in lückenhaften Arrays werden besucht und werden genauso wie undefined behandelt.

js
// Declare array with no elements at indexes 2, 3, and 4
const array = [0, 1, , , , 5, 6];

// Shows all indexes, not just those with assigned values
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

// Shows all indexes, including deleted
array.find((value, index) => {
  // Delete element 5 on first iteration
  if (index === 0) {
    console.log("Deleting array[5] with value", array[5]);
    delete array[5];
  }
  // Element 5 is still visited even though deleted
  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

Aufruf von find() bei Nicht-Array-Objekten

Die find()-Methode liest die length-Eigenschaft von this und greift dann auf jede Eigenschaft zu, deren Schlüssel eine nicht-negative Ganzzahl kleiner als length ist.

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

Spezifikationen

Spezifikation
ECMAScript® 2027 Language Specification
# sec-array.prototype.find

Browser-Kompatibilität

Siehe auch