Ensuite, dans la liste des articles de notre série de gestion des erreurs JavaScript, nous examinons de plus près l’erreur de variable non définie. L’erreur de variable non définie est levée lorsqu’une référence à une variable ou à un objet est faite dans un code qui n’existe pas ou qui est en dehors de la portée du code d’exécution.

Ci-dessous, nous examinerons quelques exemples spécifiques qui produiront généralement une erreur de variable non définie, ainsi que la façon de détecter et de gérer cette erreur lorsqu’elle apparaît. Commençons!

Le Résumé technique

• Tous les objets d’erreur JavaScript sont des descendants de l’objet d’erreur, ou d’un objet hérité qui s’y trouve.
• L’objet ReferenceError est hérité de l’objet Error.
• L’erreur de variable non définie est un type spécifique d’objet ReferenceError.

Quand Devriez-Vous L’Utiliser?

En pleine phase de codage avec JavaScript, il n’est pas si rare de faire une faute de frappe ou simplement d’oublier d’initialiser une variable ou un objet avant d’appeler ladite variable plus tard sur la ligne. Lorsque cela se produit, JavaScript montrera son mécontentement en lançant une erreur de variable non définie, indiquant que l’objet référencé n’a pas été précédemment défini.

Par exemple, nous faisons ici une simple déclaration d’essayer de saisir le.propriété de longueur de notre variable d’élément non définie. Nous utilisons également un simple bloc try-catch et récupérons toutes les erreurs de référence qui pourraient se produire, puis les transmettons à une simple fonction printError pour embellir la sortie de nos messages d’erreur:

var printError = function(error, explicit) { console.log(` ${error.name}: ${error.message}`);}try { // Calling an undefined `item `variable var length = item.length; console.log(`Length is ${length}.`)} catch (e) { if (e instanceof ReferenceError) { printError(e, true); } else { printError(e, false); }}

Bien sûr, comme prévu, JavaScript remarque que la variable d’élément n’est pas définie et produit l’erreur de variable explicite non définie:

// FIREFOX ReferenceError: item is not defined// CHROME ReferenceError: item is not defined

Il convient de noter que contrairement à de nombreuses autres erreurs JavaScript que nous avons couvertes dans cette série, le texte du message d’erreur variable non défini ne diffère pas entre les deux moteurs alimentant Firefox ou Chrome.

La solution évidente et simple à cette erreur de variable non définie particulière consiste à simplement déclarer notre variable d’élément avant de l’appeler:

var printError = function(error, explicit) { console.log(` ${error.name}: ${error.message}`);}try { // Defining `item` first var item = "Bob"; var length = item.length; console.log(`Length is ${length}.`)} catch (e) { if (e instanceof ReferenceError) { printError(e, true); } else { printError(e, false); }}

Maintenant, nous dépassons l’élément.appel de longueur sans lancer d’erreurs et produire ainsi notre console.sortie du journal de la longueur de notre chaîne d’articles:

Length is 3.

Techniquement, bien que l’erreur de variable non définie soit destinée à identifier les références à des variables non définies, elle joue également un rôle lors de la tentative de référence de variables définies, mais en dehors du contexte de portée actuel où le code est exécuté.

Par exemple, nous avons ici une simple fonction getFullName, qui définit deux variables en elle-même, FirstName et LastName. En dehors de la portée de cette fonction, nous essayons d’obtenir la propriété length de la variable FirstName:

var getFullName = function() { var firstName = "Bob"; var lastName = "Smith"; return `${firstName} ${lastName}`;}var printError = function(error, explicit) { console.log(` ${error.name}: ${error.message}`);}try { // Accessing `firstName` from outside its scope var length = firstName.length; console.log(`Length is ${length}.`)} catch (e) { if (e instanceof ReferenceError) { printError(e, true); } else { printError(e, false); }}

Bien que la variable FirstName soit déjà définie techniquement, elle nous est inaccessible à ce niveau d’exécution, et donc une erreur de variable non définie est levée:

 ReferenceError: firstName is not defined

Dans ce cas, la résolution consiste à tirer le FirstName et la variable LastName hors de la portée de la fonction getFullNamefunction, elles sont donc dans le même contexte d’exécution comme notre bloc try-catch:

// 4// Declaring the variables outside our functionvar firstName = "Bob";var lastName = "Smith";var getFullName = function() { return `${firstName} ${lastName}`;}var printError = function(error, explicit) { console.log(` ${error.name}: ${error.message}`);}try { // Accessing `firstName` is now allowed var length = firstName.length; console.log(`Length is ${length}.`)} catch (e) { if (e instanceof ReferenceError) { printError(e, true); } else { printError(e, false); }}

Comme prévu, aucune erreur n’est produite et nous obtenons la longueur de la variable FirstName en sortie:

Length is 3.

Pour mieux comprendre comment vos applications gèrent les erreurs JavaScript, consultez l’outil révolutionnaire de suivi des erreurs JavaScript Airbrake pour des alertes en temps réel et un aperçu instantané de ce qui n’a pas fonctionné avec votre code JavaScript.