La **programmation asynchrone** est un modèle de programmation qui permet d'exécuter des
tâches de manière non bloquante. Cela signifie que le programme peut continuer à fonctionner
pendant que des opérations potentiellement longues (comme des requêtes réseau, des lectures de
fichiers, ou des timers) sont en cours d'exécution. Cela contraste avec la programmation synchrone,
où chaque opération doit être terminée avant que la suivante ne commence.
Qu'est-ce que la programmation asynchrone ?**
1. **Non-blocage** :
En programmation asynchrone, les opérations qui prennent du temps (comme les appels réseau ou
les accès à une base de données) ne bloquent pas l'exécution du reste du code. Au lieu de cela, ces
opérations sont lancées en arrière-plan, et le programme continue à exécuter d'autres tâches.
2. **Gestion des tâches longues** :
Les opérations asynchrones sont utiles pour gérer des tâches qui pourraient prendre un temps
indéterminé, comme :
- Les requêtes HTTP (exemple : récupérer des données depuis une API).
- Les lectures/écritures de fichiers.
- Les timers (exemple : `setTimeout` ou `setInterval`).
3. **Callbacks, Promesses et Async/Await** :
En JavaScript, la programmation asynchrone est gérée à l'aide de plusieurs mécanismes :
- **Callbacks** : Fonctions passées en argument à une autre fonction, appelées une fois l'opération
asynchrone terminée.
- **Promesses (Promises)** : Objets qui représentent une valeur future, avec des méthodes
comme `.then()` et `.catch()` pour gérer le succès ou l'échec.
- **Async/Await** : Syntaxe moderne qui permet d'écrire du code asynchrone de manière plus
lisible, comme s'il était synchrone.
Pourquoi utiliser la programmation asynchrone ?
1. **Améliorer les performances** :
En évitant de bloquer l'exécution du programme, on peut gérer plusieurs tâches simultanément, ce
qui est essentiel pour les applications modernes (comme les applications web).
2. **Réactivité** :
Dans une interface utilisateur, la programmation asynchrone permet de garder l'application
réactive pendant que des tâches longues s'exécutent en arrière-plan.
3. **Optimisation des ressources** :
Au lieu d'attendre qu'une tâche se termine, le programme peut utiliser ce temps pour exécuter
d'autres tâches, ce qui optimise l'utilisation des ressources.
Exemples concrets**
#### 1. **Programmation synchrone (bloquante)**
```javascript
[Link]("Début");
for (let i = 0; i < 1000000000; i++) {} // Boucle longue qui bloque l'exécution
[Link]("Fin");
```
Dans cet exemple, le programme est bloqué pendant l'exécution de la boucle, et "Fin" ne s'affiche
qu'après la fin de la boucle.
2. **Programmation asynchrone (non bloquante)**
```javascript
[Link]("Début");
setTimeout(() => {
[Link]("Opération asynchrone terminée");
}, 2000); // Simule une opération asynchrone de 2 secondes
[Link]("Fin");
```
Résultat :
```
Début
Fin
Opération asynchrone terminée (après 2 secondes)
```
Ici, `setTimeout` lance une opération asynchrone, mais le programme continue à exécuter le code
suivant (`[Link]("Fin")`) sans attendre que l'opération se termine.
Mécanismes de la programmation asynchrone en JavaScript**
#### 1. **Callbacks**
Un callback est une fonction passée en argument à une autre fonction, qui est appelée une fois
l'opération asynchrone terminée.
**Exemple :**
```javascript
function fetchData(callback) {
setTimeout(() => {
const data = "Données reçues";
callback(data);
}, 1000);
fetchData((data) => {
[Link](data); // "Données reçues" après 1 seconde
});
Promesses (Promises)**
Une promesse représente une valeur future. Elle peut être résolue (succès) ou rejetée (échec).
**Exemple :**
```javascript
const promise = new Promise((resolve, reject) => {
setTimeout(() => {
resolve("Succès !");
}, 1000);
});
promise
.then((result) => [Link](result)) // "Succès !"
.catch((error) => [Link](error));
```
---
#### 3. **Async/Await**
`async/await` est une syntaxe moderne pour travailler avec des promesses. Une fonction `async`
retourne toujours une promesse, et `await` pause l'exécution jusqu'à ce que la promesse soit
résolue.
**Exemple :**
```javascript
async function fetchData() {
try {
const response = await fetch("[Link]
const data = await [Link]();
[Link](data);
} catch (error) {
[Link]("Erreur :", error);
fetchData();
```
---
### **Différence entre synchrone et asynchrone**
| **Aspect** | **Synchrone** | **Asynchrone** |
|--------------------------|--------------------------------------------|---------------------------------------------|
| **Blocage** | Bloque l'exécution jusqu'à la fin de la tâche. | Ne bloque pas l'exécution.
|
| **Performance** | Peut être lent pour les tâches longues. | Optimisé pour les tâches
longues. |
| **Utilisation** | Simple, mais peu adapté aux tâches longues. | Idéal pour les tâches longues
ou réseau. |
| **Exemples** | Boucles, calculs intensifs. | Requêtes HTTP, timers, lectures de
fichiers.|
---
### **Résumé**
- La **programmation asynchrone** permet d'exécuter des tâches sans bloquer l'exécution du reste
du programme.
- Elle est essentielle pour gérer des opérations longues (comme les requêtes réseau) tout en gardant
l'application réactive.
- En JavaScript, elle est implémentée via des **callbacks**, des **promesses** et la syntaxe
**async/await**.
