Les erreurs de programmation sont inévitables. Tôt ou tard, votre application connaîtra un comportement inattendu. Comme tout autre langage de programmation, JavaScript génère des erreurs lorsque quelque chose ne va pas dans votre code.

Les erreurs perturbent le déroulement normal d'une application. Mais ils aident également à protéger votre application contre les comportements imprévisibles. Savoir gérer correctement les erreurs est crucial.

Pourquoi la gestion des erreurs est-elle importante ?

La gestion des erreurs contribue à une meilleure expérience utilisateur. Vous pouvez échanger les erreurs par défaut et parfois verbeuses de JavaScript avec vos propres messages d'erreur plus lisibles par l'homme. Vous pouvez gérer avec élégance les causes de certaines erreurs et maintenir votre programme en cours d'exécution plutôt que de le laisser s'arrêter.

La gestion des erreurs est également utile pendant le développement. Vous pouvez détecter une erreur d'exécution et en faire quelque chose d'utile, comme

instagram viewer
en le connectant à la console du navigateur. C'est plus gracieux que l'erreur provoquant un crash et ne sachant pas où ni pourquoi l'erreur s'est produite.

Structure des erreurs intégrées JavaScript

Les erreurs de JavaScript sont des objets avec trois propriétés :

  • Nom: C'est le nom de l'erreur. Par exemple, un nom de variable manquant générera une erreur appelée SyntaxError.
  • message: Ceci est le corps du message et explique textuellement l'erreur.
  • cause: vous pouvez utiliser cette propriété avec des erreurs personnalisées pour suivre la pile des appels.

Types d'erreur courants en JavaScript

Voici quelques erreurs courantes trouvées dans JavaScript.

Erreur de syntaxe

Des erreurs de syntaxe peuvent se produire lorsque JavaScript essaie d'interpréter votre code. Il déclenchera une erreur si votre code n'est pas conforme à la syntaxe correcte. Certaines erreurs courantes pouvant générer des erreurs de syntaxe sont :

  • Noms de variables manquants.
  • "}" manquant après une fonction.
  • ")" manquant après une condition.

Erreur de référence

Des erreurs de référence se produisent lorsqu'un programme essaie de référencer une variable qui n'est pas disponible ou hors de portée.

Erreur-type

JavaScript peut générer une erreur de type lorsqu'il ne peut pas effectuer une opération car le type qu'il attend est différent de celui qu'il reçoit.

URIError

Cette erreur se produit si vous utilisez une fonction de gestion d'URI globale, telle que decodeURIComponent(), de manière incorrecte. En conséquence, l'encodage ou le décodage échoue.

Erreur globale

Cette erreur est utilisée pour représenter plusieurs erreurs regroupées en une seule. Utilisez-le lorsque vous souhaitez générer plusieurs erreurs à la fois. Par exemple, Promise.any() peut lancer une AggregateError() lorsque toutes les promesses qui lui sont transmises sont rejetées.

Erreur interne

Une InternalError est levée lorsqu'une erreur se produit dans le moteur JavaScript.

RangeError

Certaines fonctions dictent la plage de valeurs que vous pouvez transmettre en tant qu'arguments. Cette erreur se produit lorsque vous essayez de transmettre une valeur qui n'est pas incluse dans cette plage.

Gestion des erreurs avec la commande Try... Bloc de capture

JavaScript fournit une fonctionnalité intégrée de gestion des exceptions avec le essayer… attraper… enfin bloquer. Il vous permet également de remonter vos propres erreurs en utilisant le jeter opérateur.

Vous pouvez utiliser un bloc try…catch pour gérer les erreurs qui se produisent pendant l'exécution. Vous écrivez du code valide que vous vous attendez à exécuter correctement dans le bloc try. Dans le bloc catch, vous pouvez écrire du code de gestion des erreurs.

essayer {
// Code Javascript valide
} attraper (Erreur) {
// Gérer l'erreur
} finalement {
// Exécuté même en cas d'erreur
}

