MDN’s new design is in Beta! A sneak peek: https://blog.mozilla.org/opendesign/mdns-new-design-beta/

Die find() Methode gibt den Wert des ersten Elementes eines Arrays zurück, das die mitgelieferte Testfunktion erfüllt. Ansonsten wird undefined zurückgegeben.
 
Siehe auch die findIndex() Methode, die den Index eines gefundenen Elements anstatt dessen Wert zurück gibt.
 

Syntax

arr.find(callback[, thisArg])

Parameter

callback
Funktion, die für jeden Wert des Arrays ausgeführt wird. Sie nimmt drei Argumente:
element
Das aktuell verarbeitete Element des Arrays.
index
Der Index des aktuell verarbeiteten Elements des Arrays.
array
Das Array, von dem find aufgerufen wurde.
thisArg
Optional. Objekt, welches beim Ausführen der callback Funktion als this verwendet wird.

Rückgabewert

Ein Wert aus dem Array, wenn ein Element den Test besteht, andernfalls undefined.

Beschreibung

Die find Methode führt für jedes Element des Arrays die callback Funktion aus, bis ein Element gefunden wurde, für das die callback Funktion true zurückliefert.

Wenn ein solches Element gefunden wurde, gibt find den Wert dieses Elements sofort zurück. Ansonsten liefert find undefined zurück. Die callback Funktion wird nur für Indizes des Arrays aufgerufen, die einen Wert besitzen. Sie wird nicht für gelöschte Indizes oder für Indizes ohne zugewiesenen Wert aufgerufen.

Die callback Funktion nimmt drei Argumente: den Wert des Elements, den Index des Elements und das Array, das durchlaufen wird.

Wenn thisArg in find angegeben ist, wird es als this für jeden Aufruf der callback Funktion verwendet. Wenn es nicht angegeben wurde, wird undefined verwendet.

find verändert das ursprüngliche Array nicht.

Die Anzahl der zu durchlaufenden Elemente in der find Methode werden vor dem ersten Aufruf der callback Funktion gesetzt. Elemente, die nach dem find Aufruf hinzugefügt wurden, werden nicht von der callback Funktion behandelt.

Wenn ein noch nicht durchlaufenes Element des Arrays von einer callback Funktion geändert wird, wird dieser geänderte Wert der callback Funktion übergeben. Die callback Funktion bekommt immer den Wert, der zum Zeitpunkt des Besuchens eines Elementes gesetzt ist. Gelöschte Elemente werden nicht angeschaut.

Beispiele

Beispiel: Finden eines Objektes in einem Array anhand seiner Properties

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

function findCherries(fruit) { 
    return fruit.name === 'cherries';
}

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

Beispiel: Finden einer Primzahl in einem Array

In folgendem Beispiel wird ein Element des Arrays gefunden, wenn es eine Primzahl ist. Wenn keine Primzahl vorhanden ist, liefert isPrime undefined zurück.

function isPrime(element, index, array) {
  var 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

Das folgende Beispiel zeigt, wie nicht existierende oder gelöschte Elemente gefunden werden und dass ihr Wert der der callback Funktion übergeben wird, der Wert zum jeweiligen Zeitpunkt des Aufrufs ist.

// Declare array with no element at index 2, 3 and 4
var a = [0,1,,,,5,6];

// Shows all indexes, not just those that have been assigned values
a.find(function(value, index) {
  console.log('Visited index ' + index + ' with value ' + value); 
});

// Shows all indexes, including deleted
a.find(function(value, index) {

  // Delete element 5 on first iteration
  if (index == 0) {
    console.log('Deleting a[5] with value ' + a[5]);
    delete a[5];
  }
  // Element 5 is still visited even though deleted
  console.log('Visited index ' + index + ' with value ' + value); 
});

Polyfill

Diese Methode wurde in der EMCAScript 2015 Spezifikation hinzugefügt und ist nicht in allen JavaScript Implementationen vorhanden. Jedoch kann man mit folgendem Codeausschnitt einen Polyfill für Array.prototype.find erstellen:

if (!Array.prototype.find) {
  Array.prototype.find = function(predicate) {
    'use strict';
    if (this == null) {
      throw new TypeError('Array.prototype.find called on null or undefined');
    }
    if (typeof predicate !== 'function') {
      throw new TypeError('predicate must be a function');
    }
    var list = Object(this);
    var length = list.length >>> 0;
    var thisArg = arguments[1];
    var value;

    for (var i = 0; i < length; i++) {
      value = list[i];
      if (predicate.call(thisArg, value, i, list)) {
        return value;
      }
    }
    return undefined;
  };
}

Sollten Sie wirklich veraltete JavaScript Engines unterstützen müssen, die ihrerseits Object.defineProperty nicht unterstützen, ist es ratsam, die Array.prototype Methode gar nicht mit dem Polyfill zu erweitern, da man diese nicht unabzählbar machen kann.

Spezifikationen

Spezifikation Status Kommentar
ECMAScript 2015 (6th Edition, ECMA-262)
Die Definition von 'Array.prototype.find' in dieser Spezifikation.
Standard Initiale Definition.
ECMAScript Latest Draft (ECMA-262)
Die Definition von 'Array.prototype.find' in dieser Spezifikation.
Entwurf  

Browser Kompabilität

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 45.0 25.0 (25.0) Nicht unterstützt Nicht unterstützt 7.1
Feature Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support Nicht unterstützt Nicht unterstützt 25.0 (25.0) Nicht unterstützt Nicht unterstützt iOS 8

Siehe auch

Schlagwörter des Dokuments und Mitwirkende

 Mitwirkende an dieser Seite: psychotammi, mreu, db6edr, schlagi123, oliver-j, MelanieVeigl
 Zuletzt aktualisiert von: psychotammi,