Maison > Article > interface Web > Comment vérifier si un objet existe en JavaScript ?

Comment vérifier si un objet existe en JavaScript ?

王林avant: 2023-09-02 14:33:021324parcourir

JavaScript 中如何检查对象是否存在？

Cet objet contient des propriétés et leurs valeurs en JavaScript. Nous pouvons créer un objet en utilisant des accolades ({}). C'est similaire à une variable, mais au lieu d'attribuer un nombre, une chaîne ou une valeur booléenne à la variable, nous attribuons une valeur d'objet.

Donc, dans ce tutoriel, nous allons apprendre à vérifier si un objet existe en JavaScript. En bref, nous devons apprendre à vérifier si une variable objet existe.

Utilisez l'instruction try-catch

Habituellement, nous utilisons des instructions try-catch pour gérer les erreurs en JavaScript. Nous pouvons essayer d'accéder à l'objet ou à ses propriétés dans le bloc try et si le programme ne trouve pas l'objet, il générera une erreur et ira au bloc catch sans terminer l'exécution du code du bloc try.

Grammaire

Les utilisateurs peuvent utiliser le bloc try-catch en suivant la syntaxe suivante pour vérifier si l'objet est défini.

try {
   let value = object.prop;
   // object is defined
} catch {
   // object is not defined
}

Nous accédons à des objets non définis dans le bloc try dans la syntaxe ci-dessus.

Exemple

Dans l'exemple ci-dessous, nous avons utilisé l'instruction try-catch. Dans le bloc try, nous essayons d'accéder à la propriété prop de l'objet, qui n'est pas définie.

L'utilisateur peut observer dans la sortie que le contrôle d'exécution imprime le message du bloc catch, mais lors de l'accès à un objet non défini, il n'imprime pas le message du bloc try, ce qui génère une erreur.

<html>
<body>
   <h3>Using the <i>try-catch block</i> to check if the object is defined in JavaScript.</h2>
   <p id = "output"> </p>
   <script>
      let output = document.getElementById("output");
      try {
         let value = object.prop;
         output.innerHTML += "The object is successfully defined!"
      } catch {
         output.innerHTML += "The object is not defined!"
      }
   </script>
</body>
</html>

Utiliser le type d'opérateur

Les développeurs peuvent utiliser l'opérateur typeof pour vérifier le type d'une variable. Ici, nous allons vérifier si le type de variable est égal à "Objet", ce qui signifie que l'objet existe ; sinon si nous obtenons "indéfini" ou tout autre type de données, cela signifie que la variable n'est pas de type objet.

Grammaire

Les utilisateurs peuvent vérifier si un objet existe en utilisant l'opérateur typeof en suivant la syntaxe suivante.

let objType = typeof obj === ‘object’;

Dans la syntaxe ci-dessus, l'opérateur d'égalité stricte correspond à la valeur de retour de l'opérateur typeof et de la chaîne "object".

Exemple

Dans l'exemple ci-dessous, nous créons un objet obj. Lorsque l'utilisateur clique sur le bouton, il appelle la fonction isObjectDefined(). Dans la fonction isObjectDefined(), nous utilisons l'opérateur typeof pour obtenir le type de variable obj et la stocker dans objType. Après cela, nous comparons la valeur de la variable objType avec "object" pour vérifier si l'objet existe.

<html>
<body>
   <h2>Using the <i>typeof</i> operator to check if the object is defined in JavaScript.</h2>
   <p id = "output"></p>
   <button onclick = "isObjectDefined()"> Check for Object </button>
   <script>
      let output = document.getElementById("output");
      let obj = {
         prop1: "hello",
         prop2: "Users!"
      }
      function isObjectDefined() {
         let objType = typeof obj;
         if (objType === "object") {
            output.innerHTML += "The code contains the object!"
         } else {
            output.innerHTML += "The code doesn't contain the object!"
         }
      }
   </script>
</body>
</html>

Utilisez des instructions if-else

Comme nous le savons tous, nous pouvons transmettre des conditions aux déclarations if. La variable ou l'objet lui-même représente une valeur booléenne. Lorsqu'une variable existe et contient une valeur autre que "null", il s'agit bien d'une valeur booléenne sinon, c'est une fausse valeur booléenne ; Lorsque nous utilisons une fausse valeur booléenne comme condition pour une instruction if, le contrôle passe toujours au bloc else.

Grammaire

Les utilisateurs peuvent utiliser des instructions if-else selon la syntaxe suivante pour vérifier si un objet existe.

if (object) {
   // object exists
} else {
   // object doesn’t exist.
}

Dans la syntaxe ci-dessus, l'objet est la variable qui contient l'objet.

Exemple

Dans l'exemple ci-dessous, nous avons créé un objet téléphone qui contient certaines propriétés et valeurs sous forme de paires clé-valeur. Après cela, nous utilisons l'instruction if-else pour vérifier si l'objet téléphone existe dans le code.

L'utilisateur peut observer que le contrôle va à la sortie du bloc if lorsque l'objet téléphone existe.

<html>
<body>
   <h2>Using the <i>if-else</i> statement to check if the object is defined in JavaScript.</h2>
   <p id = "output"> </p>
   <script>
      let output = document.getElementById("output");
      let phone = {
         "color": "blue",
         "RAM": "8GB",
         "ROM": "128GB"
      }
      if (phone) {
         output.innerHTML += "The phone object defined in the code!"
      } else {
         output.innerHTML += "The phone object isn't defined in the code!"
      }
   </script>
</body>
</html>

Les utilisateurs ont appris trois façons de vérifier si un objet existe. Les utilisateurs peuvent utiliser n'importe quelle méthode en fonction de leurs besoins. S'ils ont également besoin de détecter une autre erreur, ils peuvent utiliser un bloc try-catch ; sinon, ils utilisent une instruction if-else normale au lieu de l'opérateur typeof.

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 数据类型 Object NULL 运算符 if try catch 字符串变量类型对象 typeof

Déclaration：

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

Article précédent：Améliorer la gestion de projet dans le gestionnaire de listes d'épicerie basé sur Angular : partie 2Article suivant：Améliorer la gestion de projet dans le gestionnaire de listes d'épicerie basé sur Angular : partie 2

Articles Liés

Voir plus