AJAX et Programmation Asynchrone en JavaScript

Technologies Web 2
AJAX et la Programmation
Asynchrone en JavaScript
UPB Technologies Web 2 : Intro/Rappel
2025-2026M. GODE Emmanuel

UPB Technologies Web : Intro/Rappel
2/14
Plan
1- Interrogation des services distants
2-
3-
4-
5-
Les techniques AJAX
Modification du contenu des pages web avec les réponses
.
.

UPB Technologies Web : Intro/Rappel
3/14
AJAX
AJAX – Perspectives historique ?
❑AJAX
✓Asynchronous JavaScript And XML
✓Microsoft en 1998
✓XMLHttpRequest (XHR)
✓XMLHttpRequest lourd et difficile à utilisé
✓Remplacé par fetch() à partir de 2015
✓XMLHttpRequest et fetch supportés de nos jours par tous
les navigateurs
❑AJAX – Historique
✓XMLHttpRequest lourd et difficile à utilisé
✓Remplacé par fetch() à partir de 2015
✓XMLHttpRequest et fetch supportés de nos jours par tous
les navigateurs
✓XMLHttpRequest maintenu pour : Compatibilité
rétroactive
✓ fetch(): méthode préférée des développeurs modernes
✓Dans cette formation: les deux méthodes
❑XML ET JSON
✓X de AJAX = XML
✓Réponse à une requête AJAX en XML (avant)
✓JSON(JavaScript Object Notation) à la place
de XML
✓Le terme AJAX(X = XML) est resté malgré
tout

UPB Technologies Web : Intro/Rappel
4/14
AJAX
Comprendre le principe de l’AJAX ?
❑Dans une requête HTTP classique le processus se
répète à chaque clic ! ❑Problème d’une requête classique
✓Eléments similaire de page en page a chaque
envoi de requête
✓Ce processus bloque la page web
✓Requête HTTP parfois très lentes

UPB Technologies Web : Intro/Rappel
5/14
AJAX
Les fonctions de rappel ?
❑Rappels : Fonction Anonyme
✓Les fonctions anonymes sont des fonctions sans
nom.
✓Elles sont déclarées à la volée et sont souvent
utilisées comme arguments de fonctions ou pour
encapsuler du code.
❑Fonction Fléchée (Arrow Function)
✓Les fonctions fléchées sont une nouvelle syntaxe
concise pour définir des fonctions en JavaScript.
Elles sont particulièrement utiles pour les
fonctions courtes.
// Exemple : Déclaration et appel d'une fonction
anonyme
let result = (function() {
return "Je suis une fonction anonyme!";
})();
console.log(result); // Affiche : "Je suis une fonction
anonyme!"
// Exemple : Déclaration d'une fonction fléchée
const add = (a, b) => a + b;
console.log(add(3, 5)); // Affiche : 8