How to create a utility type to "serialize" an array of objects in TypeScript?

Question

Let's suppose I have the following object type:

type Test = {
  date: Date
  num: number
  str: string
}

As you can see there is a Date type that I want to convert to a string ("serialize"), so I created the following Generic Type:

type Serializer<T extends {[key: string]: unknown}> = {
  [key in keyof T]: T[key] extends Date ? string : T[key]
}

Which does the job very well, you can check this playground link.

But know, what if I have a Test[] type, what generic type could help me "serialize" this data type?

Wouldn't you just do type Result = Serializer<Test>[] to get it as array? Why would you want a serializer generic that takes in an array type? — Zack Mitkin
– Zack Mitkin, Commented Oct 2, 2022 at 21:46
Because that's what I have as result of a query, something like the Test[] type, but I also have a method that "serialize" that Test[] object and transforms the Date to a string, but unfortunately TS does not infer it, so I have to cast it manually. — Anthony Luzquiños
– Anthony Luzquiños, Commented Oct 2, 2022 at 21:56

Zack Mitkin · Accepted Answer · 2022-10-02 21:59:37Z

1

To achieve a serializer generic that takes an array as input, you would require a custom ArrayElement type that would get the type of an element in your array.

Then your serializer has 2 generic types, the array (A) and the array element (T) which is equal to ArrayElement<A>

Here's an example:

type ArrayElement<A> = A extends readonly (infer T)[] ? T : never;

type Serializer<A extends Array<{ [key: string]: unknown }>, T = ArrayElement<A> > = {
  [key in keyof T]: T[key] extends Date ? string : T[key];
};

type Result = Serializer<Test>
//  type Result = {
//     date: string;
//     num: number;
//     str: string;
// }

Edit: You can one line the ArrayElement although I think this gets pretty messy and unreadable.

type Serializer<A extends Array<{ [key: string]: unknown }>, T = A extends readonly (infer T)[] ? T : never > = {
  [key in keyof T]: T[key] extends Date ? string : T[key];
};

answered Oct 2, 2022 at 21:59

Zack Mitkin

3561 silver badge5 bronze badges

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

2 Comments

Tobias S. Over a year ago

no need for infer, just use A[number]

Anthony Luzquiños Over a year ago

Btw, at the end of the Serializer type you have to add [] to "cast" properly from an array to another array.

Collectives™ on Stack Overflow

How to create a utility type to "serialize" an array of objects in TypeScript?

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related