Aller au contenu
M05 · B. Acquérir les fondamentaux de JavaScript

Gérer les erreurs : les exceptions

Comprendre ce qu'est une exception, l'intercepter avec try, catch et finally, lancer ses propres erreurs avec throw, et afficher un message clair à l'utilisateur.

1Situer

Un convertisseur de devises pour les touristes à Tanger reçoit parfois n'importe quoi : un montant vide, des lettres, un nombre négatif. Sans précaution, le script s'arrête au premier problème et la page ne répond plus. Une application sérieuse prévoit les erreurs et réagit proprement.

2Comprendre

try, catch, finally : le chemin de l'exécution
try {   const dh = convertir(m, dev);   afficher(dh); } catch (erreur) {   afficher(erreur.message); } finally {   console.log('Demande traitée'); } sans erreur :try → finally ✖ throw : Devise inconnue avec erreur :try → catch → finally la page 100 EUR = 1080.00 DH Devise inconnue : GBP 30 USD = 297.00 DH

Le code risqué est dans try, la réaction à l'erreur dans catch, et finally s'exécute dans tous les cas.

1 / 6

Une exception, c’est quoi ?

Une exception est une erreur qui survient pendant l’exécution : une variable inexistante, une méthode appelée sur null, un JSON mal formé, une valeur refusée. Si personne ne l’intercepte, le script s’arrête.

Erreur couranteCause
ReferenceErrorvariable ou fonction inconnue (faute de frappe)
TypeErroropération impossible sur cette valeur (null.length)
SyntaxErrorcode mal écrit, ou JSON.parse sur un texte invalide
RangeErrorvaleur hors limites ((5).toFixed(200))

try, catch, finally

try {
  const dh = convertir(montant, devise);      // peut échouer
  afficher(dh);
} catch (erreur) {
  afficherMessage(erreur.message);             // on réagit proprement
} finally {
  console.log('Demande traitée');              // toujours exécuté
}

Lancer une exception

Une fonction qui reçoit une valeur impossible refuse de continuer :

function convertir(montant, devise) {
  if (!(devise in taux)) throw new Error(`Devise inconnue : ${devise}`);
  if (montant <= 0) throw new Error('Montant invalide');
  return (montant * taux[devise].valeur).toFixed(2);
}

L’appelant décide quoi faire : afficher un message, utiliser une valeur par défaut, réessayer.

Bonnes pratiques

  • des messages d’erreur compréhensibles pour l’utilisateur ;
  • un try autour du code qui peut échouer, pas autour de tout le programme ;
  • ne jamais laisser un catch vide : au minimum console.error(erreur).
Exemple simple

Le filet de l'acrobate

L'acrobate tente son numéro (try). S'il tombe, le filet le rattrape (catch). À la fin, quoi qu'il arrive, il salue le public (finally).

try {
  numeroPerilleux();
} catch (erreur) {
  console.log('Rattrapé :', erreur.message);
} finally {
  console.log('Salut au public');
}
Exemple simple

Le caissier qui refuse un billet

Le caissier refuse un billet déchiré et le dit clairement. throw permet à une fonction de refuser une valeur invalide avec un message précis.

if (montant <= 0) {
  throw new Error('Le montant doit être positif');
}

3Manipuler

La fonction convertir() plante sur les mauvaises valeurs et arrête tout le script. Rendez-la robuste : chaque ligne de la liste doit s'afficher, avec un message d'erreur clair quand la valeur est invalide.
Ouvrir dans le lab ↗
Console
  • Dans convertir, lancez une erreur (throw) « Devise inconnue : GBP » si la devise n'existe pas
  • Lancez une erreur « Montant invalide » si le montant est négatif ou nul
  • Entourez l'appel de try / catch pour que les 4 lignes s'affichent
  • Les lignes d'erreur ont la classe erreur (en rouge)
  • Ajoutez un finally qui écrit « Demande traitée » dans la console

4Pratiquer

Exercice 1 · Lire le message d'une exception

Que s'affiche-t-il ? try { null.toUpperCase(); } catch (e) { console.log(e.name); }

Voir le corrigé
TypeError
(on ne peut pas appeler une méthode sur null : e.message contient
 « Cannot read properties of null (reading 'toUpperCase') »)

Exercice 2 · JSON invalide

JSON.parse lance une exception si le texte n'est pas du JSON valide. Écrivez une fonction lireJSON(texte) qui renvoie l'objet, ou null en cas d'erreur.

Voir le corrigé
function lireJSON(texte) {
  try {
    return JSON.parse(texte);
  } catch (e) {
    console.warn('JSON invalide :', e.message);
    return null;
  }
}

Exercice 3 · Où mettre le try ?

Faut-il entourer tout le programme d'un seul try / catch ? Expliquez.

Voir le corrigé
Non. On entoure seulement le code qui peut échouer et que l'on sait traiter
(une saisie, une conversion, un appel au serveur), pour réagir précisément :
message à l'utilisateur, valeur par défaut, nouvel essai. Un try géant cache
les vraies erreurs de programmation.

5Vérifier

1. Que se passe-t-il quand une exception n'est pas interceptée ?
2. Quand s'exécute le bloc finally ?
3. Comment lancer sa propre erreur ?