Check if a Value is an Object using JavaScript

avatar

Borislav Hadzhiev

Sat Nov 27 20212 min read

banner

Photo by Lê Tân

Check if a Value is an Object in JavaScript #

To check if a value is an object:

  1. Verify the value has a type of object - typeof variable === 'object'.
  2. Verify the value is not null - variable !== null.
  3. Verify the value is not an array - !Array.isArray(variable).
  4. If all conditions pass, the value is an object.
index.js
const variable = {name: 'Tom'}; if ( typeof variable === 'object' && variable !== null && !Array.isArray(variable) ) { console.log('✅ Value is an object'); } else { console.log('⛔️ Value is not an object'); }

We used the logical AND (&&) operator to chain 3 conditions in our if statement.

All conditions have to pass for our if block to run.

The first condition uses the typeof operator to check if a value has a type of "object".

The typeof operator returns a string that indicates the type of a value. Here are some examples.

index.js
console.log(typeof {}); // 👉️ "object" console.log(typeof []); // 👉️ "object" console.log(typeof null); // 👉️ "object" console.log(typeof function () {}); // 👉️ "function" console.log(typeof (() => {})); // 👉️ "function" console.log(typeof ''); // 👉️ "string" console.log(typeof 0); // 👉️ "number"
Notice that an array and a null value also have a type of "object". To make sure the value does not store an array or null, we have to add 2 additional checks.

Our second condition checks that the value is not equal to null.

And the third - that the value is not an array.

If all of the conditions pass, we can conclude that the value is an object.

All of the following 3 types have a value of object:

  • an object literal {}
  • an array []
  • a null value

An alternative approach is to use the prototype property on the Object class.

index.js
// 👇️ true console.log(Object.prototype.toString.call({}) === '[object Object]'); // 👇️ false console.log(Object.prototype.toString.call([]) === '[object Object]'); // 👇️ false console.log(Object.prototype.toString.call(null) === '[object Object]');

We called to toString() method on the prototype, passing it an object, an array and null.

The names of all 3 are different when stringified:

index.js
// 👇️️ "[object Object]" console.log(Object.prototype.toString.call({})); // 👇️ "[object Array]" console.log(Object.prototype.toString.call([])); // ️👇️ "[object Null]" console.log(Object.prototype.toString.call(null));
This makes it a viable solution, because we don't have to chain 3 conditions to get the result, however I still prefer the first approach, because it is more readable and intuitive.

I try to avoid "magic" strings like [object Object] as much as possible, because they are prone to errors and difficult to debug.

Further Reading #

Join my newsletter

I'll send you 1 email a week with links to all of the articles I've written that week

Buy Me A Coffee