Comment gérer les erreurs avec javascript et les exceptions try catch throw finally

Très souvent, il peut y avoir des erreurs que vous n’aviez pas prévu dans votre code JavaScript. Ces erreurs peuvent venir de votre code, de la saisie d’un utilisateur, car il saisit une information que vous n’aviez pas anticipé. Du coup, JavaScript affiche une boite de dialogue très moche avec un message difficilement compréhensible par l’utilisateur.

Heureusement l’instruction try catch vient à votre secours pour afficher de belle boite de dialogue (ou pas) à vos visiteurs en cas d’erreurs. Il y a également d’autres options très utiles.

Tout est dans le cours vidéo ci-dessous.

[ppmaccordion][ppmtoggle title= »Afficher le texte de la vidéo »]

Comment gérer les erreurs avec javascript et les exceptions try catch throw finally

Bonjour à tous et bienvenu sur Développement Facile.

On continu, toujours à monter en compétence, surtout vous, vous allez continuer à monter en compétence avec l’utilisation du langage JavaScript, et là vous allez apprendre à utiliser les exceptions. Donc qu’est-ce que c’est que les exceptions avec JavaScript ?

Try… catch

Tout simplement, lorsque vous exécutez votre code, si l’utilisateur saisie des valeurs qui ne sont pas prévues par votre code, vous allez générer des erreurs, des fois ça peut afficher des boîtes de dialogue à l’utilisateur, donc ça peut un peu gâcher votre site Internet bêtement. Il y a les exceptions, justement ça va vous permettre de gérer les erreurs renvoyées par le navigateur lors de l’exécution de votre script, et au lieu d’afficher la boîte de dialogue par défaut, vous allez pouvoir gérer l’affichage de l’erreur, soit vous informez l’utilisateur qu’il y a une erreur, vous affichez une boîte de dialogue aux couleurs du site, très jolie, intuitive, ou soit vous n’avertissez pas l’utilisateur, par contre vous pouvez vous envoyer un message de debug discrètement pour vous prévenir qu’il y a eu une erreur. Vous faites un try entre cotes, crochets, vous définissez les instructions, vous mettez les instructions sur JavaScript qui peuvent générer une erreur potentielle.
Catch, un identifiant et vous faites un bloc d’instruction, donc en cas d’erreur, ça va passer au bloc d’instruction dans le catch. Par exemple vous faites un code source JavaScript pour effectuer une division, nValue=10, et vous une division par zéro, division par zéro ça va générer une exception parce que ce n’est pas possible. On dit que nResultat=nValue donc dans votre bloc try, vous avez mis cette instruction qui risque de générer une erreur, et catch, vous capturez une exception et vous faites un message d’erreur que vous affichez à l’utilisateur, alerte division par 0 impossible.
Try, catch c’est très pratique pour générer des erreurs dans le script JavaScript, dans les données, dans les valeurs contenues dans les variables, donc ça permet de gérer tout ça, très intelligemment, et d’une façon invisible pour l’utilisateur si vous le souhaitez.

Try… finally

Donc à try… catch vous pouvez ajouter la fonction finally. Finally c’est très utile car ça permet d’exécuter des instructions même si il y a eu une erreur. Par exemple vous faites un bloc try avec des instructions qui peuvent générer une erreur potentielle. Catch vous capturez l’exception vous faites votre bloc d’instruction pour informer l’utilisateur qu’il y a eu une erreur, par contre, dans finally vous exécutez quand même ces instructions dans tous les cas. S’il y a eu une erreur catch, vous exécutez ces instructions, si votre code try n’a pas généré d’erreur, il va faire try votre bloc d’instruction et il va passer directement à finally et exécuter votre bloc d’instruction. Donc très pratique try catch finally.

On va dire nValue=/0, on fait une division par zéro donc si ça ne génère pas d’erreur cette instruction là, vous allez exécuter directement le bloc finally alerte, suivant ça va afficher une boite de dialogue test suivant. Par contre, si la division par zéro résultat égal 10/0 génère une exception on passe dans le bloc catch ça affiche à l’utilisateur une boîte de dialogue, division par zéro impossible. Il appuie sur OK, ça affiche une boîte de dialogue qui est dans l’instruction finally, test suivant. Pensez-y quand vous gérez vos instructions, soit vous faites un try catch classique, ou vous rajoutez un finally pour exécuter un bloc d’instruction dans tous les cas.

Votre plan d’actions !

Pensez à utiliser les exceptions pour gérer les erreurs potentielles qui peuvent arriver dans votre code JavaScript, pensez-y ça peut être une erreur d’écriture de code, ça peut être lorsque vous demandez une saisie à l’utilisateur, de renseigner des variables des champs, il peut saisir n’importe quoi et donc ça peut également générer une erreur, une exception dans votre code. Bien évidemment il ne faut pas mettre tout votre code à l’intérieur d’un bloc try catch ça ne sert à rien, vous choisissez des blocs d’instructions qui peuvent générer une erreur potentielle, et vous mettez dans votre bloc try catch, et utilisez finally si vous voulez dans tous les cas, exécuter un bloc d’instruction.
Retrouvez sous ce cours vidéo le code source JavaScript, si vous avez des questions, posez-les directement sous ce cours et moi je dis à très bientôt sur Développement Facile.

[/ppmtoggle][/ppmaccordion]

Téléchargez le code source JavaScript

Voici un exemple de code source JavaScript avec les exceptions.

Comment et dans quels cas utilisez-vous les exceptions ?

Partagez, dans les commentaires, vos cas typiques d’utilisation des exceptions (calculs mathématiques…).