The typeof operator in JavaScript is utilized to provide a string that indicates the type of a specific value in JavaScript. It yields the data type of the operand as a string. The operand may be a literal value or a data structure, which can include a function, an object, or a variable.
Syntax
The typeof operator can be utilized in two distinct manners.
typeof operand
or
typeof (operand)
Values
operand: This refers to an expression that signifies the object or primitive type that is expected to be returned.
The potential return values produced by the typeof operator can be summarized in the following table:
| Type of the operand | Result |
|---|---|
| object | "object" |
| number | "number" |
| string | "string" |
| boolean | "boolean" |
| function | "function" |
| undefined | "undefined" |
Let's understand this operator by using some examples.
Example1
In this illustration, the operands are classified as number type. The typeof operator will output "number" as the type for the operand, regardless of whether the operand is a negative integer, a floating-point number, infinity, NaN, zero, or any other integer.
<html>
<head>
<script>
document.write(typeof (45) + "<br>"); // results: "number"
document.write(typeof (-90) + "<br>"); // results: "number"
document.write(typeof (0) + "<br>"); // results: "number"
document.write(typeof (22.6) + "<br>"); // results: "number"
document.write(typeof (Infinity) + "<br>"); // results: "number"
document.write(typeof (NaN)); // results: "number". Although NaN is "Not-A-Number"
</script>
</head>
<body>
</body>
</html>
Output
Upon running the code provided above, the resulting output will be -
number
number
number
number
number
number
Example2
In this instance, the operands are categorized as strings. The typeof operator will output "string" as the type of the operand, regardless of whether the operand is an empty string, a series of characters, or a numeric value enclosed in quotes.
<html>
<head>
<script>
document.write(typeof ("") + "<br>"); // results: "string"
document.write(typeof ("logic-practice.com") + "<br>"); // results: "string"
document.write(typeof ("20") + "<br>"); // results: "string"
document.write(typeof (typeof 1) + "<br>"); // results: "string"
document.write(typeof String(12)); // wrapping in String function will results: "string"
</script>
</head>
<body>
</body>
</html>
Output
Upon executing the code provided above, the resulting output will be -
string
string
string
string
string
Example3
In this illustration, the operands are of the Boolean data type. The typeof operator will output "boolean" as the type of the operand, regardless of whether the operand evaluates to true or false.
<html>
<head>
<script>
document.write(typeof (true) + "<br>"); // results: "boolean"
document.write(typeof (false) + "<br>"); // results: "boolean"
document.write(typeof Boolean(20) + "<br>"); // wrapping in Boolean function will results: "boolean"
</script>
</head>
<body>
</body>
</html>
Output
Upon running the aforementioned code, the resulting output will be -
boolean
boolean
boolean
Example4
In this illustration, the operands possess an undefined type. The typeof operator will output "undefined" as the type of the operand. In this case, the type of Null is classified as undefined; this occurs because it is written with a capital "N" as Null instead of in lowercase as null. If we were to write it as null, its type would be recognized as object.
<html>
<head>
<script>
document.write(typeof Null + "<br>"); // results: "undefined"
document.write(typeof undefined + "<br>"); // results: "undefined"
document.write(typeof a + "<br>"); // results: "undefined"
</script>
</head>
<body>
</body>
</html>
Output
Upon the completion of the code execution provided above, the resulting output will be -
undefined
undefined
undefined
Example5
In this instance, the operands belong to the Object and Function data types. The typeof operator will output "object" and "function," reflecting the specific type of each operand.
<html>
<head>
<script>
document.write(typeof null + "<br>"); // results: "object"
document.write(typeof [1, 2, 'hello'] + "<br>"); // results: "object"
document.write(typeof {a: 'hello'} + "<br>"); // results: "object"
document.write(typeof [1, 2, 3, 4] + "<br>"); // results: "object"
document.write(typeof function(){} + "<br>"); // results: "function"
document.write(typeof class hello{} + "<br>"); // results: "function"
</script>
</head>
<body>
</body>
</html>
Output
Upon executing the code provided above, the resulting output will be -
object
object
object
object
function
function