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

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 行才能使用第二行。因此,最好使用第一种和第三种方法中的任何一种,以获得更好的代码可读性。

以上就是如何使用 JavaScript 检查对象是否为空?的详细内容,更多请关注双恒网络其它相关文章!

1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,您必须在下载后24小时内删除!
3. 不得使用于非法商业用途,不得违反国家法律。否则后果自负!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需!
7. 如遇到加密压缩包,请使用WINRAR解压,如遇到无法解压的请联系管理员!
8. 精力有限,不少源码未能详细测试(解密),不能分辨部分源码是病毒还是误报,所以没有进行任何修改,大家使用前请进行甄别
9.本站默认解压密码为:www.sudo1.com
本站提供的一切软件、教程和内容信息仅限用于学习和研究目的。
不得将上述内容用于商业或者非法用途,否则,一切后果请用户自负。
本站信息来自网络收集整理,版权争议与本站无关。您必须在下载后的24个小时之内,从您的电脑或手机中彻底删除上述内容。
如果您喜欢该程序和内容,请支持正版,购买注册,得到更好的正版服务。
我们非常重视版权问题,如有侵权请邮件与我们联系处理。敬请谅解!

云资源网 » 如何使用 JavaScript 检查对象是否为空?

常见问题FAQ

免费下载或者VIP会员专享资源能否直接商用?
本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。更多说明请参考 VIP介绍。
提示下载完但解压或打开不了?
最常见的情况是下载不完整: 可对比下载完压缩包的与网盘上的容量,若小于网盘提示的容量则是这个原因。这是浏览器下载的bug,建议用百度网盘软件或迅雷下载。 若排除这种情况,可在对应资源底部留言,或 联络我们.。
你们有qq群吗怎么加入?
当然有的,如果你是帝国cms、易优cms、和pbootcms系统的爱好者你可以加入我们的QQ千人交流群https://www.sudo1.com/page-qun.html。
  • 会员数(个)
  • 12310资源数(个)
  •        
  • 资源(G)
  •        
  • 今日下载
  • 1506稳定运行(天)

提供最优质的资源集合

立即查看 了解详情