What is the process for generating a new type that includes the optional keys of another type but makes them mandatory?

Question

What is the process for generating a new type that includes the optional keys of another type but makes them mandatory?

Imagine having a type like this:

type Properties = {
    name: string
    age?: number
    city?: string
}

If you only want to create a type with age and city as required fields, you can do it like this:

type RequiredFields = RequiredOptional<Properties>

This will give you:

type RequiredFields = {
    age: number
    city: string
}

Is this achievable and how?

I have come across solutions (such as this) on extracting optional keys from a type, but not exactly what I am looking for. The closest I've got is:

type OptionalKeysOfType<T extends object> = keyof {
    [K in keyof T as T extends Record<K, T[K]> ? never : K]: K
}
type RequiredFields = {
    [key in OptionalKeysOfType<Properties>]: NonNullable<Properties[key]>
}

However, this method has two issues:

It's not very generic

The displayed keys in VSCode/NVim appear as

(property) timeout: NonNullable<number | boolean | undefined>

instead of

(property) timeout: number | boolean

typescript

Answer 1

Answer №1

If you want to ensure all optional props are required in TypeScript, you can achieve this by using the -? notation.


type Props = {
    title: string
    color?: string
    timeout?: number | boolean
}
type OptionalProps<T extends object> =  {
    [K in keyof T as T extends Record<K, T[K]> ? never : K]-?: T[K]
}


type RequiredProps = OptionalProps<Props>

Check out the code on Playground

Answer 2

If you want to ensure all optional props are required in TypeScript, you can achieve this by using the -? notation.


type Props = {
    title: string
    color?: string
    timeout?: number | boolean
}
type OptionalProps<T extends object> =  {
    [K in keyof T as T extends Record<K, T[K]> ? never : K]-?: T[K]
}


type RequiredProps = OptionalProps<Props>

Check out the code on Playground

Answer 3

Answer №2

To create a mapped type similar to this:

type RequiredOptional<T> = {
  [K in keyof T as T extends Record<K, T[K]> ? never : K]-?: T[K];
};

You could also do it like this:

type RequiredOptional<T> = Required<{
  [K in keyof T as T extends Record<K, T[K]> ? never : K]: T[K];
}>;

And when you want to implement it:

type RProps = RequiredOptional<Props>;

You were on the right track towards the solution. What was missing:

Utilize the Required utility or remove optional attributes using '-?'
Embed the 'never' key directly instead of first identifying optional keys and then modifying them

Answer 4

To create a mapped type similar to this:

type RequiredOptional<T> = {
  [K in keyof T as T extends Record<K, T[K]> ? never : K]-?: T[K];
};

You could also do it like this:

type RequiredOptional<T> = Required<{
  [K in keyof T as T extends Record<K, T[K]> ? never : K]: T[K];
}>;

And when you want to implement it:

type RProps = RequiredOptional<Props>;

You were on the right track towards the solution. What was missing:

Utilize the Required utility or remove optional attributes using '-?'
Embed the 'never' key directly instead of first identifying optional keys and then modifying them

What is the process for generating a new type that includes the optional keys of another type but makes them mandatory?

Answer №1

Answer №2

Similar questions

Angular 2 module that is loaded lazily - service does not follow singleton pattern

Avoid invoking a TypeScript class like a regular function - _classCallCheck prevention

Why does my useEffect consistently execute after the initial rendering, despite having specified dependencies?

Converting JSON into Typescript class within an Angular application

Issue Arising from Printing a Custom Instruction in a Schema Generated Document

"Troubleshooting the issue of Angular's ng-selected not functioning properly within an edit

Tips for specifying the return type of app.mount()

When attempting to add a variable using the next() function, I encountered an error with the BehaviorSubject. The error message displayed was "this.count.next is not a function"

When utilizing the Map.get() method in typescript, it may return undefined, which I am effectively managing in my code

Utilizing Typescript for directive implementation with isolated scope function bindings

When employing GraphQL Apollo refetch with React, the update will extend to various other components as well

The fillFormValues function is not functioning properly within the mat-select element

Using TypeScript: Union Types for Enum Key Values

Guide on linking enum values with types in TypeScript

Leverage Angular2 validators beyond FormControl's limitations

Pass an array of objects to an Angular 8 component for rendering

Can you explain the distinction between `any[]` and `{ [s: string]: any }`?

shortcut taken in inferring now exported

Issues with implementing Dark mode in TailwindCSS with Nuxt.js

Difficulty fetching data on the frontend with Typescript, React, Vite, and Express