brings fulfillment except for categories

Question

brings fulfillment except for categories

The new satisfies operator in TypeScript 4.9 is incredibly useful for creating narrowly typed values that still align with broader definitions.

type WideType = Record<string, number>;

const narrowValues = {
    hello: number,
    world: number,
} satisfies WideType;

Is there a way to specify one type as fulfilling another?

type WideType = Record<string, number>;

type NarrowType = {
    hello: 4,
    world: 5,
} satisfies WideType;

If you need very specific values for a type, you can reference a value to create a type:

type WideType = Record<string, number>;

const narrowValues = {
  hello: 4,
  world: 5,
} satisfies WideType;

type NarrowType = typeof narrowValues;

However, things can get more complicated when dealing with complex structures:

type TemplateType = `${number}-${number}`;
type UnionType = "FOO" | "BAR";

type WideType = Record<string, string>;

const narrowValues = {
  hello: "" as TemplateType,
  world: "" as UnionType,
  blah: "" as string
} satisfies WideType;

type NarrowType = typeof narrowValues;

It would be ideal to achieve this without the need for additional JavaScript code.

typescript narrowing

Answer 1

Answer №1

To achieve the desired outcome in TypeScript, you can utilize mapped types and conditional types. Here's an example that demonstrates this:

type WideType = Record<string, string>;

type NarrowValues<T> = {
  [K in keyof T]: T[K] extends TemplateType<any, any> | UnionType<any> ? T[K] : T[K] extends string ? T[K] : never;
}[keyof T];

const narrowValues: NarrowValues<WideType> = {
  hello: "FOO" as TemplateType<any, any>,
  world: "BAR" as UnionType<any>,
};

In this solution, we define a mapped type NarrowValues which iterates over the keys of a given type T. It checks if the corresponding value is of type TemplateType or UnionType, using the value directly if true, otherwise converting it to a string. The object narrowValues then adheres to the structure of WideType with more complex value types.

This approach exclusively relies on TypeScript types without the need for additional JavaScript code. While it may be perceived as less intuitive than utilizing the satisfies operator designed for simplifying type-safe configuration in TypeScript.

Answer 2

To achieve the desired outcome in TypeScript, you can utilize mapped types and conditional types. Here's an example that demonstrates this:

type WideType = Record<string, string>;

type NarrowValues<T> = {
  [K in keyof T]: T[K] extends TemplateType<any, any> | UnionType<any> ? T[K] : T[K] extends string ? T[K] : never;
}[keyof T];

const narrowValues: NarrowValues<WideType> = {
  hello: "FOO" as TemplateType<any, any>,
  world: "BAR" as UnionType<any>,
};

In this solution, we define a mapped type NarrowValues which iterates over the keys of a given type T. It checks if the corresponding value is of type TemplateType or UnionType, using the value directly if true, otherwise converting it to a string. The object narrowValues then adheres to the structure of WideType with more complex value types.

This approach exclusively relies on TypeScript types without the need for additional JavaScript code. While it may be perceived as less intuitive than utilizing the satisfies operator designed for simplifying type-safe configuration in TypeScript.

brings fulfillment except for categories

Answer №1

Similar questions

The requested property does not exist within the 'CommonStore' type in mobx-react library

Guide to retrieving specific attributes from an object within an array of objects using Angular Typescript

Using Google OAuth2Client with Angular 4

Adding items to the array is only effective when done within the loop

Troubleshooting Issue with Chrome/chromium/Selenium Integration

Angular Redirect Function: An Overview

Refresh Form Following Submission

Angular ReactiveForms not receiving real-time updates on dynamic values

Divs are not being organized into rows correctly due to issues with Bootstrap styling

Modifying SASS variable within an Angular 2 TypeScript project

What causes a compilation error to occur when a mapped type is invoked inside a class?

Derive a subset Union from a Union in Typescript

Bar chart in Chart.js becomes crowded and illegible on smaller screens due to overlapping bars

The error message "Redux createStore<StoreState> requires 4 type arguments, but only received 1" is showing up

Definition in Typescript: The term "value is" refers to a function that takes in any number of arguments of

Addressing the reactivity issue when incorporating basic markdown directive into vuejs

Discovering the best approach to utilizing Font Awesome 6 with React

Enhancing TypeScript Native Interface Properties in TypeScript 2.4

Discovering the origins of the node.js native modules and delving into the intricacies of typed modules

Appending or removing a row in the P-Table will result in updates to the JSON