Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Apprendre Méthode Filter() | Opérations Avancées sur les Tableaux
Structures de Données JavaScript

bookMéthode Filter()

Ce chapitre explore les subtilités de la méthode filter(), en éclaircissant sa syntaxe, ses applications, et comment elle facilite la création de tableaux affinés.

filter()

La méthode filter() sélectionne les éléments qui répondent à une condition particulière. Décortiquons la syntaxe :

array.filter((element, index, array) => {
  // Callback body
});

Voici ce qu'il faut savoir sur la méthode filter() :

  • Elle ne modifie pas le tableau original ;
  • Elle itère sur le tableau original élément par élément ;
  • Elle retourne un nouveau tableau ;
  • Les éléments sont ajoutés au nouveau tableau s'ils satisfont la condition du callback ;
  • Si le callback retourne vrai, l'élément est inclus ; sinon, il est omis.

Exemples

La véritable prouesse de la méthode filter() devient apparente lorsqu'elle est appliquée à divers scénarios. Explorons quelques exemples illustratifs :

Exemple 1 : Filtrage des Nombres Impairs

Dans cet exemple, la méthode filter() crée un tableau (oddNumbers) ne comprenant que les nombres impairs du tableau original.


              
123456

            
const 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
copy

Exemple 2 : Filtrage des produits par gamme de prix

Ici, la méthode filter() est utilisée pour extraire les produits dont les prix sont inférieurs à 500 $, créant ainsi un nouveau tableau (affordableProducts).

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. Que fait la méthode filter() ?

2. Quelle est une caractéristique clé de la méthode filter() ?

3. Dans l'exemple ci-dessous, quelle devrait être la condition pour que le tableau numbersGreaterThan20 contienne des nombres supérieurs à 20 ?

question mark

Que fait la méthode filter() ?

Select the correct answer

question mark

Quelle est une caractéristique clé de la méthode filter() ?

Select the correct answer

question mark

Dans l'exemple ci-dessous, quelle devrait être la condition pour que le tableau numbersGreaterThan20 contienne des nombres supérieurs à 20 ?

Select the correct answer

Tout était clair ?

Comment pouvons-nous l'améliorer ?

Merci pour vos commentaires !

Section 5. Chapitre 3

Demandez à l'IA

expand

Demandez à l'IA

ChatGPT

Posez n'importe quelle question ou essayez l'une des questions suggérées pour commencer notre discussion

Awesome!

Completion rate improved to 2.27

bookMéthode Filter()

Glissez pour afficher le menu

Ce chapitre explore les subtilités de la méthode filter(), en éclaircissant sa syntaxe, ses applications, et comment elle facilite la création de tableaux affinés.

filter()

La méthode filter() sélectionne les éléments qui répondent à une condition particulière. Décortiquons la syntaxe :

array.filter((element, index, array) => {
  // Callback body
});

Voici ce qu'il faut savoir sur la méthode filter() :

  • Elle ne modifie pas le tableau original ;
  • Elle itère sur le tableau original élément par élément ;
  • Elle retourne un nouveau tableau ;
  • Les éléments sont ajoutés au nouveau tableau s'ils satisfont la condition du callback ;
  • Si le callback retourne vrai, l'élément est inclus ; sinon, il est omis.

Exemples

La véritable prouesse de la méthode filter() devient apparente lorsqu'elle est appliquée à divers scénarios. Explorons quelques exemples illustratifs :

Exemple 1 : Filtrage des Nombres Impairs

Dans cet exemple, la méthode filter() crée un tableau (oddNumbers) ne comprenant que les nombres impairs du tableau original.


              
123456

            
const 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
copy

Exemple 2 : Filtrage des produits par gamme de prix

Ici, la méthode filter() est utilisée pour extraire les produits dont les prix sont inférieurs à 500 $, créant ainsi un nouveau tableau (affordableProducts).

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. Que fait la méthode filter() ?

2. Quelle est une caractéristique clé de la méthode filter() ?

3. Dans l'exemple ci-dessous, quelle devrait être la condition pour que le tableau numbersGreaterThan20 contienne des nombres supérieurs à 20 ?

question mark

Que fait la méthode filter() ?

Select the correct answer

question mark

Quelle est une caractéristique clé de la méthode filter() ?

Select the correct answer

question mark

Dans l'exemple ci-dessous, quelle devrait être la condition pour que le tableau numbersGreaterThan20 contienne des nombres supérieurs à 20 ?

Select the correct answer

Tout était clair ?

Comment pouvons-nous l'améliorer ?

Merci pour vos commentaires !

Section 5. Chapitre 3
some-alt