CodeGym /Cours Java /Frontend SELF FR /Fonctions d'ordre supérieur

Fonctions d'ordre supérieur

Frontend SELF FR
Niveau 37 , Leçon 4
Disponible

5.1 Concepts de base

Les fonctions d'ordre supérieur sont un aspect important de la programmation fonctionnelle et sont largement utilisées en JavaScript. Elles permettent d'écrire un code plus abstrait, compact et réutilisable.

Qu'est-ce que les fonctions d'ordre supérieur ?

Les fonctions d'ordre supérieur (higher-order functions) sont des fonctions qui prennent en arguments d'autres fonctions ou qui renvoient des fonctions en tant que résultat. Elles permettent d'utiliser des fonctions comme des objets de première classe, ce qui donne la possibilité de créer des programmes plus abstraits et modulaires.

Exemples de fonctions d'ordre supérieur

  1. Passer des fonctions comme arguments.
  2. Retourner des fonctions d'autres fonctions.

5.2 Passer des fonctions comme arguments

Utilisation des méthodes intégrées des tableaux

JavaScript fournit de nombreuses méthodes intégrées pour travailler avec les tableaux, qui sont des fonctions d'ordre supérieur, telles que forEach(), map(), filter(), reduce() et d'autres.

1. Méthode forEach()

La méthode forEach() exécute la fonction spécifiée une fois pour chaque élément du tableau.

JavaScript
    
      const numbers = [1, 2, 3, 4, 5];

      numbers.forEach(function(number) {
        console.log(number);
      });
      // Affichera : 1 2 3 4 5
    
  

2. Méthode map()

La méthode map() crée un nouveau tableau avec les résultats de l'appel de la fonction spécifiée pour chaque élément du tableau.

JavaScript
    
      const numbers = [1, 2, 3, 4, 5];
      const squaredNumbers = numbers.map(function(number) {
        return number * number;
      });

      console.log(squaredNumbers);
      // Affichera : [1, 4, 9, 16, 25]
    
  

3. Méthode filter()

La méthode filter() crée un nouveau tableau avec tous les éléments qui réussissent le test implémenté par la fonction fournie.

JavaScript
    
      const numbers = [1, 2, 3, 4, 5];
      const evenNumbers = numbers.filter(function(number) {
        return number % 2 === 0;
      });

      console.log(evenNumbers);
      // Affichera : [2, 4]
    
  

4. Méthode reduce()

La méthode reduce() applique une fonction à un accumulateur et à chaque élément du tableau (de gauche à droite), le réduisant à une seule valeur.

JavaScript
    
      const numbers = [1, 2, 3, 4, 5];
      const sum = numbers.reduce(function(total, number) {
        return total + number;
      }, 0);

      console.log(sum);
      // Affichera : 15
    
  

5.3 Retourner des fonctions d'autres fonctions

Les fonctions d'ordre supérieur peuvent retourner d'autres fonctions, ce qui permet de créer des fonctions plus flexibles et configurables.

1. Currying

Le currying est le processus de transformation d'une fonction qui prend plusieurs arguments en une fonction qui prend un argument et retourne une nouvelle fonction qui prend l'argument suivant, etc.

Exemple de currying :

JavaScript
    
      function multiply(a) {
        return function(b) {
          return a * b;
        };
      }

      const multiplyByTwo = multiply(2);
      console.log(multiplyByTwo(5)); // Affichera : 10

      const multiplyByThree = multiply(3);
      console.log(multiplyByThree(5)); // Affichera : 15
    
  

2. Création de fonctions personnalisées

Les fonctions d'ordre supérieur permettent de créer des fonctions qui peuvent être personnalisées avec des arguments.

Exemple :

JavaScript
    
      function createGreeting(greeting) {
        return function(name) {
          console.log(`${greeting}, ${name}!`);
        };
      }

      const sayHello = createGreeting('Hello');
      sayHello('Alice'); // Affichera : Hello, Alice!

      const sayHi = createGreeting('Hi');
      sayHi('Bob'); // Affichera : Hi, Bob!
    
  

5.4 Application pratique

Examinons l'application pratique des fonctions d'ordre supérieur.

Fonction compose()

La fonction compose() permet de combiner plusieurs fonctions en une, qui les applique en chaîne :

JavaScript
    
      function compose(...functions) {
        return function(initialValue) {
          return functions.reduceRight((value, func) => func(value), initialValue);
        };
      }

      const addOne = x => x + 1;
      const double = x => x * 2;
      const addOneAndDouble = compose(double, addOne);
      console.log(addOneAndDouble(5)); // Affichera : 12 (ajoute d'abord 1 à 5, puis double le résultat)
    
  

Fonctions asynchrones d'ordre supérieur

Les fonctions asynchrones d'ordre supérieur permettent de travailler avec des opérations asynchrones, telles que les requêtes API ou la gestion des timers :

JavaScript
    
      function fetchData(callback) {
        setTimeout(() => {
          callback('Data received');
        }, 1000);
      }

      function processData(data) {
        console.log(data);
      }

      fetchData(processData);
      // Affichera : Data received (après 1 seconde)
    
  
Commentaires
TO VIEW ALL COMMENTS OR TO MAKE A COMMENT,
GO TO FULL VERSION