How to get a variable type in Typescript?
TypescriptTypescript Problem Overview
I have a variable.
abc:number|string;
How can I check its type? I want to do something like below:
if (abc.type === "number") {
// do something
}
Typescript Solutions
Solution 1 - Typescript
For :
abc:number|string;
Use the JavaScript operator typeof
:
if (typeof abc === "number") {
// do something
}
TypeScript understands typeof
This is called a typeguard.
More
For classes you would use instanceof
e.g.
class Foo {}
class Bar {}
// Later
if (fooOrBar instanceof Foo){
// TypeScript now knows that `fooOrBar` is `Foo`
}
There are also other type guards e.g. in
etc https://basarat.gitbooks.io/typescript/content/docs/types/typeGuard.html
Solution 2 - Typescript
I'd like to add that TypeGuards only work on strings or numbers, if you want to compare an object use instanceof
if(task.id instanceof UUID) {
//foo
}
Solution 3 - Typescript
The other answers are right, but when you're dealing with interfaces you cannot use typeof or instanceof because interfaces don't get compiled to javascript.
Instead you can use a typecast + function check typeguard to check your variable:
interface Car {
drive(): void;
honkTheHorn(): void;
}
interface Bike {
drive(): void;
ringTheBell(): void;
}
function start(vehicle: Bike | Car ) {
vehicle.drive();
// typecast and check if the function exists
if ((<Bike>vehicle).ringTheBell) {
const bike = (<Bike>vehicle);
bike.ringTheBell();
} else {
const car = (<Car>vehicle);
car.honkTheHorn();
}
}
And this is the compiled JavaScript in ES2017:
function start(vehicle) {
vehicle.drive();
if (vehicle.ringTheBell) {
const bike = vehicle;
bike.ringTheBell();
}
else {
const car = vehicle;
car.honkTheHorn();
}
}
Solution 4 - Typescript
I have checked a variable if it is a boolean or not as below
console.log(isBoolean(this.myVariable));
Similarly we have
isNumber(this.myVariable);
isString(this.myvariable);
and so on.
Solution 5 - Typescript
I suspect you can adjust your approach a little and use something along the lines of the example here:
https://www.typescriptlang.org/docs/handbook/advanced-types.html#user-defined-type-guards
function isFish(pet: Fish | Bird): pet is Fish {
return (pet as Fish).swim !== undefined;
}
Solution 6 - Typescript
Type guards in typescript
To determine the type of a variable after a conditional statement you can use type guards. A type guard in typescript is the following:
> An expression which allows you to narrow down the type of something > within a conditional block.
In other words it is an expression within a conditional block from where the typescript compiler has enough information to narrow down the type. The type will be more specific within the block of the type guard because the compiler has inferred more information about the type.
Example
declare let abc: number | string;
// typeof abc === 'string' is a type guard
if (typeof abc === 'string') {
// abc: string
console.log('abc is a string here')
} else {
// abc: number, only option because the previous type guard removed the option of string
console.log('abc is a number here')
}
Besides the typeof
operator there are built in type guards like instanceof
, in
and even your own type guards.
Solution 7 - Typescript
since Typescript 4.4 you can do like bellow:
function foo(arg: unknown) {
const argIsString = typeof arg === "string";
if (argIsString) {
console.log(arg.toUpperCase());
}
}
Solution 8 - Typescript
I have searched a lot how to check if my string variable is equal to my type and didn't found anything meaningful because any type of interface is not exist in runtime. So we need have this in runtime. There is solution that I figure out for my case.
type MyType = 'one'|'two';
function isMyType(val: string): val is MyType {
const list:MyType[] = ['one','two'];
return list.includes(val as MyType);
}
...
const incomingValue = 'one';
if(isMyType(incomingValue)) {
// here typescript see incomingValue as MyType
}