Updated July 5, 2023

Definition of TypeScript typeof

typeof in TypeScript has the same name as JavaScript but functions differently. typeof is used to differentiate between the different types in TypeScript. By the use of typeof we can differentiate between number, string, symbol, Boolean, etc. typeof can be used with any type in TypeScript; by the use of it, we can re-use the code by passing any parameter type. In the coming section, we will see more about the typeof in TypeScript to understand it better.

Syntax:

As we know, typeof is a keyword that is used to deal with different types in TypeScript. Let’s see its syntax in detail for better understanding. See below;

typeof variable === "your_type"

As you can see in the above line of syntax, we can directly use this typeof with the variable name which we want to calculate. After this, we can write our own logic as per the requirement. In the coming section of the article, we will discuss this usage in detail for better understanding.

How does typeof work in TypeScript?

As we already know that typeof is used to deal with several types of typeof in TypeScript. This allows us to help us with the various type in TypeScript; we can reuse the same code for multiple types in TypeScript. In this section, we will see how to use this while programming in TypeScript. Let’s see its usage and understand it better for future use. See below;

Keyword usage:

typeof variable_name //

In the above lines of code, we are using typeof keyword with the variable. It will tell us the type of variable. After this, we can use this to perform any operation on it. Now see one sample example for typeof in TypeScript for beginners to understand its internal working. See below;

e.g. :

class Demo{
testFunction(val: any): any{
if(typeof val === "string"){
// your logic will go here ..
return val;
}
}
}
let demoobj = new Demo();
let result= demoobj.testFunction("i am string !!");
console.log(result);

In the above example, we are creating one function which accepts any type of parameter. Inside the ‘Demo’ class, we have created one function named ‘testFunction’. Inside this function, we are using typeof keyword to compare the type of the variable being passed. typeof will return us the type of the parameter. This is similar to the instanceOf keyword already available. After the comparison, we can write our own logic as per the requirement. At the last to call the function in TypeScript we are creating an object of the class and calling the function. This function we have created takes one parameter; this parameter can be of any type because we have assigned the type as ‘any’ in the function declaration. This is how it works in TypeScript, like any other programming language. It has some benefits as well. Let’s discuss them each one by one;

1) By using typeof in TypeScript, we can easily make checks which can help us to get any exception further exceptions if we try to cast them incorrectly.

2) But by making small checks, we can reuse the code for any different type in TypeScript.

Examples

In this example, we are trying to use the typeof with numbers in Typescript; if the passes parameter matches with the string type, then it will return the value; otherwise, nothing will be printed.

Example #1

Code:

class Demo{
testFunction(val: any): any{
if(typeof val === "string"){
return val;
}
}
}
console.log("Demo to show the usage of typeof in Typescript !!");
let demoobj = new Demo();
let result1 = demoobj.testFunction("i am string !!");
let result2 = demoobj.testFunction("i am string two !!");
let result3 = demoobj.testFunction("i am string three !!");
console.log("printing result of the function after typeof !!");
console.log("result one is::" +result1);
console.log("result two is::" +result2);
console.log("result three is::" +result3);

Output:

Example #2

In this example, we are trying to use the typeof with numbers in Typescript; if the passes parameter matches with the number type, then it will return the value; otherwise, nothing will be printed.

Code:

class Demo{
testFunction(val: any): any{
if(typeof val === "number"){
return val;
}
}
}
console.log("Demo to show the usage of typeof in Typescript !!");
let demoobj = new Demo();
let result1 = demoobj.testFunction(100);
let result2 = demoobj.testFunction(400);
let result3 = demoobj.testFunction(500);
let result4 = demoobj.testFunction(500);
let result5 = demoobj.testFunction(500);
console.log("printing result of the function after typeof !!");
console.log("result one is::" +result1);
console.log("result two is::" +result2);
console.log("result three is::" +result3);
console.log("result four is::" +result4);
console.log("result five is::" +result5);

Output:

Example #3

In this example, we are trying to use the typeof with numbers in Typescript; if the passes parameter matches with the boolean type, then it will return the value; otherwise, nothing will be printed.

Code:

class Demo{
testFunction(val: any): any{
if(typeof val === "boolean"){
return val;
}
}
}
console.log("Demo to show the usage of typeof in Typescript !!");
let demoobj = new Demo();
let result1 = demoobj.testFunction(true);
let result2 = demoobj.testFunction(false);
let result3 = demoobj.testFunction(true);
let result4 = demoobj.testFunction(false);
let result5 = demoobj.testFunction(true);
console.log("printing result of the function after typeof !!");
console.log("result one is::" +result1);
console.log("result two is::" +result2);
console.log("result three is::" +result3);
console.log("result four is::" +result4);
console.log("result five is::" +result5);

Output:

Conclusion

In the typeof keyword easy to use and understand. We can easily check the type of the parameter by simply using the typeof keyword before the variable name. This is very handy to use with variables in TypeScript. We can compare integers, numbers, Boolean, symbols, undefined, strings, objects, etc., by using typeof in Typescript.