Maison > Article > interface Web > Comment générer une erreur lors de l'utilisation des propriétés d'un objet ?

Comment générer une erreur lors de l'utilisation des propriétés d'un objet ?

WBOYavant: 2023-08-26 08:13:11566parcourir

Comment générer une erreur lors de lutilisation des propriétés dun objet ?

En JavaScript, les objets contiennent des propriétés au format clé-valeur. Nous pouvons accéder à n'importe quelle propriété d'un objet en utilisant le nom de la propriété en prenant l'objet comme référence.

Parfois, nous essayons d'accéder à des propriétés d'objet qui n'existent pas dans l'objet. Dans ce cas, nous obtenons une valeur indéfinie. Comprenons-le à travers l'exemple suivant.

Exemple (accéder aux propriétés de l'objet)

Dans l'exemple ci-dessous, nous avons créé l'objet et ajouté quelques propriétés. De plus, nous avons ajouté quelques propriétés imbriquées. Après cela, nous essayons d'accéder à la propriété "prop5", qui est une propriété imbriquée de "prop4". L'utilisateur peut observer sa valeur dans la sortie.

De plus, nous essayons d'accéder à la propriété "prop6" mais l'objet renvoie undefined car il n'existe pas dans l'objet.

<html>
<body>
   <h2>Accessing the object properties in JavaScript</h2>
   <div id="content"> </div>
   <script>
      let content = document.getElementById('content');
      let object = {
         name: 'Shubham',
         prop1: 'Hello',
         prop2: 'World',
         prop3: '!',
         prop4: {
            prop5: 'This is a nested object.'
         }
      }
      content.innerHTML = "The value of prop5 is : " + object.prop4.prop5;
      content.innerHTML += "<br> The value of prop3 is : " + object.prop3;
      content.innerHTML += "<br> The value of prop6 is : " + object.prop6;
   </script>
</body>
</html>

Ainsi, chaque fois qu'une certaine propriété n'existe pas dans l'objet, nous pouvons générer une erreur indiquant que la propriété n'existe pas dans l'objet.

Ici, nous allons apprendre une manière différente de générer des erreurs lors de l'accès aux propriétés d'un objet.

L'utilisation de l'opérateur "in" génère une erreur lors de l'accès aux propriétés de l'objet

L'opérateur « in » nous permet de vérifier si une propriété existe dans un objet. Nous pouvons utiliser une clé comme opérande gauche de l'opérateur "in" et un objet comme opérande droit.

Nous pouvons vérifier si une propriété existe dans un objet. Sinon, nous pouvons générer une erreur.

Grammaire

Les utilisateurs peuvent utiliser l'opérateur "in" selon la syntaxe suivante pour générer des erreurs lors de l'accès aux propriétés de l'objet.

if(key in obj){
}else {
   // throw error
}

Dans la syntaxe ci-dessus, key est une propriété utilisée pour vérifier si elle existe dans l'objet.

Exemple

Dans l'exemple ci-dessous, nous créons l'objet table_obj et ajoutons quelques paires clé-valeur. La fonction nommée get_property_value() vérifie si la propriété existe dans l'objet. Si la propriété existe dans l'objet, la valeur de la propriété est renvoyée. Sinon, cela générera une erreur.

Dans le bloc try-catch, nous captons une erreur. Dans le résultat, l'utilisateur peut observer que la fonction get_property_value() renvoie une erreur pour la propriété "table_price1" au lieu de renvoyer une valeur non définie pour la propriété.

<html>
<body>
   <h3>Using the <i> in </i> operator  to throw an error while accessing the object properties in JavaScript</h3>
   <div id = "content"> </div>
   <script>
      let content = document.getElementById('content');
      // creating an object for table details
      let table_obj = {
         table_name: "table1",
         table_type: "table",
         table_size: "10x10",
         table_color: "black",
         table_price: 1000
      }
      function get_property_value(key) {
         if (key in table_obj) {
            return table_obj[key];
         } else {
            throw new Error(key + " is not a valid property name.");
         }
      }
      try {
         content.innerHTML += "table_name : - " + get_property_value("table_name");
         content.innerHTML += "<br>" + get_property_value("table_price1");
      } catch (e) {
         content.innerHTML += "<br>" + e.message;
      }
   </script>
</body>
</html>

Une erreur est générée lors de l'accès aux propriétés de l'objet à l'aide de la méthode DéfinirProperty()

La méthode DefinProperty() de Javascript nous permet d'ajouter des propriétés aux objets. Nous pouvons ajouter des getters pour les descripteurs de propriétés qui génèrent des erreurs.

Grammaire

Les utilisateurs peuvent utiliser la méthode finishProperty() selon la syntaxe suivante pour générer des erreurs lors de l'accès aux propriétés de l'objet.

Object.defineProperty(obj_name, 'prop_name', {
   get: () => {
      // throw an error
   }
});

Dans la syntaxe ci-dessus, nous passons le descripteur comme troisième paramètre de la méthode finishProperty(). Nous pouvons générer des erreurs à partir de la fonction de descripteur d’une propriété spécifique d’un objet.

Paramètres

Obj_name - Il s'agit du nom de l'objet pour ajouter des propriétés à l'objet.
Prop_name - C'est le nom de la propriété à ajouter à l'objet.
{ get: () => { } } - C'est la fonction getters pour les propriétés des objets.

Exemple

Dans l'exemple ci-dessous, nous créons un objet empty_obj avec zéro propriété. Nous utilisons la méthode définirProperties() pour ajouter des propriétés. En tant que descripteur, nous avons ajouté la méthode get(), qui génère une erreur et affiche un message d'erreur.

Dans la sortie, l'utilisateur peut observer que lorsque nous essayons d'accéder à la propriété "prop1", une erreur est générée.

<html>
<body>
   <h3>Using the <i> defineProperty() </i> method to throw an error while accessing the object properties in JavaScript </h3>
   <div id = "content"> </div>
   <script>
      let content = document.getElementById('content');
      let empty_obj = {};
      Object.defineProperty(empty_obj, 'prop1', {
         get: () => {
            throw new Error('You cannot access prop1 property');
         }
      });
      try {
         content.innerHTML = "The value of prop1 property in the empty object is " + empty_obj.prop1;
      }
      catch (err) {
         content.innerHTML = "The error is : - " + err;
      }
   </script>
</body>
</html>

L'utilisation du constructeur Proxy() lors de l'accès aux propriétés de l'objet génère une erreur

Le constructeur Proxy() nous permet de créer un proxy pour un objet et de remplacer tous les descripteurs de l'objet, tels que les getters et les setters. Ici, nous pouvons remplacer les getters() et écrire une nouvelle fonction qui peut générer des erreurs.

Grammaire

Les utilisateurs peuvent utiliser la syntaxe suivante pour utiliser le constructeur Proxy() afin de générer des erreurs lors de l'accès aux propriétés de l'objet.

let proxy_obj = new Proxy(target_Obj, {
   get: function (target, prop) {
      // throw error
   },
});

Dans la syntaxe ci-dessus, target_obj est un objet pour lequel un proxy est créé. Nous avons passé l'objet contenant la méthode get() comme deuxième paramètre. Dans la méthode get(), nous pouvons valider les propriétés de l'objet et générer une erreur si les propriétés de l'objet ne sont pas valides.

Exemple

Dans l'exemple ci-dessous, nous créons un proxy de l'objet targetObj à l'aide du constructeur Proxy(). Lors de la création du proxy, nous vérifions si l'utilisateur a accédé à la propriété "prop5". Sinon, nous générerons toujours une erreur. Cela signifie que la propriété "prop5" n'est accessible qu'à partir de l'objet. Cependant, il renverra une valeur non définie pour la propriété "prop5" car nous ne l'avons pas encore définie dans l'objet.

<html>
<body>
   <h3>Using the <i> defineProperty() </i> method to throw an error while accessing the object properties in JavaScript </h3>
   <div id = "content"> </div>
   <script>
      let content = document.getElementById('content');
      let targetObj = {
         prop1: 'Hello',
      }
      let proxy_obj = new Proxy(targetObj, {
         get: function (target, prop) {
            if (prop != 'prop5') {
               throw new Error('You are only allowed to access prop5');
            }
         },
      });
      try {
         content.innerHTML += "The value of prop1 is: " + proxy_obj.prop1 + "<br>";
      } catch (e) {
         content.innerHTML += "The error is - " + e + "<br>";
      }
   </script>
</body>
</html>

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

JavaScript 运算符构造函数 try catch 对象

Déclaration：

Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer

Article précédent：FabricJS - Comment créer une instance de fabric.Image à partir de sa représentation objet ?Article suivant：FabricJS - Comment créer une instance de fabric.Image à partir de sa représentation objet ?

Articles Liés

Voir plus