<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Arpit Jain</title>
    <description>The latest articles on DEV Community by Arpit Jain (@awesome_aj1298).</description>
    <link>https://dev.to/awesome_aj1298</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F130945%2F1dd91f45-e99a-4c9a-ad74-bede77f8780e.jpg</url>
      <title>DEV Community: Arpit Jain</title>
      <link>https://dev.to/awesome_aj1298</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/awesome_aj1298"/>
    <language>en</language>
    <item>
      <title>Different ways to check If Object is empty or not</title>
      <dc:creator>Arpit Jain</dc:creator>
      <pubDate>Fri, 18 Sep 2020 06:28:58 +0000</pubDate>
      <link>https://dev.to/awesome_aj1298/different-ways-to-check-if-object-is-empty-or-not-146</link>
      <guid>https://dev.to/awesome_aj1298/different-ways-to-check-if-object-is-empty-or-not-146</guid>
      <description>&lt;p&gt;Checking if the Object is empty or not is quite a simple &amp;amp; common task but there are many ways to check the object is empty or not. So in this blog, I am trying to cover all the best ways to check object is empty or not.&lt;/p&gt;

&lt;p&gt;So let's figure out how to accomplish it.&lt;/p&gt;

&lt;p&gt;Here firstly we create an empty Object using the object literal syntax&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const obj = {}
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;After creating an empty object &lt;code&gt;obj&lt;/code&gt; we compare it to another empty object just like this:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight plaintext"&gt;&lt;code&gt;console.log(obj === {}) // false
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;We are getting &lt;code&gt;false&lt;/code&gt;. How is this possible??? We compared two empty objects just like this:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight plaintext"&gt;&lt;code&gt;console.log({} === {}) // false
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;This because we are comparing references, not values. The reference to these objects isn't the same, even though the value is the same.&lt;/p&gt;

&lt;p&gt;So how can we actually check if an object is empty or not?&lt;/p&gt;

&lt;h2&gt;
  
  
  Using Object.Keys
&lt;/h2&gt;

&lt;p&gt;Object.keys will return an Array, which contains the property names of the object. If the length of the array is 0, then we know that the object is empty.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function isEmpty(obj) {
    return Object.keys(obj).length === 0;
}
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;we can also check this using &lt;code&gt;Object.values&lt;/code&gt; and &lt;code&gt;Object.entries&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;This is the simplest way to check if an object is empty.&lt;/p&gt;

&lt;h2&gt;
  
  
  Using JSON.stringify
&lt;/h2&gt;

&lt;p&gt;If we stringify the object and the result is simply an opening and closing bracket, we know the object is empty.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function isEmptyObject(obj){
    return JSON.stringify(obj) === '{}';
}
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;h2&gt;
  
  
  Looping over object properties with for…in
&lt;/h2&gt;

&lt;p&gt;The &lt;code&gt;for…in&lt;/code&gt; statement will loop through the enumerable property of the object.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function isEmpty(obj) {
    for(var prop in obj) {
        if(obj.hasOwnProperty(prop))
            return false;
    }

    return true;
}
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;In the above code, we will loop through object properties and if an object has at least one property, then it will enter the loop and return &lt;code&gt;false&lt;/code&gt;. If the object doesn’t have any properties then it will return &lt;code&gt;true&lt;/code&gt;.&lt;/p&gt;

&lt;h2&gt;
  
  
  Using Underscore and Lodash
&lt;/h2&gt;

&lt;p&gt;we can also check by &lt;a href="https://underscorejs.org/"&gt;underscore.js&lt;/a&gt; like this:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight plaintext"&gt;&lt;code&gt;_.isEmpty(obj);
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;&lt;code&gt;_.isEmpty()&lt;/code&gt; is an underscore.js function to check whether a list, array, string, object, etc is empty or not. It first finds out the length of the passed argument and then decides. It returns true if the argument passed is empty, i.e., does not have any elements in it. Otherwise, it returns false.&lt;/p&gt;

&lt;h2&gt;
  
  
  Using jQuery
&lt;/h2&gt;

&lt;p&gt;we can also check by jQyery library like this:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight plaintext"&gt;&lt;code&gt;jQuery.isEmptyObject(obj); 
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;h3&gt;
  
  
  Thanks for reading 😄.
&lt;/h3&gt;

&lt;p&gt;If there is anything I have missed, or if you have a better way to do something then please let me know.&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>beginners</category>
    </item>
  </channel>
</rss>
