Last updated: Mar 4, 2024
Reading timeยท4 min
To check if a value is an object:
typeof variable === 'object'
.variable !== null
.!Array.isArray(variable)
.function isObject(value) { return ( typeof value === 'object' && value !== null && !Array.isArray(value) ); } const variable = {name: 'bobby hadz'}; if (isObject(variable)) { // ๐๏ธ this runs console.log('โ Value is an object'); } else { console.log('โ๏ธ Value is not an object'); }
The isObject()
function takes a value as a parameter and returns true
if the
value is an object and false
otherwise.
function isObject(value) { return ( typeof value === 'object' && value !== null && !Array.isArray(value) ); } console.log(isObject({})); // ๐๏ธ true console.log(isObject([])); // ๐๏ธ false console.log(isObject('bobbyhadz.com')); // ๐๏ธ false
We used the
logical AND (&&)
operator to chain 3 conditions in a single if
statement.
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.
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 doesn't store an array or null
, we have to add 2
additional checks.
Our second condition checks that the value is not equal to null.
const variable = {name: 'bobby hadz'}; if ( typeof variable === 'object' && variable !== null && !Array.isArray(variable) ) { // ๐๏ธ this runs console.log('โ Value is an object'); } else { console.log('โ๏ธ Value is not an object'); }
And the third condition checks that the value is not an array.
If all of the conditions are met, the value is an object.
All of the following 3 values have a type of object:
{}
[]
null
valueObject.prototype.toString()
An alternative approach is to use the prototype property on the Object
type.
// ๐๏ธ 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:
// ๐๏ธ๏ธ "[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.
You can also define a reusable function.
function isObject(value) { return ( Object.prototype.toString.call(value) === '[object Object]' ); } if (isObject({name: 'bobby hadz'})) { // ๐๏ธ this runs console.log('The value is an object'); } else { console.log('The value is not an object'); } console.log(isObject({})); // ๐๏ธ true console.log(isObject([])); // ๐๏ธ false console.log(isObject(null)); // ๐๏ธ false console.log(isObject('bobbyhadz.com')); // ๐๏ธ false
It's best to avoid hardcoded strings like [object Object]
because they leak
implementation details, they are prone to errors and are difficult to debug.
instanceof
operator to check if a value is an objectYou shouldn't use the instanceof
operator to check if a value is an object.
Here are some examples.
console.log({} instanceof Object); // ๐๏ธ true console.log(Object.create(null) instanceof Object); // ๐๏ธ false console.log(null instanceof Object); // ๐๏ธ false console.log([] instanceof Object); // ๐๏ธ true console.log('hello' instanceof Object); // ๐๏ธ false console.log(new Date() instanceof Object); // ๐๏ธ true
The instanceof
operator doesn't work for objects created using the
Object.create()
method.
The operator also returns true
for arrays.
The behavior of the instanceof
operator is confusing when checking if a value
is an object and should be avoided.
lodash.isObject
method to check if a value is an objectThe lodash.isObject()
method checks if a value is of type Object
.
The method returns true for arrays, functions, objects, regexes, etc.
import _ from 'lodash'; console.log(_.isObject({})); // ๐๏ธ true console.log(_.isObject([1, 2, 3])); // ๐๏ธ true console.log(_.isObject(null)); // ๐๏ธ false console.log(_.isObject(new Date())); // ๐๏ธ true
This approach doesn't work if you need to check if a value is an object literal.
The only reliable way to check if a value is an object is to check that:
"object"
.null
.function isObject(value) { return ( typeof value === 'object' && value !== null && !Array.isArray(value) ); } console.log(isObject({})) // ๐๏ธ true console.log(isObject([])) // ๐๏ธ false console.log(isObject(null)) // ๐๏ธ false console.log(isObject('bobbyhadz.com')) // ๐๏ธ false
If all 3 conditions are met, then the value is an object.
You can define a reusable function like the one above and place it in your
utils.js
file.
If you have to check if a value is an object literal, import the function and call it.
The function returns true
if the value is an object and false
otherwise.
You can learn more about the related topics by checking out the following tutorials: