Concepts essentiels de la programmation fonctionnelle avec JavaScript

Mar 12 2023
La programmation fonctionnelle est un paradigme qui a gagné en popularité ces dernières années en raison de sa capacité à écrire du code plus modulaire, réutilisable et maintenable. JavaScript, étant un langage de programmation polyvalent, est également bien adapté à la programmation fonctionnelle.
Concepts de programmation fonctionnelle en JavaScript

La programmation fonctionnelle est un paradigme qui a gagné en popularité ces dernières années en raison de sa capacité à écrire du code plus modulaire, réutilisable et maintenable. JavaScript, étant un langage de programmation polyvalent, est également bien adapté à la programmation fonctionnelle. Dans cet article, nous allons explorer les concepts essentiels de la programmation fonctionnelle avec JavaScript et comment ils peuvent vous aider à écrire un meilleur code :

  1. Fonctions en tant que citoyens de première classe
  2. Fonctions d'ordre supérieur
  3. Fonctions pures
  4. Immutabilité
  5. Récursivité

Dans la programmation fonctionnelle, les fonctions sont traitées comme des citoyens de première classe, ce qui signifie qu'elles peuvent être affectées à des variables, transmises en tant qu'arguments à d'autres fonctions et renvoyées en tant que valeurs. Ce concept est crucial dans la programmation fonctionnelle, car il nous permet d'écrire du code plus modulaire et réutilisable.

Voici quelques exemples de la façon dont les fonctions sont traitées comme des citoyens de première classe en JavaScript :

  1. Affectation de fonctions aux variables :

const add = function(x, y) {
  return x + y;
}

2. Passer des fonctions comme arguments :

Les fonctions peuvent également être transmises en tant qu'arguments à d'autres fonctions. Cela permet une approche plus modulaire de la programmation, car cela nous permet de réutiliser la même fonction avec différentes entrées et sorties. Par exemple:

function greet(name, callback) {
  const message = "Hello, " + name + "!";
  callback(message);
}

function logMessage(message) {
  console.log(message);
}

greet("Sumit", logMessage); // Logs "Hello, Sumit!"

3. Fonctions de retour en tant que valeurs :

Les fonctions peuvent également être renvoyées sous forme de valeurs à partir d'autres fonctions. Cela permet des techniques plus avancées comme les fermetures et le curry. Par exemple:

function add(x) {
  return function(y) {
    return x + y;
  };
}

const addFive = add(5);
console.log(addFive(3)); // Logs 8

✓ Fonctions d'ordre supérieur

Les fonctions d'ordre supérieur sont des fonctions qui prennent d'autres fonctions comme arguments ou renvoient des fonctions comme valeurs. Ils nous permettent d'écrire un code plus abstrait et à usage général qui peut être appliqué à différents cas d'utilisation. Certaines fonctions courantes d'ordre supérieur en JavaScript sont map(), filter() et reduce().

Voici quelques exemples de fonctions d'ordre supérieur en JavaScript :

  1. tableau.prototype.map() :

const numbers = [1, 2, 3, 4];
const doubled = numbers.map(function(num) {
  return num * 2;
});
console.log(doubled); // Logs [2, 4, 6, 8]

2. Array.prototype.filter() :

La filter()méthode est une autre fonction d'ordre supérieur qui prend une fonction de rappel comme argument et renvoie un nouveau tableau avec uniquement les éléments qui réussissent le test spécifié dans le rappel. Par exemple:

const numbers = [1, 2, 3, 4];
const even = numbers.filter(function(num) {
  return num % 2 === 0;
});
console.log(even); // Logs [2, 4]

3. Function.prototype.bind() :

La bind()méthode est une fonction d'ordre supérieur qui renvoie une nouvelle fonction avec une thisvaleur spécifique et des arguments initiaux. Il est souvent utilisé pour créer une nouvelle fonction avec un contexte spécifique ou pour créer une fonction partiellement appliquée. Par exemple:

const person = {
  firstName: "Sumit",
  lastName: "Saha",
  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
};

const logName = function(greeting) {
  console.log(greeting + " " + this.fullName());
};

const boundLogName = logName.bind(person, "Hello");
boundLogName(); // Logs "Hello Sumit Saha"

Ce ne sont là que quelques exemples des nombreuses fonctions d'ordre supérieur disponibles en JavaScript. En utilisant des fonctions d'ordre supérieur, vous pouvez écrire un code plus générique et réutilisable qui peut être appliqué à différents cas d'utilisation.

✓ Fonctions pures

Les fonctions pures sont des fonctions qui n'ont pas d'effets secondaires, ce qui signifie qu'elles ne modifient aucun état externe ou variable en dehors de leur portée. Ils renvoient toujours la même sortie pour la même entrée, ce qui les rend déterministes. Les fonctions pures sont essentielles dans la programmation fonctionnelle, car elles favorisent la prévisibilité, la testabilité et la maintenabilité du code.

