Les Callbacks en JavaScript


Les callbacks sont des fonctions passées en tant qu'arguments à d'autres fonctions, qui seront exécutées ultérieurement ou de manière asynchrone. Les callbacks sont largement utilisés en JavaScript, en particulier pour gérer des opérations asynchrones telles que les requêtes AJAX, les animations et les événements.


1. Utilisation des Callbacks :


Les callbacks sont utilisés pour spécifier le comportement à exécuter après l'achèvement d'une opération asynchrone. Ils sont souvent passés en tant qu'arguments à des fonctions qui effectuent ces opérations.


Exemple de Callback :


function traiterDonnees(callback) {
    // Simulation d'une opération asynchrone
    setTimeout(function() {
        let resultat = 'Données traitées avec succès';
        callback(resultat);
    }, 1000);
}

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

traiterDonnees(afficherResultat); // Passer la fonction afficherResultat comme callback


2. Callbacks Anonymes :


Vous pouvez également passer des fonctions anonymes comme callbacks. Cela est courant lorsqu'une fonction de rappel est simple et n'a pas besoin d'être réutilisée ailleurs dans le code.


Exemple de Callback Anonyme :


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


3. Gérer les Erreurs avec les Callbacks :


Les callbacks peuvent également être utilisés pour gérer les erreurs lors d'opérations asynchrones. Traditionnellement, le premier argument passé au callback est réservé pour les erreurs, tandis que les résultats sont passés en arguments suivants.


Exemple de Gestion d'Erreurs avec Callbacks :


function traiterDonnees(callback) {
    // Simulation d'une opération asynchrone
    setTimeout(function() {
        let erreur = null; // Aucune erreur
        let resultat = 'Données traitées avec succès';
        callback(erreur, resultat);
    }, 1000);
}

traiterDonnees(function(erreur, resultat) {
    if (erreur) {
        console.error('Erreur : ' + erreur);
    } else {
        console.log(resultat);
    }
});


4. Callbacks dans les Fonctions de Haut Niveau :


Les callbacks sont souvent utilisés dans les fonctions de haut niveau telles que forEach, map, filter, etc. Ces fonctions acceptent une fonction de rappel en argument pour être appliquée à chaque élément d'un tableau.


Exemple d'Utilisation de Callbacks avec forEach :


let nombres = [1, 2, 3, 4, 5];

nombres.forEach(function(nombre) {
    console.log(nombre * 2);
});


5. Utilisation de Promesses et de Fonctions Asynchrones :


Bien que les callbacks soient couramment utilisés pour gérer les opérations asynchrones, les promesses et les fonctions asynchrones sont maintenant largement utilisées pour des opérations plus complexes, offrant une syntaxe plus claire et évitant les problèmes de l'enfer des callbacks (callback hell).


Exemple de Promesse :


function traiterDonnees() {
    return new Promise(function(resolve, reject) {
        setTimeout(function() {
            let erreur = null; // Aucune erreur
            let resultat = 'Données traitées avec succès';
            resolve(resultat);
        }, 1000);
    });
}

traiterDonnees()
  .then(function(resultat) {
      console.log(resultat);
  })
  .catch(function(erreur) {
      console.error('Erreur : ' + erreur);
  });


En résumé, les callbacks sont une fonction essentielle en JavaScript, particulièrement utile pour gérer des opérations asynchrones. En comprenant comment les utiliser et les passer comme arguments à d'autres fonctions, vous pouvez développer des applications JavaScript plus dynamiques et réactives.

198 vues
Posté le 22 avril 2024
Publicité Sitedudev
Cette pub permet au site de vivre ...
Publicité
Cette pub permet au site de vivre ...
Voir d'autres articles
1 356 vues
Voir plus de messages (1/2)
Dans cette nouvelle vidéo nous allons ajouter un bouton 'voir plus' qui va nous permettre de voir d'anciens messages. Nous allons commencer par mettre en place le bouton suivi du procédé pour voir...
Créer son site de rencontres
2 028 vues
Définition des caractéristiques de la base de données : le nom, le jeu de caractères, etc.
1. Accéder à PhpMyAdmin :Ouvrez un navigateur web et accédez à l'URL où vous avez installé PhpMyAdmin sur votre serveur.2. Authentification :Connectez-vous à PhpMyAdmin en utilisant vos...
SQL
3 248 vues
Mise en évidence du texte avec <em>, <strong>, <u> et <s>
Mise en évidence du texte avec <em>, <strong>, <u> et <s>Les balises <em>, <strong>, <u> et <s> sont utilisées pour mettre en évidence le texte dans...
HTML
1 486 vues
Afficher les messages dans l'ordre
Dans cette vidéo on va personnaliser (un peu) l'interface des conversations avec du CSS.Nous allons également remettre les messages dans l'ordre et lors de la réception du message par le...
Créer son site de rencontres
6 739 vues
Comment développe-t-on un site ?
Je suppose que si vous lisez ceci c'est que vous n'avez peut-être jamais développé auparavant et que vous souhaitez apprendre à développer votre premier site web.Si je vous parle...
Créer son site
239 vues
Consommation d'API REST
Consommation d'API REST en JavaScriptLa consommation d'API REST en JavaScript est une tâche courante dans le développement web moderne. Les API REST permettent aux applications d'envoyer et de...
JS
3 549 vues
Créer un topic
Créer un topicDans notre dossier **f_forum**, nous allons créer une nouvelle page creer_topic.php. Cette page permettra à vos utilisateurs de pouvoir créer un topic afin de demande de l'aide,...
Créer son site
4 317 vues
Afficher la liste des topics
Dans notre dossier f_forum, nous allons créer une nouvelle page sujet.php. Cette page affichera la liste des topiques créer par les utilisateurs de votre site en fonction de la catégorie...
Créer son site
Publicité
Cette pub permet au site de vivre ...