How to generate a type from an array of object value in Typescript

Question

I am having an array of routes as such :

export const routes = [
  { name: 'Home', component: HomeScreen },
  { name: 'CreateProgram', component: CreateProgramScreen },
  { name: 'AddExercises', component: AddExercisesScreen },
]

I'd like to generate the kind of type alias as below programmatically from the name of the route:

type RouteNames = 'Home' | 'CreateProgram' | 'AddExercises'

CertainPerformance · Accepted Answer · 2022-01-27 04:43:19Z

3

Type the array as const so it doesn't get automatically widened, and then you can use [number] on its type to get a union of all object types, and then access ["name"] to get to type of the name property.

export const routes = [
  { name: 'Home', component: HomeScreen },
  { name: 'CreateProgram', component: CreateProgramScreen },
  { name: 'AddExercises', component: AddExercisesScreen },
] as const;
type RouteNames = (typeof routes)[number]["name"];

answered Jan 27, 2022 at 4:43

CertainPerformance

373k55 gold badges354 silver badges359 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

A Mehmeto Over a year ago

Thank you for the very quick answer @CertainPerformance yet it seems to result into a string type only and doesn't prevent me from passing wrong route names.

CertainPerformance Over a year ago

Like the answer says and the snippet shows, you need to type the array as const.

A Mehmeto Over a year ago

Correct, thanks for highlighting this detail to me

Collectives™ on Stack Overflow

How to generate a type from an array of object value in Typescript

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related