Type checking in JavaScript: typeof and instanceof operators

JavaScript is a loosely-typed language, so there is no restriction on the variable’s type.

For example, if you’ve created a variable with a string type, later you can assign to the same variable a number:

let message = 'Hello'; 

message = 14; 

Such dynamism gives you flexibility and simplifies variables declaration.

On the other side, you can never be sure that a variable contains a value of a certain type. For example, the following function greet(who) expects a string argument, however, you can invoke the function with any type of argument:

function greet(who) {
  return `Hello, ${who}!`
}

greet('World'); 

greet(true);    
greet([1]);     

That’s why, sometimes, you need to check the variable’s type in JavaScript — using typeof operator, as well as instanceof to check instance types.

Let’s see in more detail how to use typeof and instanceof operators in JavaScript.

1. typeof operator

In JavaScript, you can find primitive types like strings, numbers, booleans, symbols. Additionally, there are functions, objects, and the special values undefined and null.

typeof is the operator that let’s you determine the type of the expression:

const typeAsString = typeof expression;

where expression evaluates to a value which type you’d like to find. expression can be a variable myVariable, property accessor myObject.myProp, function invocation myFunction(), or even a raw literal 14.

typeof expression, depending on the value of expression, evaluates to one of the strings: 'string', 'number', 'boolean', 'symbol', 'undefined', 'object', 'function'.

Let’s see how typeof operator works for each type:

A) Strings:

const message = 'hello!';
typeof message; 

B) Numbers:

const number = 5;
typeof number; 

typeof NaN;    

C) Booleans:

const ok = true;
typeof ok; 

D) Symbols:

const symbol = Symbol('key');
typeof symbol; 

E) undefined:

const nothing = undefined;
typeof nothing; 

F) Objects:

const object = { name: 'Batman' };
typeof object; 

const array = [1, 4, 5];
typeof array; 

const regExp = /Hi/;
typeof regExp; 

G) Functions:

function greet(who) {
  return `Hello, ${who}!`
}

typeof greet; 

What about the type of null? Uh, that’s a nasty one!

1.1 typeof null

As mentioned in the previous section, typeof of an object evaluates to 'object'. That’s expected.

However, typeof null evaluates to 'object' as well!

const missingObject = null;
typeof missingObject; 

As the rumors say, typeof null being 'object' was a bug in the initial implementation of JavaScript.

That’s why, when using typeof to detect an object, be sure to check againts null additionally:

function isObject(object) {
  return typeof object === 'object' && object !== null;
}

isObject({ name: 'Batman' }); 
isObject(15);                 
isObject(null);               

Follow my post Everything about null in JavaScript to read more about null in JavaScript.

1.2. typeof and not defined variables

While usually typeof expression determines the type of expression, you can use typeof also to determine if a variable is defined or not.

JavaScript throws a reference error if you access a variable that is not defined:


notDefinedVar; 

But typeof has a nice property — a reference error is not thrown when typeof evaluates the type of a not defined variable:


typeof notDefinedVar; 

The variable notDefinedVar is not defined in the current scope. However, typeof notDefinedVar doesn’t throw a reference error, and evaluates to 'undefined' string.

You can use typeof to detect if a variable is not defined: typeof myVar === 'undefined' evaluates to true if myVar is not defined.

Follow the post 3 Ways to Check if a Variable is Defined in JavaScript to read more about defined/not defined variables.

2. instanceof operator

The usual way to use a JavaScript function is to invoke it by adding a pair of parentheses after its name:

function greet(who) {
  return `Hello, ${who}!`;
}

greet('World'); 

greet('World') is a regular function invocation.

But JavaScript functions can do more: they can even construct objects! To make a function construct objects, just use new keyword before the regular function invocation:

function Greeter(who) {
  this.message = `Hello, ${who}!`;
}

const worldGreeter = new Greeter('World');
worldGreeter.message; 

new Greeter('World') is a constructor invocation that creates the instance worldGreeter.

How can you check in JavaScript that a certain instance was created with a certain constructor? Welcome instanceof operator:

const bool = object instanceof Constructor;

where object is an expression that evaluates to an object, Contructor is a class or function that constructs objects. instanceof evaluates to a boolean.

worldGreeter instance was created using Greeter constructor, so worldGreeter instanceof Greeter evaluates to true.

Starting ES2015, a better way to construct objects is by using the class syntax. For example, let’s define a class Pet and then created an instance of it myPet:

class Pet {
  constructor(name) {
    this.name = name;
  }
}

const myPet = new Pet('Lily');

new Pet('Lily') is a construction invocation that creates an instance myPet.

Since myPet was constructed using Pet class — const myPet = new Pet('Lily')myPet instanceof Pet also evaluates to true:

myPet instanceof Pet; 

However, a plain object isn’t an instance of Pet:

const plainPet = { name: 'Zoe' };
plainPet instanceof Pet; 

As for more practical examples, you may find instanceof useful to determine the built-in special instances like regular expressions, arrays:

function isRegExp(value) {
  return value instanceof RegExp;
}
isRegExp(/Hello/); 
isRegExp('Hello'); 

function isArray(value) {
  return value instanceof Array;
}
isArray([1, 2, 3]); 
isArray({ prop: 'Val' }); 

2.1 instanceof and the parent class

Now the class Cat extends the parent class Pet:

class Cat extends Pet {
  constructor(name, color) {
    super(name);
    this.color = color;
  }
}

const myCat = new Cat('Callie', 'red');

As expected, myCat is an instance of Cat class:

myCat instanceof Cat; 

But at the same time, myCat is also an instance of the base class Pet!

myCat instanceof Pet; 

In simple words, object instanceof Constructor evaluates to true if object is an instance of Constructor, but also if Constructor is the parent class of instance’s class.

3. Summary

JavaScript is a loosely-typed language, meaning that there is no restriction on what type a variable can have.

Thus, sometimes, you have to check what type the variable has.

typeof expression is the operator that lets you determine the type of expression. typeof evaluates to one of the values: 'string', 'number', 'boolean', 'symbol', 'undefined', 'object', 'function'.

typeof null evaluates to 'object', thus the correct way to use typeof to detect an object is typeof object === 'object' && object !== null.

instanceof operator let’s identify the instance’s constructor. object instanceof Constructor evaluates to true if object is an instance of Constructor.

Quiz: What is the built-in constructor for which instanceof for any object returns true?

Author: Shantun Parmar

4 thoughts on “Type checking in JavaScript: typeof and instanceof operators

  1. I needed to draft you one little bit of observation so as to say thanks once again for your incredible opinions you’ve documented in this article. It is quite pretty generous of people like you to deliver openly exactly what a number of people could possibly have marketed as an e book to end up making some cash for themselves, most importantly given that you could possibly have done it if you ever decided. These inspiring ideas also served like the fantastic way to comprehend other people have similar eagerness like my own to know great deal more on the topic of this issue. I am certain there are millions of more fun opportunities in the future for individuals who look over your blog post.

  2. Needed to write you this very small word to help thank you very much yet again for these gorgeous knowledge you’ve documented here. It has been certainly particularly generous of people like you to convey freely exactly what a lot of people could possibly have made available as an e book to earn some cash for their own end, even more so considering the fact that you could possibly have done it if you ever decided. The guidelines also acted like a fantastic way to be sure that other individuals have similar dreams like my own to grasp a whole lot more in terms of this issue. I’m sure there are many more fun occasions ahead for individuals that go through your blog post.

Thanks for your support, You may click on ads to encourage us which assits to writers.

Leave a Reply

Your email address will not be published.