Comment utiliser async await en Javascript<span class="wtr-time-wrap after-title"><span class="wtr-time-number">4</span> min read</span>

Comment utiliser async await en Javascript4 min read

Javascript est fondamentalement asynchrone. Entre le frontend avec les événements et AJAX et le backend avec Node JS qui base tout son fonctionnement sur l’aynchronisme et l’event queue.

Au fil du temps, de nouvelles méthodes se sont développées pour écrire du code asynchrone. Il y a :

  • Les callbacks : Utiliser des fonctions dans d’autres fonctions
  • Les promesses : Une écriture spécifique pour appeler du code de manière asynchrone
  • Le async await : Des mots clés qui permettent de définir la priorité de certaines événements

Async await est l’invention la plus récente. Elle permets de gagner beaucoup de temps en supprimant tout simplement l’implémentation de fonctions qui permettent l’exécution de code asynchrone.

Voyons comment ça fonctionne :

Utiliser async await avec node js

Il y a deux mots clés. Le mot clé async qui permets de déclarer une fonction comme étant asynchrone. Et il y a await, ce mot clé permet d’appeler une fonction asynchrone comme si elle était synchrone :

async function externe(){
    console.log('une fonction asynchrone externe');
    return true
}

async function programme(){
    let resultat = await externe();
}

Ici, on déclare une fonction asynchrone représentant notre programme. On as une seconde fonction qui représente un processus externe, par exemple un appel AJAX

On va appeler cette fonction externe dans notre fonction principale en mettant le mot clé await. On stocke le résultat dans une variable. Ce code ressemblerait à ça sous forme de callback :

function externe(callback){
    console.log('une fonction asynchrone externe');
    return true
}

externe(function(resultat){
    // on fait des trucs avec le resultat
})

Alors vue comme ça, on se dit que ça n’as pas trop d’impact. Mais si on as 10 fonctions. On rentre dans un callback hell pas possible. L’async await nous permets de mieux organiser notre code

Un exemple de callback hell
Un exemple de callback hell

Pourquoi utiliser l’écriture async await

Comme je l’ai dit, javascript est profondément asynchrone. Malheureusement, ça crée des soucis, gérer des callback ou des promesses ce n’est pas toujours simple.

Aujourd’hui, on nous propose une écriture plutôt simple qui permets d’écrire du code asynchrone comme si il était synchrone en ajoutant seulement 2 mots clés.

C’est vraiment aussi simple. Dans certains langages comme Python, il faut implémenter beaucoup de choses. Mais puisque le langage fonctionne déjà de manière asynchrone, ce n’est qu’une question de syntaxe.

Retenez ça, remplacez simplement les appel de callback et les promesses par le mot clé await et déclarez vos fonctions avec async et le tour es joué.

Conclusion

Javascript ou Node JS est souvent complexe. L’asynchronisme fait partie des barrières du langage. L’écriture async await nous permets de gagner un peu de temps et de simplifier les choses.

Si cet article vous as plu, n’hésitez pas à télécharger mon livre PDF qui vous apprendra à bien débuter la programmation.

Vous abonner à notre newsletter

* champ requis

Cet article a 2 commentaires

  1. Par contre,
    ok tu est dev et l’orthographe n’est pas ton fort. Je suis moi même dev et j’écris mal. Mais s’il te plaît, fais des efforts. On pourrai croire à un blog écris par un enfant de 11 ans.
    Relis toi, revois tes tournures de phrases, fais relire tes textes par la famille si il le faut.
    Tu n’a pas l’air incompétent, ne te décrédibilise pas aussi facilement car c’est un enfer à lire.

    1. J’en ai conscience. Je dois t’avouer que je ne sais simplement pas comment m’améliorer. Si tu as des ressources qui pourraient me permettre d’améliorer mon ortographe et mes tournures de phrases, je m’entraînerai avec plaisir.

      Bonne journée

Laisser un commentaire

Fermer le menu
×
×

Panier