A TypeScript type that duplicates the structure of another object type, while modifying the property types based on their original conditions

Question

A TypeScript type that duplicates the structure of another object type, while modifying the property types based on their original conditions

I am in need of a TypeScript type that can duplicate another object type while adjusting the types of properties based on their original conditions. This adjustment should apply to all nested and deeply nested properties as well.

For instance, consider a type called DateToStrings<T> that converts all properties of type Date into properties of type string. Here is an example:

If we have a class:

class Milk {
  brandName: string,
  price: number,
  dealExpiredAt: Date,
  properties: {
    expirationDetails: {
      expiredAt: Date
    }
  }
}

The resulting type DateToStrings<Milk> would be:

{
  brandName: string,
  price: number,
  dealExpiredAt: string,
  properties: {
    expirationDetails: {
      expiredAt: string
    }
  }
}

I could really use some guidance on how to tackle this problem. Any tips or suggestions for existing types/packages that might accomplish something similar?

typescript

Answer 1

Answer №1

To tackle this problem, you can utilize recursive conditional types. While not covering all edge cases, the following code snippet should be sufficient for the example provided:

type DateToStrings<T> = {
    [K in keyof T]: T[K] extends Date
    ? string
    : T[K] extends Array<infer I>
    ? Array<DateToStrings<I>>
    : T[K] extends object
    ? DateToStrings<T[K]>
    : T[K]
}

type MilkTransformed = DateToStrings<Milk>

const foo: MilkTransformed = {
    brandName: 'string',
    prince: 123,
    dealExpiredAt: 'Date',
    properties: {
        expirationDetails: {
            // Expected error: Type 'Date' is not assignable to type 'string'
            expiredAt: new Date
        }
    }
}

Try it out on Playground

Answer 2

To tackle this problem, you can utilize recursive conditional types. While not covering all edge cases, the following code snippet should be sufficient for the example provided:

type DateToStrings<T> = {
    [K in keyof T]: T[K] extends Date
    ? string
    : T[K] extends Array<infer I>
    ? Array<DateToStrings<I>>
    : T[K] extends object
    ? DateToStrings<T[K]>
    : T[K]
}

type MilkTransformed = DateToStrings<Milk>

const foo: MilkTransformed = {
    brandName: 'string',
    prince: 123,
    dealExpiredAt: 'Date',
    properties: {
        expirationDetails: {
            // Expected error: Type 'Date' is not assignable to type 'string'
            expiredAt: new Date
        }
    }
}

Try it out on Playground

A TypeScript type that duplicates the structure of another object type, while modifying the property types based on their original conditions

Answer №1

Similar questions

Using TypeScript for Geolocation

A common method for incorporating personalized react-scripts into create-react-app

Issue with readonly is preventing the ability to alter the font color of the input

What is the best way to obtain a reference to an instance of my Angular 2 directive?

Incorporating Firebase administrator into an Angular 4 project

Encountered an error while trying to generate the Component class for the ColorlibStepIcon from Material UI in TypeScript

Can Vue instances support private computed properties?

VS Code is throwing an Error TS7013, while Typescript remains unfazed

What is the most effective way to structure a React function incorporating nested objects and mapping?

Update current properties of objects

Is it feasible for the Drawer to be a fixed feature that sits atop the content?

how to navigate to a different page programmatically upon selecting an option in the side menu

Is it possible to utilize tsc --watch exclusively for type checking alongside esbuild?

How can one retrieve the "code" attribute from a FirebaseError object in AngularFire using TypeScript?

Error message: Custom binding handler failed: 'Flatpickr' is not a valid constructor

Receive a list of articles based on your subscription status

Creating a stream of observables in RxJs and subscribing to only the latest one after a delay: A comprehensive guide

Designing personalized plugins with Typescript in Nuxt

Why has request.query changed from 'any' in Express? TypeScript error with request.query types

Having trouble converting TypeScript to JavaScript, and encountering difficulty locating the 'protractor' module