在 TypeScript 中获取接口属性的类型

Question

I want to extract a type from my an interface by it's property name to reuse in a Record. I am having difficulties with syntax to retrieve the type by property name. I am trying to make it a bit more future-proof so that whenever id type changes to number for example I don't have to find that one record and change that to number too.

interface Account {
  name: string;
  id: string;
  createdOn: number;
}

Then in my code I am setting a useState type which is a map of id (string) from my interface and boolean whether account is currently loading.

const [loadingAccounts, setLoadingAccounts] = useState<Record<string, boolean>>({});

What do I replace string with to get the type of the id ?

Answer 1

You can extract a type from interface by using [] as follows:

interface Account {
  name: string;
  id: string;
  createdOn: number;
}

let testVar: Account['id'];

If you will see in this code, type of testVar will be string.