To get a property type from another type alias
or an interface
, you can use the indexed access types
feature in TypeScript.
Indexed access types are written after the type or the interface name in the form of an opening and closing square brackets symbol []
, Inside the brackets we can specify the property name we need to get the type of inside quotes symbol " "
.
TL;DR
// a simple interface
interface Car {
name: string;
yearMade: number;
}
// get the `name` property's
// type from `Car` interface
type CarName = Car["name"]; // CarName -> string
For example, let's say we have an interface called Car
with a property of name
having the type of string
and another property called yearMade
having the type of number like this,
// a simple interface
interface Car {
name: string;
yearMade: number;
}
Suppose we want to get the type of the name
property from the Car
interface. To do that let's use the indexed access type
feature in TypeScript.
It can be done like this,
// a simple interface
interface Car {
name: string;
yearMade: number;
}
// get the `name` property's
// type from `Car` interface
type CarName = Car["name"]; // CarName -> string
Now if you hover over the CarName
type you can see that its type is of string
type which is the same as that of the name
property's type in the Car
interface.
We have successfully got the property type from another interface
in TypeScript. Yay 🥳!
See the above code live in codesandbox.
That's all 😃!