Voici quelques exemples de fonctions pures en JavaScript :

  1. Fonction d'addition :
  2. function add(a, b) {
      return a + b;
    }
    

function concatenateArrays(arr1, arr2) {
  return arr1.concat(arr2);
}

3. Fonction de formatage de la date :

function formatDate(date) {
  const year = date.getFullYear();
  const month = date.getMonth() + 1;
  const day = date.getDate();
  return `${year}-${month}-${day}`;
}

4. Fonction de capitalisation des chaînes :

function capitalize(str) {
  return str.charAt(0).toUpperCase() + str.slice(1);
}

En général, les fonctions pures sont des fonctions qui n'ont pas d'effets secondaires et renvoient toujours le même résultat pour la même entrée. Ils sont prévisibles et plus faciles à raisonner, ce qui les rend idéaux pour écrire du code maintenable et réutilisable.

✓ Immuabilité

L'immuabilité est un concept qui consiste à éviter de modifier les structures de données ou les variables une fois qu'elles sont créées. Au lieu de modifier un objet ou un tableau, nous en créons un nouveau avec les modifications souhaitées. Cette approche évite les effets secondaires imprévus et rend le code plus prévisible et plus facile à raisonner.

Voici quelques exemples d'immuabilité en JavaScript :

  1. Utilisation de l'opérateur spread pour créer un nouveau tableau ou objet :
  2. const arr1 = [1, 2, 3];
    const arr2 = [...arr1, 4];
    // arr1 is still [1, 2, 3], arr2 is [1, 2, 3, 4]
    
    const obj1 = { a: 1, b: 2 };
    const obj2 = { ...obj1, c: 3 };
    // obj1 is still { a: 1, b: 2 }, obj2 is { a: 1, b: 2, c: 3 }
    

const arr1 = [1, 2, 3];
const arr2 = arr1.concat(4);
// arr1 is still [1, 2, 3], arr2 is [1, 2, 3, 4]

3. Utiliser Object.assign()pour créer un nouvel objet :

const obj1 = { a: 1, b: 2 };
const obj2 = Object.assign({}, obj1, { c: 3 });
// obj1 is still { a: 1, b: 2 }, obj2 is { a: 1, b: 2, c: 3 }

4. Utilisation Object.freeze()pour empêcher la modification d'un objet :

const obj1 = Object.freeze({ a: 1, b: 2 });
obj1.c = 3;
// obj1 is still { a: 1, b: 2 }, the assignment is ignored

En général, l'immuabilité signifie que les données ne sont pas modifiées directement, mais que de nouvelles copies sont créées lorsque des modifications sont apportées. Cela peut aider à prévenir les effets secondaires imprévus et rendre le code plus prévisible et maintenable.

✓ Récursivité

La récursivité est une technique où une fonction s'appelle elle-même pour résoudre un problème. C'est un outil puissant en programmation fonctionnelle, car il nous permet de résoudre des problèmes complexes en les décomposant en problèmes plus petits et plus simples. Cependant, la récursivité peut être délicate à utiliser, car elle peut entraîner des erreurs de débordement de pile et des problèmes de performances si elle n'est pas utilisée correctement.

Voici quelques exemples de récursivité en JavaScript :

  1. Fonction factorielle :
  2. function factorial(n) {
      if (n === 0) {
        return 1;
      } else {
        return n * factorial(n - 1);
      }
    }
    
    factorial(5); // returns 120 (5! = 5 * 4 * 3 * 2 * 1)
    

function sum(arr) {
  if (arr.length === 0) {
    return 0;
  } else {
    return arr[0] + sum(arr.slice(1));
  }
}

sum([1, 2, 3, 4, 5]); // returns 15 (1 + 2 + 3 + 4 + 5)

3. Fonction de Fibonacci :

function fibonacci(n) {
  if (n === 0 || n === 1) {
    return n;
  } else {
    return fibonacci(n - 1) + fibonacci(n - 2);
  }
}

fibonacci(6); // returns 8 (0, 1, 1, 2, 3, 5, 8)

La récursivité peut être un outil puissant pour résoudre des problèmes qui impliquent la répétition de modèles ou de structures. Cependant, cela peut également entraîner des problèmes de performances et des erreurs de débordement de pile s'il n'est pas implémenté avec soin. Il est important de comprendre le concept de récursivité et de l'utiliser judicieusement dans votre code.

Conclusion

En conclusion, la programmation fonctionnelle est un paradigme important qui peut vous aider à écrire un code plus modulaire, réutilisable et maintenable. En comprenant des concepts essentiels tels que les fonctions en tant que citoyens de première classe, les fonctions d'ordre supérieur, les fonctions pures, l'immuabilité et la récursivité, vous pouvez commencer à écrire du code plus fonctionnel en JavaScript. La programmation fonctionnelle n'est pas la seule façon d'écrire du bon code, mais c'est un outil puissant qui peut vous aider à résoudre des problèmes complexes et à rendre votre code plus prévisible et plus facile à raisonner.