A very important aspect of every programming language is its type system and data types. For a strictly typed programming language like Java, variables are defined to be of a particular type, constraining the variable to only contain values of that type.
string, and much later in its lifecycle, has become a reference to an
typeofoperator for the purpose of type-checking.
However, you will notice that using this operator could be misleading, as we will discuss in this article.
Before looking at type-checking with
Symbol type was added. Here is a list of all the types:
Boolean — (the values
null — (the value
undefined — (the value
The first six data types are referred to as primitive types. Every other data type besides these first six is an object and may be referred to as a reference type. An object type is simply a collection of properties in the form of name and value pairs.
Notice from the list that
You may begin to wonder — what about arrays, functions, regular expressions, etc? They are all special kinds of objects.
arrayis a special kind of object that is an ordered collection of numbered values with special syntax and characteristics that makes working with it different from with regular objects.
functionis a special kind of object that has an executable script block associated with it. The script block is executed by invoking the function. It also has a special syntax and characteristics that makes it different from other regular objects.
Date— for creating date objects
RegExp— for creating regular expressions
Type-checking using typeof
typeof 53; // "number"
However, there is an alternative syntax that allows you to use
typeof(typeof 53); // "string"
Prior to ES6, the
typeof operator always returns a string irrespective of the operand it is used on.
For undeclared identifiers,
“undefined”instead of throwing a
However, in ES6, block-scoped variables declared using the
const keywords will still throw a
ReferenceError if they are used with the
typeof operator before they are initialized. This is because:
Block scoped variables remain in the temporal dead zone until they are initialized:
The following code snippet shows type-checks for common values using the
Notice that all object type constructor functions, when instantiated with the
new keyword will always have a type of
“object”. The only exception to this is the
Here is a simple summary of the type-check results:
The type-check results from the previous section indicate that some values will require additional checks to further distinguish them. For example:
 will both be of
“object” type when type-check is done using the
The additional checks on the value can be done by leveraging on some other characteristics:
- – using the
- – checking the
constructorproperty of the object
- – checking the object class using the
toString()method of the object
Checking for null
typeof operator to check for a
“null” value does no good, as you have already seen. The best way to check for a
“null” value is to do a strict equality comparison of the value against the
null keyword as shown in the following code snippet.
The use of the strict equality operator(
===) is very important here. The following code snippet illustrates this importance using the
Checking for NaN
NaN is a special value received when arithmetic operations result in values that are undefined cannot be represented. For example:
(0 / 0) => NaN. Also, when an attempt is made to convert a non-numeric value that has no primitive number representation to a number,
NaN is the result.
Any arithmetic operation involving
NaNwill always evaluate to
If you really want to use a value for any form of arithmetic operation then you want to be sure that the value is not
typeof operator to check for
NaN value returns
“number”. To check for
NaN value, you can use the global
isNaN() function, or preferably the
Number.isNaN() function added in ES6:
You can check for
NaN as follows:
The above function is very similar to the implementation of
Number.isNaN() added in ES6 and hence can be used as a polyfill for non-ES6 environments as follows:
Finally, you can leverage on the
Object.is() function added in ES6 to test if a value is
Object.is() function checks if two values are the same value:
Checking for arrays
typeof to check for an array will return
“object”. There are several ways to better check for an array as shown in this code snippet:
As seen with arrays, the
apply(), it returns the object type in the format:
[object Type], where
Type is the object type.
Consider the following code snippet:
The following code snippet shows results of type-checking using the just created
Bonus fact: everything is not an object
It is very possible that at one point or the other, you may have come across this statement:
You may begin to wonder — why then can we do the following kinds of operations on primitives if they are not objects?
(“Hello World!”).length— getting
lengthproperty of the string
(“Another String”)— getting the character of the string at index
Number.prototype.toFixed()method on the number
You also saw how misleading type-checking can be, using the
typeof operator. And finally, you saw several ways of implementing predictable type-checking for some data types.
typeof operator, you can refer to this article.
Clap & Follow
If you found this article insightful, feel free to give some rounds of applause if you don’t mind.
Plug: LogRocket, a DVR for web apps
LogRocket is a frontend logging tool that lets you replay problems as if they happened in your own browser. Instead of guessing why errors happen, or asking users for screenshots and log dumps, LogRocket lets you replay the session to quickly understand what went wrong. It works perfectly with any app, regardless of framework, and has plugins to log additional context from Redux, Vuex, and @ngrx/store.