Le bloc catch est ignoré si le code du bloc try ne génère aucune erreur. S'il génère une erreur, l'exécution saute au bloc catch. Le code du bloc finally s'exécute, qu'une erreur se produise ou non. Ce bloc n'est pas obligatoire, donc omettez-le si vous n'en avez pas besoin.

Le code que vous incluez dans le bloc try doit être valide. Si ce n'est pas le cas, JavaScript lancera une erreur d'analyse.

Prenons un exemple pratique :

essayer {
console.log (texte)
} attraper (Erreur) {
console.Journal(Erreur.message)
} finalement {
 console.log("Sera exécuté indépendamment")
}

Ce programme essaie d'enregistrer la valeur de la variable de texte. Puisque cette variable n'est pas définie, le programme renverra une erreur. Cette erreur est imprimée sur la console dans le bloc catch. Le bloc finally s'exécute alors et imprime son propre message.

Erreur de référence: le texte n'est pas défini
Sera exécuté indépendamment

Dans les situations où vous devez générer votre propre erreur, utilisez la jeter opérateur.

Considérez cet exemple qui génère une erreur si les données sont fausses :

constante données = getData()
essayer {
 si (!données) {
 jeter "Pas de données"
 }
console.log (données)
// Continuez
} attraper(Erreur) {
console.log (erreur) // "Pas de données"
}

Dans cet exemple, le programme appelle la fonction getData() et affecte son résultat à la variable de données. Dans le bloc try, le bloc génère une erreur personnalisée si les données sont vides. Le bloc catch intercepte cette erreur et l'enregistre dans la console.

Lancer des erreurs est très bénéfique pendant le développement. Vous pouvez utiliser le message d'erreur personnalisé pour comprendre pourquoi votre application ne fonctionne pas comme prévu.

Comme le montre cet exemple, vous pouvez utiliser une chaîne pour l'objet d'erreur. Vous pouvez en fait lancer n'importe quelle expression JavaScript comme une erreur. Cependant, par souci de cohérence avec les erreurs intégrées, utilisez un objet JavaScript contenant un nom et un message.

jeter {
 Nom: "Nom de l'erreur", 
 message: "Message d'erreur"
}

Vous pouvez également utiliser les constructeurs intégrés de JavaScript lors de la génération d'erreurs. Ces constructeurs incluent Error, SyntaxError et ReferenceError, entre autres.

Pour générer une erreur à l'aide du constructeur Error, utilisez ce code :

jeterNouveauErreur("Pas de données")

Vous pouvez maintenant référencer le nom et le message.

console.log (error.name) // Erreur
console.log (erreur.message) // Pas de données

Extension de l'objet d'erreur JavaScript

Une classe d'erreur personnalisée est pratique lors de la gestion d'erreurs qui ne correspondent pas aux objets déjà fournis par JavaScript. Par exemple, vous pouvez isoler une erreur de validation de données en tant que type spécifique appelé ValidationError.

Vous pouvez utiliser un Cours JavaScript ES2015 pour créer une classe d'erreur personnalisée.

classerErreur de validations'étendErreur{
constructeur(message) {
super(message);
 this.name = "Erreur de validation";
 }
}

Générez une erreur en utilisant la classe ValidationError comme ceci :

jeterNouveau ValidationError("Votre message d'erreur")

L'erreur générée sera un objet avec les valeurs de nom et de message.

{
 Nom: "Erreur de validation",
 message: "Votre message d'erreur"
}

Les erreurs sont là pour vous aider

La gestion des erreurs est un élément fondamental de la programmation, quel que soit le langage que vous utilisez. JavaScript a un excellent support pour générer et intercepter des erreurs dans le style des exceptions. Il comporte également plusieurs types d'erreurs intégrés que vous pouvez gérer et utiliser pour vos propres cas.

Certaines erreurs telles que les erreurs de syntaxe peuvent ne pas être détectées lorsque vous écrivez du JavaScript en « mode bâclé ». L'utilisation du mode strict permet à JavaScript de détecter les erreurs qu'il aurait autrement ignorées.