Mistakes developers do when validating/checking an objects

When I just started working on validation for JavaScript objects. I realize there are a lot of things I do not understand about object. I believe I am not the only one struggling here. After doing some research and seeing real world examples, here are some common mistakes developers made and some ways to validate JavaScript object.

Mistakes

Not knowing an empty object is true by default

I realize there are developers who may assume empty object is false by default. They may think to themselves since "", 0, null, undefined, etc are falsy. Then, empty object should also be falsy, right? Unfortunately that’s not the case.

Sweats in JavaScript 😅

If you look at the MDN documents, you can see that an empty object is true by default (same goes for empty array if you noticed). Here is an example code of how developers attempt to check whether the object is empty. An empty object will always return as true.

// example
const anObj = {}

if (anObj) {
	console.log(true)
} else {
	console.log(false)
}

// output: true

Using Double Not !!

One of the real world examples that I have seen is developers using a Double Not (!!). What NOT (!) does is converting truth to falsity and vice versa. However, if you use a Double NOT (!!), it would explicitly force the conversion of any value to Boolean. You can refer to MDN for more info.

Now looking at the code example below. If you use a NOT (!) on an empty object, it will convert true to false. If you use another NOT (!), it will convert false to true. In the end, you are just using back the original “value” of an empty object which is true.

// example
const anObj = {}

if (!!anObj) {
	console.log("object is not empty")
} else {
	console.log("object is empty")
}

// output: "object is not empty"

Ways to validate object

Lodash utils

One of the best utility that I found in Lodash is isEmpty. isEmpty can use to check if value is an empty object, collection, map, or set.

import isEmpty from "lodash/isEmpty"

isEmpty({}) // true
isEmpty({ a: "1" }) // false 

Object.hasOwnProperty

If you prefer to use any built-in JavaScript functions, you can use Object.hasOwnProperties. You can use this to check if the object has the desired properties. You will need to provide the property name as the parameter in order use this function.

const anObj = { a: 1 }
anObj.hasOwnProperty("a") // true
anObj.hasOwnProperty("b") // false, because it does not have a property name "b"

Object.keys

Another way to verify whether an object is empty is by checking the object keys. You can use Object.keys to get the keys of an object and use the length property to check whether any keys exist in an object. As you can see from the example code below, an empty object will return 0 keys while an object with properties with have at least 1 key.

// Exmaple one:
const anObj = { a: 1 }
Object.keys(anObj).length // 1

if (Object.keys(anObj).length) {
	console.log("object is not empty")
} else {
	console.log("object is empty")
}
// output: "object is not empty"

// Example two:
const anObj = {}
Object.keys(anObj).length // 0

if (Object.keys(anObj).length) {
	console.log("object is not empty")
} else {
	console.log("object is empty")
}
// output: "object is empty"