Les fonctions de rappel sont des fonctions passées en arguments. Ce modèle de programmation crée une séquence d'appels de fonctions, aussi bien en programmation synchrone qu'asynchrone. Écrire une fonction de rappel ne diffère en rien de l'écriture d'une fonction ; cependant, la fonction de rappel doit correspondre à la signature définie par la fonction appelante.
const squareLength = 5;
// Caller function takes a callback function
function applyToSquare(callback) {
return callback(squareLength);
}
// Callback must expect the possible argument from the calling function
function areaOfSquare(number) {
return number * number;
}
applyToSquare(areaOfSquare); // => 25
Tu peux aussi écrire les fonctions de rappel sous forme d'expression de fonction, d'expression de fonction anonyme ou d'expression de fonction fléchée :
applyToSquare(function squarePerimeter(side) {
return side * 4;
});
applyToSquare(function (side) {
return side * 4;
});
applyToSquare((side) => {
return side * 4;
});
Tu crées un nouveau portail en ligne qui permet à tes clients de commander leurs fruits frais directement chez l'épicier. L'épicier dispose d'une API que tu peux utiliser pour vérifier s'il a le stock souhaité par tes clients. Tu dois créer une petite bibliothèque de fonctions pour interagir avec l'API de l'épicier.
Le portail doit prévenir ton client si sa commande a réussi. Définis la fonction de rappel onSuccess qui sera appelée si la commande a réussi parce que l'épicier avait assez de fruits en stock. Cette fonction doit appeler la fonction notify importée, en lui passant { message: 'SUCCESS' } pour informer ton client que sa commande a réussi.
onSuccess();
// => `notify` called with `{ message: 'SUCCESS' }`
Le portail doit prévenir ton client si sa commande a échoué. Définis la fonction de rappel onError qui sera appelée si la commande a échoué parce que l'épicier n'a pas les fruits en stock ou qu'une erreur s'est produite. Cette fonction doit appeler la fonction notify importée, en lui passant { message: 'ERROR' } pour informer ton client que sa commande a échoué.
onError();
// => `notify` called with `{ message: 'ERROR' }`
Les commandes de fruits sont passées via l'API de l'épicier, à l'aide de la fonction order fournie. Cette fonction prend trois arguments : une requête, contenant la variety et la quantity des fruits demandés, une fonction de rappel à appeler lorsque la commande a réussi, et une fonction de rappel à appeler lorsque la commande rencontre une erreur.
Tu veux isoler ta base de code d'éventuels changements externes et tu décides d'envelopper l'appel à la fonction order dans une nouvelle fonction nommée orderFromGrocer. Implémente la fonction orderFromGrocer qui tente de passer une commande via un appel à la fonction order de l'API de l'épicier, en veillant à transmettre à l'appel d'API les arguments passés à orderFromGrocer.
La requête prend la forme d'un objet :
const query = {
variety: string,
quantity: number,
};
orderFromGrocer(
{ variety: 'pear', quantity: 12 },
exampleSuccessCallback,
exampleErrorCallback,
);
// => `order` was called with the query and the callbacks
Tes clients peuvent désormais passer des commandes de fruits via ton portail. Tu remarques cependant que tu appelles la fonction orderFromGrocer à de nombreux endroits différents dans ta base de code, en devant à chaque fois passer une query et les deux fonctions callback en arguments. Voyant là une occasion de réécrire ton code, tu penses qu'il serait plus simple de pouvoir passer une commande en indiquant simplement la variety et la quantity de fruits nécessaires. Définis la fonction utilitaire postOrder qui prend variety et quantity comme arguments et tente de passer une commande auprès de l'épicier.
postOrder('peach', 100);
// => order placed for 100 peaches
Inscris-toi sur Exercism pour apprendre et maîtriser JavaScript avec 37 concepts159 exercices, et un vrai mentorat humain, le tout gratuitement.