Understanding the JavaScript typeof Operator

William Le

The typeof operator returns a string that indicates the JavaScript type for a given value.

Usage

There are two ways to use typeof:

typeof foo;
typeof(foo);

Examples

Let’s start with easy examples that aren’t particularly surprising:

typeof true;      // 'boolean'
typeof false;     // 'boolean'

typeof 3000;      // 'number'
typeof 3.14;      // 'number'
typeof NaN;       // 'number'
typeof Infinity;  // 'number'

typeof 'foobar';     // 'string'
typeof `foobar`;     // 'string'

Simple enough! If you aren’t familiar with types in JavaScript it may be a good idea to get familiar with them.

Arrays and object literals

For arrays and object literals you simply get “object”:

typeof [1, 2, 'foobar'];   // 'object'
typeof {a: 'foobar'};      // 'object'

“object” is really just a generic label that’s used loosely for more sophisticated values in JavaScript.

Empty values

Here’s where you may scratch your head a bit…

typeof null;       // 'object'
typeof undefined;  // 'undefined' 

In JavaScript undefined actually has its own type!

Constructors

Since constructors/classes in JavaScript are just functions:

typeof String;           // 'function'
typeof Boolean;          // 'function' 
typeof Number;           // 'function'
typeof Object;           // 'function'
typeof Function;         // 'function'
typeof MyAwesomeClass;   // 'function'  

Common Uses for   typeof

Let’s explore some of the ways you might find yourself using typeof in your programming adventures!

Type-checking for functions

The practice of type-checking in programming has a very long history and the primary way to do this in JavaScript is by using the typeof operator:

function add(a, b) {

  // perform type-checks...
  if (typeof a !== 'number' || typeof b !== 'number') {
    throw 'Arguments must be a number'
  };

  return a + b;
}

This allows you to ensure that the arguments to the add function are numbers and not something like a string (which would concatenate in JavaScript).

Type-checking in JavaScript produces more stable code because you are defining clear ground rules for interacting with your application.

Existence Testing

The other way you might use typeof is to determine the “existence” of a value.

if (typeof window !== 'undefined') {
  // you're programming in JavaScript land!
};

if (typeof process !== 'undefined') {
  // Node.js!
}

if (typeof $ !== 'undefined') {
  // jQuery is available! 
}

Notes

  • The typeof result for primitive values (eg., 3000, true, 'some string', undefined) are predictable and, as such, it’s advisable that you get familiar with them.
  • Most other values you give to typeof will be ‘object’. This goes for arrays, object literals, and constructors.
  • Remember that undefined is its own type of JavaScript. While null is of the object type

Browser Compatibility

typeof is considered standard in JavaScript so it’s very stable across desktop and mobile browsers and has been for a long time.

ECMA Specs

NameSpecificationStatus
typeofoperatorStandard
  Tweet It

🕵 Search Results

🔎 Searching...

Sponsored by #native_company# — Learn More
#native_title# #native_desc#
#native_cta#