Une fonction de rappel (en anglais callback function ou high-order function) est une fonction qui est passée en paramètre à une autre fonction. C'est cette autre fonction qui se chargera d'appeler la fonction de rappel.
Par exemple, le code suivant appelle la fonction de rappel afficherPopup() lorsque l'usager clique sur une division.
let case = document.getElementById('une-case');
if (case != null) {
case.addEventListener('click', afficherPopup);
}
Remarquez qu'il n'y a pas de parenthèses après le nom de la fonction de rappel puisqu'on ne veut pas l'exécuter immédiatement.
Dans ce contexte, il n'est pas possible de spécifier directement quels paramètres la fonction de rappel recevra. Mais comment faire pour spécifier le message à afficher avec notre fonction maison afficherPopup() ?
// fonction de rappel
function afficherPopup(message) {
...
}
La méthode bind() permet de régler ce problème.
Elle attend toujours au moins un paramètre : une référence à l'objet qui portera le nom this dans la fonction de rappel. Si la fonction de rappel n'en a pas besoin, vous pouvez passer la valeur null.
Il est possible de lui passer ensuite autant de paramètres que désiré. Ces paramètres seront passés directement à la fonction de rappel.
case.addEventListener('click', afficherPopup.bind(this, 'Voici la valeur passée en paramètre'));
La méthode bind() peut être utilisée dans d'autres contextes que addEventListener(), en autant qu'une fonction de rappel soit utilisée.
Voici un exemple où elle est utile.
// fonction qui fait appel à une fonction callback
function faireQuelqueChose(callback) {
// fait quelque chose
if (...) {
callback(); // exécute la fonction de rappel
}
}
// fonction de rappel
function fonctionAvecParametres(unParametre, unAutreParametre) {
// fait quelque chose
}
// appel
let callback = fonctionAvecParametres.bind(null, "A", "B");
faireQuelqueChose(callback);
« Understand JavaScript Callback Functions and Use Them ». JavaScript is sexy. https://javascriptissexy.com/understand-javascript-callback-functions-and-use-them/
▼Publicité
