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.

357 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
597 vues
Structures de contrôle : if, else if, else, switch
Structures de Contrôle en JavaScript1. Structure de Contrôle if :La structure de contrôle if permet d'exécuter des blocs de code conditionnellement, en fonction de l'évaluation d'une expression...
JS
1 489 vues
Afficher plus de conversation
Dans cette avant-dernière vidéo sur la création d’une messagerie interne nous allons personnaliser rapidement la page pour afficher les conversations et nous allons également corriger /...
Créer son site de rencontres
5 061 vues
Que mettre dans la balise head
Afin de continuer à faire connaitre votre site pour son référencement nous allons parler du contenu de base dans la balise <head>.La balise <head> joue un rôle essentiel...
Créer son site
14 525 vues
Visiter un profil PHP
Pour visiter le profil d'un autre utilisateur il nous faudra récupérer son ID passer en argument dans l'URL par la méthode $_GET et afficher ses informations comme pour...
Créer son site
629 vues
Tableaux indexés
Les tableaux indexés en PHP sont des structures de données qui permettent de stocker plusieurs valeurs dans une seule variable. Chaque valeur est associée à un indice numérique, à partir de...
PHP
3 801 vues
Création de liens hypertexte avec <a>
Création de liens hypertexte avec <a>La balise <a> (ou <a href="">) est utilisée pour créer des liens hypertexte dans une page HTML. Elle permet de lier le contenu d'une page à...
HTML
3 778 vues
Créer un fichier HTML
Créer un Fichier HTMLPour créer un fichier HTML, vous aurez besoin d'un éditeur de texte simple tel que Notepad (sur Windows) ou TextEdit (sur Mac). Suivez ces étapes simples pour créer votre...
HTML
2 149 vues
Voir son profil en PHP
Maintenant que vous savez comment voir le profil d'un membre du site nous allons apprendre à concevoir notre profil !
Créer son site de rencontres
Publicité
Cette pub permet au site de vivre ...