IT Technology

Introduction to the JavaScript typeof operator

Posted on by Thao Nguyen

Here’s an example of the typeof operator.

<script> //"string" document.write( typeof 'mukul' + "<br>" ) //"number" document.write( typeof 25 + "<br>" ) //"undefined" document.write( typeof variable) </script>

The output is as follows:string number undefined

In JavaScript, the typeof operator returns the data type of its operands as a string. An operand can be any object, function, or variable.

The syntax is as follows:

typeof operand

OR

typeof (operand)

Note: An operand is an expression that represents an object or primitive whose type you want to return.

The possible types that exist in javascript are:

  • Undefined
  • Object
  • boolean
  • Number
  • String
  • symbol
  • function

Example:

<script>
//"string"
document.write( typeof 'mukul' + "<br>" ) 
  
//"number"
document.write( typeof 25 + "<br>" ) 
  
//"undefined"
document.write( typeof variable)
</script>

The output is as follows:

string
number
undefined

Let’s cover all the types one by one, specifying a code section for each code.

Example: Typeof Number, in this example, we use “===” (a strict equality comparison operator) that compares values and types both at the same time, and then returns true or false. For example, consider the first console.log(), where JS starts compiling from left to right, it first calculates the type of 25, which is “number”, then compares it to “number”, and then finally returns true or false.

<script> 
   //Number
   console.log( typeof 25 === 'number' );
   console.log( typeof 3.14 === 'number' );
   console.log( typeof (69) === 'number' );   
  
   //log base 10
   console.log( typeof Math.LN10 === 'number' ); 
   console.log( typeof Infinity === 'number' ); 
  
   //Despite being "Not-A-Number"
   console.log( typeof NaN === 'number' );
  
   //Wrapping in Number() function
   console.log( typeof Number( '100' ) === 'number' ); 
</script>

The output is as follows:

Interesting fact that non-digital NaN has a “digital” type.

Example: String type

<script> 
   //string
   console.log( typeof '' === 'string' );
   console.log( typeof 'bla' === 'string' );
  
   //ES6 template literal
   console.log( typeof `template literal` === 'string' );  
   console.log( typeof '1' === 'string' );
   console.log( typeof ( typeof 1) === 'string' );
  
   //Wrapping inside String() function
   console.log( typeof String(1) === 'string' );
</script>

The output is as follows:

For example: Boolean type

<script> 
   //Boolean
   console.log( typeof true === 'boolean' );
   console.log( typeof false === 'boolean' );
  
   //Two calls of the ! (logical NOT) operator 
   //are equivalent to Boolean()
   console.log( typeof !!(1) === 'boolean' ); 
</script>

The output is as follows:

Example: The type is not defined

<script> 
   //Undefined
   console.log( typeof undefined === 'undefined' );
  
   //Declared but undefined variable
   console.log( typeof variable === 'undefined' ); 
</script>

The output is as follows:

Example: Symbol type

<script> 
   //Symbol
   console.log( typeof Symbol() === 'symbol' );
   console.log( typeof Symbol( 'party' ) === 'symbol' );
   console.log( typeof Symbol.iterator === 'symbol' );
</script>

The output is as follows:

Example: Object type

<script> 
   //Object
   console.log( typeof {b: 1} === 'object' );
   console.log( typeof [1, 2, 9] === 'object' );
   console.log( typeof new Date() === 'object' );
</script>

The output is as follows:

Example: Feature type

<script> 
   //function
   console.log( typeof function () {} === 'function' );
  
   //classes too are objects
   console.log( typeof class C {} === 'function' ); 
   console.log( typeof Math.sin === 'function' ); sin function (maths)
</script>

The output is as follows:

Thao Nguyen