Callbacks en français

Introduction aux fonctions de rappel

Les fonctions de rappel, ou callbacks, sont des fonctions que l'on passe comme argument à d'autres fonctions. Une fois cette fonction de rappel reçue, elle peut être exécutée au sein de la fonction qui l'a accueillie, souvent appelée fonction d'ordre supérieur. Dans le langage JavaScript, il est possible de transmettre des fonctions comme arguments en raison du fait que les fonctions sont considérées comme des objets.

Exemple de fonction de rappel

Imaginons que nous ayons une fonction qui effectue un calcul et double le résultat obtenu. Voici comment on pourrait la définir :

function doubleResult(num1, num2, calc) {
  return calc(num1, num2) * 2;
}

function add(num1, num2) {
  return num1 + num2;
}

function multiply(num1, num2) {
  return num1 * num2;
}

console.log(doubleResult(4, 2, add));    // Affiche 12
console.log(doubleResult(4, 2, multiply)); // Affiche 16

Dans cet exemple, doubleResult prend trois arguments : num1, num2 et calc. Les deux premiers représentent les valeurs sur lesquelles l'utilisateur souhaite réaliser une opération, tandis que calc est la fonction à utiliser, transmise comme troisième argument. Les fonctions add et multiply représentent des opérations de base qui effectuent l'addition ou la multiplication des deux nombres fournis.

Fonction d'ordre supérieur et fonctions de rappel

La fonction doubleResult est qualifiée de fonction d'ordre supérieur parce qu'elle accepte une autre fonction comme argument. À l'inverse, add et multiply sont considérées comme des fonctions de rappel car elles sont passées à doubleResult.

Exemple d'utilisation

Prenons un nouvel exemple où nous souhaitons créer un tableau transformé à partir d'un tableau existant, en utilisant une fonction de rappel :

function createNewArray(arr, callback) {
  let newArray = [];
  for (let i = 0; i < arr.length; i++) {
    newArray.push(callback(arr[i]));
  }
  return newArray;
}

function square(x) {
  return x * x;
}

console.log(createNewArray([1, 2, 3, 4], square)); // Affiche [1, 4, 9, 16]

Dans cet exemple, createNewArray génère un nouveau tableau en appliquant la fonction de rappel callback à chaque élément du tableau d'entrée arr.

Comment utiliser les callbacks pour construire un site web

Les fonctions de rappel sont essentielles dans le développement web moderne. Par exemple, lors de la gestion d'événements tels que les clics de bouton ou les soumissions de formulaires, nous pouvons passer une fonction qui définit ce qui doit se produire après que l'événement ait eu lieu. Cela permet de rendre nos sites interactifs et réactifs aux actions des utilisateurs. De plus, elles sont souvent utilisées dans les API de JavaScript pour gérer des réponses asynchrones, permettant ainsi de travailler efficacement sans bloquer l'interface utilisateur.