Derive keys from strings in array in typescript to define object property names

Question

I want to define the keys in an object match a 2-dimensional arrays first items.

export const ProductInfos = [
  ["description", "Description"],
] as const
type ProductInfoTypes = typeof ProductInfos[number][0]

export type Product = {
  id: string
  //[key in typeof ProductInfos[number][0]]: string
}

So here Product should end up with a property `description" that accepts a string.

However my [key in typeof ProductInfos[number][0]]: string does not compile

A computed property name in a type literal must refer to an expression whose type is a literal type or a 'unique symbol' type.ts(1170)
A computed property name must be of type 'string', 'number', 'symbol', or 'any'.ts(2464)
The right-hand side of an 'in' expression must be of type 'any', an object type or a type parameter.ts(2361)

Eldar · Accepted Answer · 2020-08-28 22:43:52Z

1

You can use built-in type mapper Record and type intersection like below:

export const ProductInfos = [
  ["description", "Description"],
] as const
type ProductInfoTypes = typeof ProductInfos[number][0]

type ProdcutDescription =  Record<ProductInfoTypes,string>

 type Base = {
  id: string
}

type Product = Base & ProdcutDescription

const product : Product ={
  id:"asdsa",
  description : "as" //ok 
foo:"ere" // error
}

Playground Link

answered Aug 28, 2020 at 22:43

Eldar

10.9k2 gold badges20 silver badges40 bronze badges

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

4 Comments

philk Over a year ago

Thanks, that was quick. I knew about the Record but didn't think of using it with intersection. TIL

basil Over a year ago

How to make description optional in Product?

basil Over a year ago

Sorry, already found answer to my question: type Product = Base & Partial<ProductDescription>

Eldar Over a year ago

@basil you can use Partial to achieve what you want: type ProdcutDescription = Partial< Record<ProductInfoTypes,string>>

Collectives™ on Stack Overflow

Derive keys from strings in array in typescript to define object property names

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related