Arrays Filteren met de Filter()-Methode
Dit hoofdstuk behandelt de details van de filter()-methode, verduidelijkt de syntaxis, toepassingen en hoe deze methode het creëren van verfijnde arrays mogelijk maakt.
filter()
De filter()-methode selecteert elementen die aan een bepaalde voorwaarde voldoen. De syntaxis:
array.filter((element, index, array) => {
// Callback body
});
Belangrijke punten over de filter()-methode:
- Wijzigt de oorspronkelijke array niet;
- Itereert element voor element over de oorspronkelijke array;
- Geeft een nieuwe array terug;
- Elementen worden aan de nieuwe array toegevoegd als ze voldoen aan de callback-voorwaarde;
- Als de callback true retourneert, wordt het element opgenomen; anders wordt het weggelaten.
Voorbeelden
De ware kracht van de filter()-methode wordt duidelijk wanneer deze wordt toegepast in uiteenlopende scenario's. Hieronder enkele illustratieve voorbeelden:
Voorbeeld 1: Oneven getallen filteren
In dit voorbeeld maakt de filter()-methode een array (oddNumbers) die uitsluitend oneven getallen uit de oorspronkelijke array bevat.
123456const numbers = [15, 22, 37, 41, 58, 67, 72]; const oddNumbers = numbers.filter((number) => { return number % 2 !== 0; }); console.log(oddNumbers); // Output: 15, 37, 41, 67
Voorbeeld 2: Producten filteren op prijsklasse
Hier wordt de filter()-methode gebruikt om producten met prijzen onder de $500 te selecteren, waarmee een nieuwe array (affordableProducts) wordt aangemaakt.
const products = [
{ name: "Keyboard", price: 220 },
{ name: "Smartphone", price: 800 },
{ name: "Tablet", price: 500 },
{ name: "Headphones", price: 120 },
{ name: "Camera", price: 1500 },
];
const affordableProducts = products.filter((product) => product.price < 500);
console.log(affordableProducts); // Output: [ { name: "Keyboard", price: 220 }, { name: "Headphones", price: 120 } ]
1. Wat doet de filter()-methode?
2. Wat is een belangrijk kenmerk van de filter()-methode?
3. In het onderstaande voorbeeld, welke voorwaarde moet worden gebruikt zodat de array numbersGreaterThan20 getallen bevat die groter zijn dan 20?
Bedankt voor je feedback!
Vraag AI
Vraag AI
Vraag wat u wilt of probeer een van de voorgestelde vragen om onze chat te starten.
Can you explain how the filter() method differs from the map() method?
Can you show more examples of using filter() with different data types?
What happens if no elements satisfy the filter condition?
Awesome!
Completion rate improved to 2.27Arrays Filteren met de Filter()-Methode
Veeg om het menu te tonen
Dit hoofdstuk behandelt de details van de filter()-methode, verduidelijkt de syntaxis, toepassingen en hoe deze methode het creëren van verfijnde arrays mogelijk maakt.
filter()
De filter()-methode selecteert elementen die aan een bepaalde voorwaarde voldoen. De syntaxis:
array.filter((element, index, array) => {
// Callback body
});
Belangrijke punten over de filter()-methode:
- Wijzigt de oorspronkelijke array niet;
- Itereert element voor element over de oorspronkelijke array;
- Geeft een nieuwe array terug;
- Elementen worden aan de nieuwe array toegevoegd als ze voldoen aan de callback-voorwaarde;
- Als de callback true retourneert, wordt het element opgenomen; anders wordt het weggelaten.
Voorbeelden
De ware kracht van de filter()-methode wordt duidelijk wanneer deze wordt toegepast in uiteenlopende scenario's. Hieronder enkele illustratieve voorbeelden:
Voorbeeld 1: Oneven getallen filteren
In dit voorbeeld maakt de filter()-methode een array (oddNumbers) die uitsluitend oneven getallen uit de oorspronkelijke array bevat.
123456const numbers = [15, 22, 37, 41, 58, 67, 72]; const oddNumbers = numbers.filter((number) => { return number % 2 !== 0; }); console.log(oddNumbers); // Output: 15, 37, 41, 67
Voorbeeld 2: Producten filteren op prijsklasse
Hier wordt de filter()-methode gebruikt om producten met prijzen onder de $500 te selecteren, waarmee een nieuwe array (affordableProducts) wordt aangemaakt.
const products = [
{ name: "Keyboard", price: 220 },
{ name: "Smartphone", price: 800 },
{ name: "Tablet", price: 500 },
{ name: "Headphones", price: 120 },
{ name: "Camera", price: 1500 },
];
const affordableProducts = products.filter((product) => product.price < 500);
console.log(affordableProducts); // Output: [ { name: "Keyboard", price: 220 }, { name: "Headphones", price: 120 } ]
1. Wat doet de filter()-methode?
2. Wat is een belangrijk kenmerk van de filter()-methode?
3. In het onderstaande voorbeeld, welke voorwaarde moet worden gebruikt zodat de array numbersGreaterThan20 getallen bevat die groter zijn dan 20?
Bedankt voor je feedback!
