Array.prototype.find()

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2016.

Die find() Methode 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üssen, verwenden Sie indexOf(). (Es ist ähnlich wie findIndex(), überprüft aber jedes Element auf Gleichheit mit dem Wert statt mit einer Testfunktion.)
  • Wenn Sie feststellen müssen, ob ein Wert in einem Array existiert, verwenden Sie includes(). Auch hier wird jedes Element auf Gleichheit mit dem Wert überprüft, anstatt mit einer Testfunktion.
  • Wenn Sie feststellen müssen, ob ein beliebiges Element die bereitgestellte Testfunktion erfüllt, verwenden Sie some().
  • Wenn Sie alle Elemente finden müssen, die die bereitgestellte Testfunktion erfüllen, verwenden Sie filter().

Probieren Sie es aus

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 übereinstimmendes Element gefunden wurde, und ansonsten einen falsy Wert. 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() angewendet 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 bereitgestellte Testfunktion erfüllt. Andernfalls wird undefined zurückgegeben.

Beschreibung

Die find() Methode ist eine iterative Methode. Sie ruft einmal für jedes Element eines Arrays in aufsteigender Indexreihenfolge eine bereitgestellte callbackFn Funktion auf, bis callbackFn einen truthy Wert zurückgibt. find() gibt dann dieses Element zurück und stoppt die Iteration durch das Array. Wenn callbackFn niemals einen truthy Wert zurückgibt, gibt find() undefined zurück. Lesen Sie den Abschnitt iterative 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 jene mit zugewiesenen Werten. Leere Stellen in sparse arrays verhalten sich wie undefined.

Die find() Methode ist generisch. Sie erwartet nur, dass der this Wert eine length Eigenschaft und ganzzahlig indizierte 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 }

Mit Pfeilfunktion und Destrukturierung

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 }

Eine Primzahl in einem Array finden

Das folgende Beispiel findet ein Element im Array, das eine Primzahl ist (oder gibt undefined zurück, wenn es keine Primzahl gibt):

js
function isPrime(element, index, array) {
  let start = 2;
  while (start <= Math.sqrt(element)) {
    if (element % start++ < 1) {
      return false;
    }
  }
  return element > 1;
}

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

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 bestehende Variable haben, die auf das Array verweist. Das folgende Beispiel verwendet zuerst filter(), um die positiven Werte zu extrahieren, und verwendet 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

Verwenden von find() auf Sparse Arrays

Leere Stellen in Sparse Arrays werden besucht und behandeln sich wie undefined.

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);
});
// 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);
});
// 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

Aufrufen von find() auf Objekten, die keine Arrays sind

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

Specification
ECMAScript Language Specification
# sec-array.prototype.find

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch