Movatterモバイル変換


[0]ホーム

URL:


MDN Web Docs

Cette page a été traduite à partir de l'anglais par la communauté. Vous pouvez également contribuer en rejoignant la communauté francophone sur MDN Web Docs.

Contrôle du flux d'instructions et gestion des erreurs

JavaScript supporte nativement un ensemble d'instructions. Ces instructions permettent de définir les logiques des algorithmes, le flux des informations, etc. Ce chapitre fournit un aperçu sur le fonctionnement de ces différentes instructions JavaScript.

LesRéférences de JavaScript contiennent plus de détails sur les différentes instructions décrites dans ce chapitre.

Toute expression est une instruction, voir la pageExpressions et opérateurs pour plus d'informations sur les expressions. En JavaScript, le point-virgule (;) est utilisé afin de séparer des instructions dans le code.

Les blocs d'instruction

L'instruction la plus simple est l'instruction de bloc qui permet de regrouper des instructions. Un bloc est délimité par une paire d'accolades :

js
{   instruction_1;   instruction_2;   ⋮   instruction_n;}

Exemple

Les instructions de blocs sont souvent utilisées avec les instructions conditionnelles et itératives telles queif,for,while.

js
while (x < 10) {  x++;}

Ici,{ x++; } représente le bloc.

Note :En JavaScript, avant ECMAScript 2015 (aussi appelé ES6), les blocsn'introduisaient pas de nouvelles portées. Les variables introduites dans le bloc avec l'instructionvar font partie de la portée de la fonction englobante ou du script. Les effets de leur définition persistent en dehors du bloc. Les blocs seuls utilisés avecvar (et nonlet) pourront laisser penser que ce bloc se comportera comme en C ou en Java. Par exemple :

js
var x = 1;{  var x = 2;}console.log(x); // affichera 2

Cella affichera 2 car l'instructionvar x contenue dans le bloc fait partie de la même portée que l'instructionvar x écrite avant le bloc. En C ou en Java, le code équivalent à cet exemple aurait produit 1.

Cela a évolué avec ECMAScript 2015 (ES6). Les instructionslet etconst permettent de déclarer des variables dont la portée est celle du bloc courant. Voir les pages des référenceslet etconst.

Les instructions conditionnelles

Une instruction conditionnelle est un ensemble de commandes qui s'exécutent si une condition donnée est vérifiée. JavaScript possède deux instructions conditionnelles :if...else etswitch.

Instructionif...else

On utilise l'instructionif lorsqu'on souhaite exécuter une instruction si une condition logique est vérifiée (vraie). La clauseelse est optionnelle et permet de préciser les instructions à exécuter si la condition logique n'est pas vérifiée (l'assertion est fausse). Voici un exemple qui illustre l'utilisation de l'instructionif :

js
if (condition) {  instruction_1;} else {  instruction_2;}

condition peut correspondre à n'importe quelle expression qui est évaluée àtrue (vrai) oufalse (faux). Voir la page sur lesbooléens pour plus d'informations sur les évaluations qui fournissent les valeurstrue oufalse. Si lacondition vauttrue,instruction_1 est exécutée, sinoninstruction_2 sera exécutée.instruction_1 etinstruction_2 peuvent correspondre à n'importe quelle instruction, y compris d'autres instructionsif.

Si on doit tester différentes conditions les unes à la suite des autres, il est possible d'utiliserelse if pour lier les différents tests. On l'utilise de la façon suivante :

js
if (condition_1) {  instruction_1;} else if (condition_2) {  instruction_2;} else if (condition_n) {  instruction_n;} else {  dernière_instruction;}

Afin d'exécuter plusieurs instructions, on peut les regrouper grâce aux blocs ({ ... }) vus précédemment. C'est une bonne pratique que de les utiliser, surtout si on imbrique plusieurs instructionsif les unes dans les autres:

Meilleure pratique

En général, il est bon de toujours utiliser des instructions de type bloc —surtout lorsqu'on imbrique des instructionsif :

js
if (condition) {  instruction_1_exécutée_si_condition_vraie;  instruction_2_exécutée_si_condition_vraie;} else {  instruction_3_exécutée_si_condition_fausse;  instruction_4_exécutée_si_condition_fausse;}

Attention à ne pas utiliser des instructions d'affectation dans les expressions conditionnelles. On peut, en effet, très facilement confondre l'affectation et le test d'égalité en lisant le code.

Voici un exemple de ce qu'il ne fautpas faire :

js
if (x = y) {  /* exécuter des instructions */}

Ici, on ne teste pas si x vaut y, on affecte la valeur de y à x ! Si vous devez à tout prix utiliser une affectation dans une expression conditionnelle, une bonne pratique sera d'ajouter des parenthèses en plus autour de l'affectation. Par exemple :

js
if ((x = y)) {  /* exécuter des instructions */}

Valeurs équivalentes à false dans un contexte booléen (falsy values)

Les valeurs suivantes sont évaluées àfalse (également connues sous le nom devaleurs Falsy) :

  • false
  • undefined
  • null
  • 0
  • NaN
  • la chaîne de caractères vide ("")

Les autres valeurs, y compris les objets, seront équivalents àtrue.

Attention :Ne pas confondre les valeurs booléennes « primitives »true etfalse avec les valeurs créées grâce à un objetBoolean.

Par exemple, on aura :

js
var b = new Boolean(false);  if (b) // cette condition est bien vérifiée !  if (b === true) // cette condition n'est pas vérifiée !

Exemple

Dans l'exemple qui suit, la fonctioncheckData renvoietrue si une chaîne de caractères mesure trois caractères. Sinon, elle affiche une alerte et renvoiefalse.

js
function checkData(maChaîne) {  if (maChaîne.length == 3) {    return true;  } else {    alert(      "Veuillez saisir trois caractères. " + maChaîne + " n'est pas valide.",    );    return false;  }}

L'instructionswitch

L'instructionswitch permet à un programme d'évaluer une expression et d'effectuer des instructions en fonction des différents cas de figures correspondants aux différentes valeurs. Si un cas correspond au résultat de l'évaluation, le programme exécute l'instruction associée.

Voici un exemple utilisant une instructionswitch :

js
switch (expression) {  case label_1:    instructions_1    [break;]  case label_2:    instructions_2    [break;]  ...  default:    instructions_par_defaut    [break;]}

JavaScript évalue l'instruction de commutation ci-dessus comme suit :

  • Le programme recherche d'abord une clausecase dont l'étiquette correspond à la valeur de l'expression, puis il transfère le contrôle à cette clause, en exécutant les instructions associées.
  • Si aucune étiquette correspondante n'est trouvée, le programme recherche la clause optionnelledefault :
    • Si une clausedefault est trouvée, le programme transfère le contrôle à cette clause, exécutant les déclarations associées.
    • Si aucune clausedefault n'est trouvée, le programme reprend l'exécution à l'instruction qui suit la fin deswitch.
    • (Par convention, la clausedefault est écrite comme la dernière clause, mais il n'est pas nécessaire que ce soit le cas).

L'instruction break

L'instruction optionnellebreak, éventuellement contenue pour chaque clausecase, permet de ne pas exécuter les instructions pour les cas suivants. Sibreak n'est pas utilisé, le programme continuera son exécution avec les autres instructions contenues dans l'instructionswitch.

Exemple

Dans l'exemple suivant, sifruit vaut "Banane", le programme exécutera les instructions associées. Quandbreak est rencontré, le programme passe aux instructions décrites aprèsswitch. Ici, sibreak n'était pas présent, les instructions pour le cas "Cerise" auraient également été exécutées.

js
switch (fruit) {  case "Orange":    console.log("Les oranges sont à 60 centimes le kilo.");    break;  case "Pomme":    console.log("Les pommes sont à 32 centimes le kilo.");    break;  case "Banane":    console.log("Les bananes sont à 48 centimes le kilo.");    break;  case "Cerise":    console.log("Les cerises sont à 3€ le kilo.");    break;  case "Mangue":    console.log("Les mangues sont à 50 centimes le kilo.");    break;  default:    console.log("Désolé, nous n'avons pas de " + fruittype + ".");}console.log("Souhaitez-vous autre chose ?");

Les instructions pour gérer les exceptions

Il est possible de lever des exceptions avec l'instructionthrow et de les gérer (les intercepter) avec des instructionstry...catch.

Les types d'exception

En JavaScript, n'importe quel objet peut être signalé comme une exception. Cependant, afin de respecter certaines conventions et de bénéficier de certaines informations, on pourra utiliser les types destinés à cet effet :

L'instructionthrow

L'instructionthrow est utilisée afin de signaler une exception. Lorsqu'on signale une exception, on définit une expression qui contient la valeur à renvoyer pour l'exception :

js
throw expression;

Il est possible d'utiliser n'importe quelle expression, sans restriction de type. Le fragment de code qui suit illustre les différentes possibilités :

js
throw "Erreur2"; //type Stringthrow 42; //type Numberthrow true; //type Booleanthrow {  toString: function () {    return "je suis un objet !";  },};

Note :Vous pouvez spécifier un objet lorsque vous lancez une exception. Vous pouvez alors faire référence aux propriétés de l'objet dans le bloccatch.

js
// On crée le constructeur pour cet objetfunction ExceptionUtilisateur(message) {  this.message = message;  this.name = "ExceptionUtilisateur";}// On surcharge la méthode toString pour afficher// un message plus explicite (par exemple dans la console)ExceptionUtilisateur.prototype.toString = function () {  return this.name + ': "' + this.message + '"';};// On crée une instance pour ce type d'objet// et on renvoie une exception avec cette instancethrow new ExceptionUtilisateur("La valeur fournie est trop élevée.");

L'instructiontry...catch

L'instructiontry...catch permet de définir un bloc d'instructions qu'on essaye (try en anglais) d'exécuter, ainsi qu'une ou plusieurs instructions à utiliser en cas d'erreur lorsqu'une exception se produit. Si une exception est signalée, l'instructiontry...catch permettra de l' « attraper » (catch en anglais) et de définir ce qui se passe dans ce cas.

L'instructiontry...catch se compose d'un bloctry qui contient une ou plusieurs instructions et blocscatch qui contiennent les instructions à exécuter lorsqu'une exception se produit dans le bloctry.

Autrement dit, dans la plupart des cas pour le programme, on veut que les instructions du bloctry se déroulent normalement et en cas de problème, on passe le contrôle au bloccatch. Si une instruction contenue dans le bloctry renvoie une exception, le contrôle sera immédiatement transféré au bloccatch. Si aucune exception n'est signalée au sein du bloctry, le bloccatch ne sera pas utilisé. Cette instruction peut comporter un blocfinally qui s'exécute après les blocstry etcatch mais avant les instructions suivant l'instructiontry...catch.

Dans l'exemple qui suit, on utilise une instructiontry...catch. On définit une fonction qui prend un nombre et renvoie le nom du mois correspondant à ce nombre. Si la valeur fournie n'est pas comprise entre 1 et 12, on signale une exception avec la valeur"NuméroMoisInvalide". Lorsque cette exception est gérée dans le bloccatch, la variablenomMois recevra la valeur"inconnu".

js
function getNomMois(numMois) {  numMois = numMois - 1; // On décale de 1 car les indices du tableaux commencent à 0  var mois = [    "Janvier",    "Février",    "Mars",    "Avril",    "Mai",    "Juin",    "Juillet",    "Août",    "Septembre",    "Octobre",    "Novembre",    "Décembre",  ];  if (mois[numMois] != null) {    return mois[numMois];  } else {    throw "NuméroMoisInvalide"; // Ici on utilise l'instruction throw  }}try {  // les instructions à essayer si tout se passe bien  nomMois = getNomMois(maVarMois); // La fonction peut renvoyer une exception} catch (e) {  nomMois = "inconnu";  gestionErreurLog(e); // on gère l'erreur avec une fonction}

Le bloccatch

Un bloccatch peut être utilisé afin de gérer les exceptions pouvant être générées par les instructions du bloctry.

js
catch (ident) {  statements}

Le bloccatch définit un identifiant (ident dans le fragment de code précédent) qui contiendra la valeur passée par l'instructionthrow. Cet identifiant peut être utilisé afin de récupérer des informations sur l'exception qui a été signalée.

JavaScript crée cet identifiant lorsque le contrôle passe au bloccatch. L'identifiant ne « vit » qu'à l'intérieur du bloccatch et une fois que l'exécution du bloccatch est terminée, l'identifiant n'est plus disponible.

Dans l'exemple suivant, le code renvoie une exception. Lorsque celle-ci est signalée, le contrôle passe au bloccatch.

js
try {  throw "monException"; // on génère une exception} catch (e) {  // les instructions utilisées pour gérer les exceptions  enregistrerErreurs(e); // on passe l'objet représentant l'exception à une fonction utilisée pour gérer les erreurs}

Note :Quand on souhaite afficher des erreurs dans la console, on privilégieraconsole.error() plutôt queconsole.log(). En effet, cette première méthode est plus adaptée et indiquera plus d'informations.

Le blocfinally

Le blocfinally contient les instructions à exécuter après les blocstry etcatch mais avant l'instruction suivant letry...catch...finally.

Le blocfinally est exécuté dans tous les cas,qu'une exception ait été levée ou non. Si une exception est signalée et qu'il n'y a pas de bloccatch pour la gérer, les instructions du blocfinally seront tout de même exécutées.

Le blocfinally peut être utilisé afin de finir proprement l'exécution malgré une exception. On peut, par exemple, devoir libérer une ressource, ou fermer un flux, etc.

Dans l'exemple suivant, on écrit dans un fichier, si une exception se produit lors de l'écriture, on utilisera le blocfinally afin de bien fermer le flux vers le fichier avant la fin du script.

js
ouvrirFichier();try {  écrireFichier(données); // Une erreur peut se produire} catch (e) {  gérerException(e); // On gère le cas où on a une exception} finally {  fermerFichier(); // On n'oublie jamais de fermer le flux.}

Si le blocfinally renvoie une valeur, cette valeur sera considérée comme la valeur de retour pour tout l'ensembletry-catch-finally, quelles que soient les instructionsreturn éventuellement utilisées dans les blocstry etcatch :

js
function f() {  try {    console.log(0);    throw "bug";  } catch (e) {    console.log(1);    return true; // Cette instruction est bloquée jusqu'à la fin du bloc finally    console.log(2); // Ne pourra jamais être exécuté  } finally {    console.log(3);    return false; // On surcharge l'instruction "return" précédente    console.log(4); // Ne pourra jamais être exécuté  }  // "return false" est exécuté  console.log(5); // Ne pourra jamais être exécuté}f(); // affiche 0, 1, 3 puis renvoie false

Lorsqu'on surcharge les valeurs de retour avec le blocfinally, cela s'applique également aux exceptions qui sont levées (ou retransmises) au sein du bloccatch :

js
function f() {  try {    throw "problème";  } catch (e) {    console.log('"problème" interne intercepté');    throw e; // cette instruction est mise en attente    // tant que le bloc finally n'est pas fini  } finally {    return false; // surcharge le "throw" précédent  }  // "return false" est exécuté à ce moment}try {  f();} catch (e) {  // ce bloc n'est jamais utilisé car le throw  // utilisé dans le bloc catch a été surchargé  // par l'instruction return de finally  console.log('"problème" externe intercepté');}// Sortie// "problème" interne attrapé

Imbriquer des instructionstry...catch

Il est possible d'imbriquer une ou plusieurs instructionstry...catch.

Si un bloctry interne n'apas de bloccatch correspondant :

  1. ildoit contenir un blocfinally, et
  2. le bloctry...catch de l'instructioncatch englobante est vérifié pour une correspondance.

Pour plus d'informations, voirnested try-blocks sur la page de référencetry...catch.

Utiliser les objets d'erreur

En fonction du type d'erreur qui est créée, on pourra utiliser les propriétésname etmessage afin d'obtenir plus d'informations.

Généralement on aname qui fournit le type d'erreur rencontrée (ex :DOMException ouError). La propriétémessage, quant à elle fournit un message descriptif de l'erreur (qu'on utilisera généralement lorsqu'on voudra convertir/afficher le texte correspondant à une erreur).

Si vous construisez des erreurs, vous pouvez utiliser le constructeurError afin de disposer de ces propriétés.

Ainsi, on pourra avoir :

js
function causerErreurs() {  if (toutEstSourceDErreurs()) {    throw (new Error('mon message'));  } else {    générerUneAutreErreur();  }}....try {  causerErreurs();} catch (e) {  console.error(e.name);// affiche 'Error'  console.error(e.message); // affiche 'mon message' ou un message d'erreur JavaScript}

Help improve MDN

Learn how to contribute.

This page was last modified on byMDN contributors.


[8]ページ先頭

©2009-2025 Movatter.jp