A Better Way to Determine Typeof in JavaScript

Let’s face it, the typeof operator in JavaScript is broken. Thankfully there’s a better way:

While recreating the functionality of the JSON.stringify method, I needed to determine what kind of object (or primitive) was being passed to my function. Easy enough! I thought. I would use javascript’s built-in typeof operator:

Things started out cleanly enough, but quickly devolved into a patchwork of special cases and inconsistent code:

Okay yes, an array is technically an object, but this doesn’t help me for practical use-cases. And null being labeled as an object? This seems to be a flat-out error.

I can certainly check to see if my value is an array by using the Array.isArray method and I can similarly check to see if a value is null by reading true or false on myValue === null. Thus my code could look something like this:

The code works, but it feels clunky. Both the array and null checks seem to over-engineer a problem that could use a a clean solution.

The base Object has a method on its prototype that will convert anything you pass to it into a string. This enables us to write something like 50.toString(); and have it work as intended. The number 50 is actually briefly “boxed into” an object and given access to the toString method on the base Object!

Look at what happens when we use the new Number constructor:

Using the new Number constructor returns an object with a PrimitiveValue property! It’s prototype is the base Object and it has access to the toString method.

The Object.prototype.toString method will therefore will work on just about any data type. Check out the code below:

When we invoke the method on the Object’s prototype it returns an Object: [object Object]. This makes sense. However when we invoke it on a number or string we get the appropriate [object Number] and [object String] output respectively.

Most importantly, when we invoke it on an array or a null value we get the following: [object Array] and [object Null]!

All we need now is a little slicing and dicing and we’ll have the output we need:

Our new getType function will now reliably be able to distinguish between all of the major primitive and Object data types. It will even work with some other popular JavaScript Objects:

After figuring this out on my own I felt like a veritable pioneer: having discovered something new I was thrilled to share my findings with the world!

Related posts:

Regardless of genre or era, music has a few throughlines and themes that seem to appear everywhere. It can be hard to pick my favorite of anything, let alone music, and let alone music discussions…

Can we all please just take a moment to appreciate how incredible our eyes are. The eyes are the organs of the visual system and they are responsible for providing four fifths of the information your…

Engineering is all about learning how to learn, especially in first year. I can’t believe it took me four years and one month to finally figure out my most preferred style. This is something I’ve…