首页 > 文章列表 > 如何使用 JavaScript 检查对象是否为空?

如何使用 JavaScript 检查对象是否为空?

207 2023-09-16

在 JavaScript 中,对象是最重要的数据类型,我们在使用 JavaScript 框架开发应用程序时大部分时间都需要它。有时,我们需要检查一个对象是否为空,并根据对象值执行操作。

例如,您正在从数据库中获取数据;如果没有找到,你可以获得一个空对象。当您对空对象执行某些操作或执行某些方法时,它会在程序中引发错误。因此,最好先检查对象是否为空。

我们将学习三种使用 JavaScript 检查对象是否为空的方法。

使用Object.keys()方法

我们可以使用Object.keys()方法来获取单个数组中对象的键。之后,我们可以使用数组的 length 属性检查数组的长度。如果键数组的长度为0,则意味着该对象不包含任何键,并且该对象为空。

语法

用户可以按照下面的语法使用Object.keys()方法检查对象是否为空。

let obj1Len = Object.keys(obj1).length;
if (obj1Len == 0) {
   
   // object is empty
} else {
   
   // object is not empty
} 

在上面的语法中,Object.keys()返回obj1的所有键的数组,我们使用length属性来获取它的长度。使用上面的语法,我们可以使用 Object.keys() 方法获取所有键的数组,并且我们还可以使用 length 属性检查数组的长度

示例

在下面的示例中,我们创建了两个不同的对象。 obj1 包含一些属性,而 obj2 为空且不包含任何单个属性。

之后,我们对两个对象使用 Object.keys() 方法来获取键数组并检查数组的长度以确保对象为空或至少包含一个属性。

<html>
<body>
   <h3>Using the<i> object.keys() </i>method to check whether the object contains some value or not</h3>
   <p id = "output"> </p>
   <script>
      let output = document.getElementById("output");
      let obj1 = {
         prop1: 10,
         prop2: "Hi",
      };
      let obj2 = {};
      
      // get the array of all keys using the Object.keys() method,
      
      // check the length of the array using the length property
      let obj1Len = Object.keys(obj1).length;
      if (obj1Len != 0) {
         output.innerHTML += "The value of obj1 is " + JSON.stringify(obj1) + "</br>";
      } else {
         output.innerHTML += "The obj1 object is empty! </br>";
      }
      let obj2Len = Object.keys(obj2).length;
      if (obj2Len != 0) {
         output.innerHTML += "The value of obj1 is " + obj2 + "</br>";
      } else {
         output.innerHTML += "The obj2 object is empty! </br>"; 
      }
   </script>
</body>
</html>

使用 for-in 循环

for-in 循环允许我们迭代对象的键。我们可以使用 for-in 循环遍历对象的每个键。在这里,我们将使用 for-in 循环并检查如果它对对象进行了一次迭代,则该对象至少包含一个属性并且不为空。

语法

用户可以按照以下语法使用 for-in循环检查对象是否为空。

function isObjectEmpty(object) {
   for (ele in object) {
      
      // object is not empty
      return;
   }
   
   // if control comes here, the object is empty
} 

在上面的语法中,如果发生了 for 循环的单次迭代,则意味着我们已经确保该对象至少包含一个属性。因此,我们在 for-in 循环的第一次迭代之后使用 return 关键字终止该函数。

示例

在下面的示例中,我们创建了两个不同的对象。此外,我们还创建了 isObjectEmpty() 函数,该函数根据对象是否为空打印不同的消息。

我们使用不同的对象调用了isObjectEmpty()函数两次,用户可以观察其输出。

<html>
<body>
   <h3>Using the <i>for-in loop</i> to check whether the object contains some value.</h3>
   <p id="output"></p>
   <script>
      let output = document.getElementById("output");
      
      // creating the objects
      let obj1 = {
         prop1: false,
      };
      let obj2 = {};
      
      // creating a function to check object is empty or not
      function isObjectEmpty(object) {
         for (ele in object) {
            
            // if any single iteration occurs using a for-in loop, it means the object contains at least one property
            output.innerHTML += "The object " + JSON.stringify(object) + " is not empty! </br>";
            return;
         }
         output.innerHTML += "The object " + JSON.stringify(object) + " is empty! </br>";
      }
      
      // calling the isObjectEmpty() function by passing different objects as an argument
      isObjectEmpty(obj1);
      isObjectEmpty(obj2);
   </script> 
</body>
</html>

使用 JSON.stringify() 方法

JSON.stringify() 方法将任何值转换为我们作为该方法的参数传递的字符串。空对象的语法类似于 {},stringify() 方法总是返回空对象的“{}”。

因此,我们可以将 stringify() 方法的返回值与“{}”进行比较,确定该对象是否为空。

语法

用户可以按照以下语法使用 JSON.stringify() 方法检查对象是否为空。

if(JSON.stringify(education) == "{}") {
   
   // object is empty
} else {
   
   // object is not empty
}

在上述语法中,如果 education 对象为空,JSON.stringify() 方法将返回“{}”。

示例

在下面的示例中,我们创建了 education 对象,其中包含一些属性。因此,JSON.stringify()方法不会返回“{}”,但会返回 education 对象的字符串值。因此,用户可以观察到显示教育对象不为空的输出。

<html>
<body> 
   <h3> Using the<i> JSON.stringify() method </i> to check whether object contains some value or not.</h3>
   <p id="output"></p>
   <script>
      let output = document.getElementById("output");
      
      // creating the objects
      let education = {
         totalYears: 12,
         school: "Online",
      };
      
      // convert object to string,
      
      // if object is empty, the JSON.stringify() method will return "{}"
      if (JSON.stringify(education) == "{}") {
         output.innerHTML += "Object is empty!";
      } else {
         output.innerHTML += "Education object is not empty!";
      }
   </script>
</body>
</html>

我们学习了三种检查对象是否为空的方法。第一种和第三种方法只有一行代码;用户需要编写 3 到 4 行才能使用第二行。因此,最好使用第一种和第三种方法中的任何一种,以获得更好的代码可读性。