Array.prototype.filter()
Die Methode Array.prototype.filter() ist eines der Werkzeuge in JavaScript, wenn es darum geht, Arrays gezielt zu durchsuchen und gefilterte Teilergebnisse zu erzeugen. Sie erstellt ein neues Array mit allen Elementen, für die die übergebene Callback-Funktion den Wert true zurückgibt – das Originalarray bleibt dabei unverändert.
filter() eignet sich hervorragend für Anwendungsfälle wie das Herausfiltern von bestimmten Daten, das Validieren von Eingaben oder das Erzeugen dynamischer Listen auf Basis von Bedingungen.
Die Methode Array.prototype.filter() wird verwendet, um Arrays zu manipulieren. Sie ermöglicht es, ein neues Array zu erstellen, das nur diejenigen Elemente des Original-Arrays enthält, die einem bestimmten Kriterium entsprechen. Dieses Kriterium wird durch eine Callback-Funktion definiert, die auf jedes Element des Arrays angewendet wird.
Im Wesentlichen filtert diese Methode die Elemente des Arrays basierend auf der Rückgabe der Callback-Funktion. Elemente, für die die Funktion true zurückgibt, werden in das neue Array aufgenommen, während Elemente, für die false zurückgegeben wird, herausgefiltert werden.
Syntax
Array.prototype.filter(callbackFn);
Array.prototype.filter(callbackFn, thisArg);callback
Eine Funktion, die für jedes Element des Arrays ausgeführt wird. Diese Funktion nimmt drei Argumente an:
element: Das aktuelle Element des Arrays, das geprüft wird.index: (optional) Der Index des aktuellen Elements.array: (optional) Das Array selbst, auf dem die Methode aufgerufen wurde.
thisArg
(Optional) Ein Wert, der als this für die Callback-Funktion verwendet wird.
Beispiele
Alle negativen Zahlen aus dem Array herausfiltern (enternen)
const numbers = [-5, 3, 0, -4, 2, 8];
const positiveNumbers = numbers.filter(function(element) {
return element >= 0;
});
console.log(positiveNumbers);[ 3, 0, 2, 8 ]Filtern von Werten, die einem Kriterium entsprechen
const students = [
{ name: "John", age: 15 },
{ name: "Tom", age: 18 },
{ name: "Jane", age: 17 },
{ name: "Alice", age: 21 }
];
const adults = students.filter(function(student) {
return student.age >= 18;
});
console.log(adults);[ { name: 'Tom', age: 18 }, { name: 'Alice', age: 21 } ]Verwendung von thisArg
const nums = [1, 2, 3, 4, 5];
const filterContext = { threshold: 3 };
const filteredNums = nums.filter(function(element) {
return element > this.threshold;
}, filterContext);
console.log(filteredNums); [ 4, 5 ]Bestimmten Datentyp herausfiltern
const items = ["One", 20, 30, 40, "Two"];
const numsOnly = items.filter(item => typeof item === "number");
console.log(numsOnly);[ 20, 30, 40 ]