Creating dynamic types in TypeScript through existing types

Question

Creating dynamic types in TypeScript through existing types

Consider the following object:

class Product {
  constructor(
    public metadata: Metadata,
    public topic: Topic,
    public title = 'empty'
  ) {}
  ...
}

I am looking to define an interface:

interface State<T> {
}

This interface should ensure that a product: State<Product> shares the same structure as the Product class, but all leaf-level properties are boolean. This means that the product object should have a title property of type boolean.

I reviewed the readonly example on mapped types, but it seems that in this case I may need a composite approach:

interface State<T> {
  [p in keyof T]: typeof T[p] === 'object' ? State<T[p]> : boolean;
}

Do you have any suggestions on how to implement this effectively?

typescript

Answer 1

Answer №1

Almost there, just a minor syntax error. Instead of using an interface, try utilizing a type. Additionally, replace typeof T[p] === 'object' with T[p] extends object.

class Metadata {
  constructor(
    public key = 'empty',
    public value = 'empty'
  ) { }
}
class Topic {
  constructor(
    public name = 'empty'
  ) { }
}
class Product {
  constructor(
    public metadata: Metadata[],
    public topic: Topic,
    public title = 'empty'
  ) { }

}

type StateWithoutObjects<T> = {
  [P in keyof T]: T[P] extends object ? StateWithoutObjects<T[P]> : boolean
}
let obj: StateWithoutObjects<Product> = {
  title: true,
  topic: {
    name: true
  },
  metadata: [
    { key: true, value: false }
  ]
}

Interactive Code Playground

Answer 2

Almost there, just a minor syntax error. Instead of using an interface, try utilizing a type. Additionally, replace typeof T[p] === 'object' with T[p] extends object.

class Metadata {
  constructor(
    public key = 'empty',
    public value = 'empty'
  ) { }
}
class Topic {
  constructor(
    public name = 'empty'
  ) { }
}
class Product {
  constructor(
    public metadata: Metadata[],
    public topic: Topic,
    public title = 'empty'
  ) { }

}

type StateWithoutObjects<T> = {
  [P in keyof T]: T[P] extends object ? StateWithoutObjects<T[P]> : boolean
}
let obj: StateWithoutObjects<Product> = {
  title: true,
  topic: {
    name: true
  },
  metadata: [
    { key: true, value: false }
  ]
}

Interactive Code Playground

Answer 3

Answer №2

Consider utilizing type in place of an interface:

type Status<T> = { [P in keyof T]: boolean };

Answer 4

Consider utilizing type in place of an interface:

type Status<T> = { [P in keyof T]: boolean };

Creating dynamic types in TypeScript through existing types

Answer №1

Answer №2

Similar questions

Route.get() is expecting a callback function, however it received an object of undefined instead

"Encountering issues with running a MongoDB aggregate query involving date fields

Typescript: issue with type guard functionality not functioning properly

I am looking to transfer 'beforeEach' and 'afterEach' from the spec file to the global configuration file in WDIO [mocha, hook, wdio]

Ways to address the error in typescript: "Namespace 'fastify' not found"?

The output of switchMap inner will generate an array similar to what forkJoin produces

What is the functionality of input onChange in React when using state management?

How come the props aren't being passed from the parent to the child component? (React / TypeScript)

Is it beneficial to utilize an interface for constructing a class model?

An effective way to define the type of a string property in a React component using Typescript

What exactly does "tsc" stand for when I compile TypeScript using the command "(tsc greeter.ts)"?

Discover how to access JSON data using a string key in Angular 2

Troubleshooting common issues while setting up React Native with TypeScript

What is the best way to assign JSON values to my class property?

Error encountered when initializing a variable within the constructor of a TypeScript file in Angular 4

Error encountered in Jest while searching for entities using the class: TypeORM RepositoryNotFoundError

Stop the MatSort feature from activating when the space key is pressed in Angular Material

Tips on optimizing data processing for quicker display with ngFor

The absence of the @Injectable annotation is causing an issue when importing a JSON

The error TS2300 arises from the duplicate identifier 'PropertyKey' found in the node_modules/@types/core-js/index.d.ts file