Programmation asynchrone en JavaScript : guide complet pour Node.js

Formateur Python en ligne pour débutants

Apprenez Python facilement sans surcharge théorique. Résolvez des tâches pratiques avec vérification automatique et écrivez du code directement dans le navigateur.

Start Course

Introduction à la programmation asynchrone en JavaScript



JavaScript est un langage de programmation monothread avec un modèle non bloquant orienté événements. Dans l'environnement Node.js, la programmation asynchrone n'est pas simplement une option pratique, mais une nécessité fondamentale. Sans asynchronisme, une application serveur serait bloquée à chaque requête de base de données, lecture de fichier ou appel réseau, la rendant inutilisable en conditions réelles.



Dans ce guide, nous allons analyser les trois paradigmes principaux de la programmation asynchrone en JavaScript : Callback, Promise et async/await. Vous apprendrez comment fonctionne l'Event Loop, comment gérer les erreurs et écrire du code lisible et performant pour Node.js.



1. Callback : le fondement de l'asynchronisme



Un Callback (fonction de rappel) est une fonction passée en argument à une autre fonction et appelée après l'achèvement d'une opération asynchrone. C'est le modèle d'asynchronisme le plus ancien et le plus basique en JavaScript.



Exemple simple avec Callback



const fs = require('fs');

// Lecture asynchrone d'un fichier avec callbackfs.readFile('example.txt', 'utf8', (err, data) => { if (err) { console.error('Erreur de lecture du fichier :', err); return; } console.log('Contenu du fichier :', data);});

console.log('Lecture du fichier lancée...');// Affichage : "Lecture du fichier lancée..." apparaîtra avant le contenu du fichier


Dans cet exemple, la fonction callback ne s'exécutera qu'après la lecture complète du fichier. Pendant ce temps, le thread principal continue son exécution — c'est le comportement non bloquant.



Callback Hell (L'enfer des rappels)



Le principal inconvénient des callbacks est la perte rapide de lisibilité avec des appels imbriqués :



// L'enfer des rappelsgetUser(1, (err, user) => {  if (err) throw err;  getPosts(user.id, (err, posts) => {    if (err) throw err;    getComments(posts[0].id, (err, comments) => {      if (err) throw err;      console.log(user.name, posts[0].title, comments);    });  });});


Ce code est difficile à déboguer, maintenir et étendre. Heureusement, le JavaScript moderne propose des solutions bien plus élégantes.



2. Promise : promesse de résultat



Une Promise (promesse) est un objet représentant le résultat d'une opération asynchrone, qui peut être tenue (fulfilled), rejetée (rejected) ou en attente (pending). Les promesses permettent d'éviter l'imbrication et de construire des chaînes d'appels.



Création et utilisation d'une Promise



// Fonction retournant une Promisefunction readFilePromise(filename) {  return new Promise((resolve, reject) => {    const fs = require('fs');    fs.readFile(filename, 'utf8', (err, data) => {      if (err) {        reject(err); // Erreur — la promesse est rejetée      } else {        resolve(data); // Succès — la promesse est tenue      }    });  });}

// Utilisation de la promessereadFilePromise('example.txt') .then(data => { console.log('Contenu :', data); return data.length; }) .then(length => { console.log('Longueur du texte :', length); }) .catch(err => { console.error('Erreur :', err); });


Méthodes Promise.all et Promise.race



Promise.all permet d'attendre l'exécution de toutes les promesses, tandis que Promise.race attend la première terminée :



const p1 = readFilePromise('file1.txt');const p2 = readFilePromise('file2.txt');const p3 = readFilePromise('file3.txt');

// On attend les trois fichiersPromise.all([p1, p2, p3]) .then(([data1, data2, data3]) => { console.log('Tous les fichiers sont chargés'); console.log(data1, data2, data3); }) .catch(err => console.error('Erreur dans l\'un des fichiers :', err));

// On attend le premier terminéPromise.race([p1, p2, p3]) .then(firstResult => { console.log('Premier fichier chargé :', firstResult); });


3. Async/Await : style synchrone pour code asynchrone

Blogs

Book Recommendations