Javascript check if object is type

typeof

The typeof operator returns a string indicating the type of the operand’s value.

Try it

Syntax

Parameters

An expression representing the object or primitive whose type is to be returned.

Description

The following table summarizes the possible return values of typeof . For more information about types and primitives, see also the JavaScript data structure page.

Type	Result
Undefined	«undefined»
Null	«object» (reason)
Boolean	«boolean»
Number	«number»
BigInt	«bigint»
String	«string»
Symbol	«symbol»
Function (implements [[Call]] in ECMA-262 terms; classes are functions as well)	«function»
Any other object	«object»

This list of values is exhaustive. No spec-compliant engines are reported to produce (or had historically produced) values other than those listed.

Examples

Basic usage

// Numbers typeof 37 === "number"; typeof 3.14 === "number"; typeof 42 === "number"; typeof Math.LN2 === "number"; typeof Infinity === "number"; typeof NaN === "number"; // Despite being "Not-A-Number" typeof Number("1") === "number"; // Number tries to parse things into numbers typeof Number("shoe") === "number"; // including values that cannot be type coerced to a number typeof 42n === "bigint"; // Strings typeof "" === "string"; typeof "bla" === "string"; typeof `template literal` === "string"; typeof "1" === "string"; // note that a number within a string is still typeof string typeof typeof 1 === "string"; // typeof always returns a string typeof String(1) === "string"; // String converts anything into a string, safer than toString // Booleans typeof true === "boolean"; typeof false === "boolean"; typeof Boolean(1) === "boolean"; // Boolean() will convert values based on if they're truthy or falsy typeof !!1 === "boolean"; // two calls of the ! (logical NOT) operator are equivalent to Boolean() // Symbols typeof Symbol() === "symbol"; typeof Symbol("foo") === "symbol"; typeof Symbol.iterator === "symbol"; // Undefined typeof undefined === "undefined"; typeof declaredButUndefinedVariable === "undefined"; typeof undeclaredVariable === "undefined"; // Objects typeof  a: 1 > === "object"; // use Array.isArray or Object.prototype.toString.call // to differentiate regular objects from arrays typeof [1, 2, 4] === "object"; typeof new Date() === "object"; typeof /regex/ === "object"; // The following are confusing, dangerous, and wasteful. Avoid them. typeof new Boolean(true) === "object"; typeof new Number(1) === "object"; typeof new String("abc") === "object"; // Functions typeof function () > === "function"; typeof class C > === "function"; typeof Math.sin === "function"; 

typeof null

// This stands since the beginning of JavaScript typeof null === "object"; 

In the first implementation of JavaScript, JavaScript values were represented as a type tag and a value. The type tag for objects was 0 . null was represented as the NULL pointer ( 0x00 in most platforms). Consequently, null had 0 as type tag, hence the typeof return value «object» . (reference)

A fix was proposed for ECMAScript (via an opt-in), but was rejected. It would have resulted in typeof null === «null» .

Using new operator

All constructor functions called with new will return non-primitives ( «object» or «function» ). Most return objects, with the notable exception being Function , which returns a function.

const str = new String("String"); const num = new Number(100); typeof str; // "object" typeof num; // "object" const func = new Function(); typeof func; // "function" 

Need for parentheses in syntax

The typeof operator has higher precedence than binary operators like addition ( + ). Therefore, parentheses are needed to evaluate the type of an addition result.

// Parentheses can be used for determining the data type of expressions. const someData = 99; typeof someData + " Wisen"; // "number Wisen" typeof (someData + " Wisen"); // "string" 

Interaction with undeclared and uninitialized variables

typeof is generally always guaranteed to return a string for any operand it is supplied with. Even with undeclared identifiers, typeof will return «undefined» instead of throwing an error.

typeof undeclaredVariable; // "undefined" 

However, using typeof on lexical declarations ( let const , and class ) in the same block before the line of declaration will throw a ReferenceError . Block scoped variables are in a temporal dead zone from the start of the block until the initialization is processed, during which it will throw an error if accessed.

typeof newLetVariable; // ReferenceError typeof newConstVariable; // ReferenceError typeof newClass; // ReferenceError let newLetVariable; const newConstVariable = "hello"; class newClass > 

Exceptional behavior of document.all

All current browsers expose a non-standard host object document.all with type undefined .

typeof document.all === "undefined"; 

Although document.all is also falsy and loosely equal to undefined , it is not undefined . The case of document.all having type «undefined» is classified in the web standards as a «willful violation» of the original ECMAScript standard for web compatibility.

Custom method that gets a more specific type

typeof is very useful, but it’s not as versatile as might be required. For example, typeof [] is «object» , as well as typeof new Date() , typeof /abc/ , etc.

For greater specificity in checking types, here we present a custom type(value) function, which mostly mimics the behavior of typeof , but for non-primitives (i.e. objects and functions), it returns a more granular type name where possible.

function type(value)  if (value === null)  return "null"; > const baseType = typeof value; // Primitive types if (!["object", "function"].includes(baseType))  return baseType; > // Symbol.toStringTag often specifies the "display name" of the // object's class. It's used in Object.prototype.toString(). const tag = value[Symbol.toStringTag]; if (typeof tag === "string")  return tag; > // If it's a function whose source code starts with the "class" keyword if ( baseType === "function" && Function.prototype.toString.call(value).startsWith("class") )  return "class"; > // The name of the constructor; for example `Array`, `GeneratorFunction`, // `Number`, `String`, `Boolean` or `MyCustomClass` const className = value.constructor.name; if (typeof className === "string" && className !== "")  return className; > // At this point there's no robust way to get the type of value, // so we use the base implementation. return baseType; > 

For checking potentially non-existent variables that would otherwise throw a ReferenceError , use typeof nonExistentVar === «undefined» because this behavior cannot be mimicked with custom code.

Specifications

Browser compatibility

BCD tables only load in the browser

See also

Источник

Javascript check if object is type

Last updated: Jan 10, 2023
Reading time · 4 min

# 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.

Copied! 
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.

Copied! 
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.

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.

Copied! 
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.

Copied! 
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:

# Check if a Value is an Object using Object.prototype.toString()

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

Copied! 
// 👇️ 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:

Copied! 
// 👇️️ "[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.

Copied! 
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.

# Don’t use the instanceof operator to check if a value is an object

You shouldn’t use the instanceof operator to check if a value is an object.

Copied! 
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.

# Don’t use the lodash.isObject method to check if a value is an object

The lodash.isObject method checks if a value is of type Object .

The method returns true for arrays, functions, objects, regexes, etc.

Copied! 
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:

1. The value has a type of «object» .
2. The value is not null .
3. The value is not an array.

Copied! 
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.

# Additional Resources

You can learn more about the related topics by checking out the following tutorials:

I wrote a book in which I share everything I know about how to become a better, more efficient programmer.

Источник