How to index a specific array element in Typescript?

Question

I want to create a type that combines the values of two properties of one object in an array.

My solution so far, looks like this:

const CONFIGS = [
  { section: "a", name: "1" },
  { section: "b", name: "2" },
] as const;

type ConfigSections<I extends number> = typeof CONFIGS[I]["section"];
type ConfigSectionEntryName<I extends number> = typeof CONFIGS[I]["name"];

// Allows all permutations of section and name: "a_1" | "a_2" | "b_1" | "b_2" :(
// I only want "a_1" | "b_2" 
type CompleteConfigName<I extends number> =
  `${ConfigSections<I>}_${ConfigSectionEntryName<I>}`;

But in the type CompleteConfigName<I extends number> the I seems to allow any number, as the type resolves to "a_1" | "a_2" | "b_1" | "b_2". But I want to enforce a specific index number I, so that the type results to "a_1" | "b_2"

Tobias S. · Accepted Answer · 2022-05-31 11:52:39Z

2

You should use a mapped type like this:

type CompleteConfigName = {
  [K in keyof typeof CONFIGS]: (typeof CONFIGS)[K] extends { 
    section: infer A, name: infer B
  }  
    ? `${A & string}_${B & string}` 
    : never
}[keyof typeof CONFIGS & `${bigint}`]

CompleteConfigName maps over each element in the tuple to create the string literal. We can index this type with [keyof typeof CONFIGS & '${bigint}'] to create a union of all elements inside the mapped type.

Playground

edited May 31, 2022 at 11:52

answered May 31, 2022 at 11:46

Tobias S.

24.3k7 gold badges37 silver badges64 bronze badges

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

Collectives™ on Stack Overflow

How to index a specific array element in Typescript?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related