The typeof operator in JavaScript returns a string that indicates the data type of the operand, whether it be a variable, function, or object.
Syntax: Following is the syntax of typeof operator:
typeof operand // OR typeof(operand)
Parameter: It takes the following parameter:
- operand: The expression whose type needs to be evaluated.
Example: Basic example demonstrating the typeof operator.
Javascript
<script> // Output should be "string" console.log( typeof "Geeks" ); // Output should be "number" console.log( typeof 1); // Output should be "boolean" console.log( typeof false ); // Undeclared variable. Output should be "undefined" console.log( typeof neveropenForGeeks); // Output should be "object" console.log( typeof { name: "Rajat" , gender: "Male" }); </script> |
Output:
string number boolean undefined object
An object in JavaScript is a collection of properties and these properties usually come in the form of key-value pairs. It can be considered as a non-primitive data type.
There are three different methods to create an object:
- By an object literal
- By using any object constructor
- By creating an instance of Object class in JavaScript directly.
Example: Create an object by an object literal.
Syntax:
const object = {property1: value1, property2: value2};
Javascript
<script> const gfgObject = { name: "Rajat" , age: 30, gender: "Male" }; // Printing object console.log(gfgObject); </script> |
Output:
{ name: 'Rajat', age: 30, gender: 'Male' }
Example: Create an object by using any object constructor
Javascript
<script> // Constructor function ("this" refers // to the current object) function student(name, age, gender){ this .name = name; this .age = age; this .gender = gender; } const s = new student( "Rajat" ,11, "Male" ); console.log(s); <script> |
Output:
{ name: 'Rajat', age: 11, gender: 'Male' }
Example: Create an object by creating an instance of Object class in JavaScript directly.
Syntax:
const GFG = new Object();
Javascript
const GFG = new Object(); GFG.name = "Rajat" ; GFG.age = 35; GFG.gender = "Male" ; // Printing object console.log(GFG); |
Output:
{ name: 'Rajat', age: 35, gender: 'Male' }
Coming to typeof bar === “object”, if the variable bar is an object meaning that if it takes the form of any of the three aforementioned object types, then the statement will return true. Initially, typeof bar === “object” seems like a reliable method to determine whether bar is an object or not. However, one potential pitfall of using the same is that in the realm of JavaScript, even the primitive value null is considered as an object.
This is actually a bug in the language since null should indicate the intentional absence of an object value yet it returns “object” when tested with the typeof operator. There was an attempt made to fix it in the past but it was rejected due to a backward compatibility issue. The following code snippet illustrates this issue:
Javascript
<script> const bar = null ; // Logs true to the console console.log( typeof bar === 'object' ); </script> |
Output:
true
This can be avoided if a simple check is added to the pre-existing code. That is, check if bar !== null. Now it will yield the expected output (false).
Javascript
const bar = null ; // Logs false console.log((bar !== null ) && ( typeof bar === 'object' )); |
Output:
false
Till this stage, it is assumed that bar is a variable. But what if bar is a function? The solution above will return false which is the desired output in most cases but if there is a scenario in which the expected output is true, the code needs to slightly modified as follows:
Javascript
<script> function bar() { const b = 1; } console.log((bar !== null ) && ( typeof bar === 'object' ) || ( typeof bar === 'function' )); </script> |
Output:
true
If bar is an array, then the solution above will return true which is the desired output in this case since arrays are considered objects but if there is a situation where the output is expected to be false, the code can be amended as shown below:
Javascript
<script> const bar = [1, 2, 3]; console.log((bar !== null ) && ( typeof bar === "object" ) && (toString.call(bar) !== "[object Array]" )); </script> |
Output:
false
There is one final alternative that returns false for arrays, nulls, and functions, but true for objects. The code looks as follows:
Javascript
<script> const bar = { firstName: "foo" , lastName: "bar" }; console.log((bar !== null ) && (bar.constructor === Object)); </script> |
Output:
true