Pairing a string from a designated set to another string within a designated set using TypeScript

Question

Pairing a string from a designated set to another string within a designated set using TypeScript

I have received a string from an API and need to generate another string based on it.

The possible values for the received string from the API are:

"customField" | "customForm" | "customAction"

. The provided code demonstrates how I am currently handling this, but I am unsure if this approach is future-proof. Is there a more adaptable or idiomatic way to achieve this?

private getTitleFromType(
        currentType: "customField" | "customForm" | "customAction"
    ): "Field" | "Form" | "Action" | "" {
        switch (currentEditorType) {
            case "customField":
                return "Field";
            case "customForm":
                return "Form";
            case "customAction":
                return "Action";
            default:
                return "";
        }
    }

typescript typescript-typings

Answer 1

Answer №1

In order to efficiently store the string to title mapping, it's necessary to have a designated location for this data. A practical approach is to create an object that explicitly holds your mapping, allowing your function to perform type-safe key lookups without redundant code.

const TitleMap = {
    x: "hello",
    y: "world"
} as const

const strToTitle = <T extends keyof typeof TitleMap>(str: T): typeof TitleMap[T] => TitleMap[str]

strToTitle('x') // "hello"
strToTitle('z') // Error!

Access Playground Here

Answer 2

In order to efficiently store the string to title mapping, it's necessary to have a designated location for this data. A practical approach is to create an object that explicitly holds your mapping, allowing your function to perform type-safe key lookups without redundant code.

const TitleMap = {
    x: "hello",
    y: "world"
} as const

const strToTitle = <T extends keyof typeof TitleMap>(str: T): typeof TitleMap[T] => TitleMap[str]

strToTitle('x') // "hello"
strToTitle('z') // Error!

Access Playground Here

Pairing a string from a designated set to another string within a designated set using TypeScript

Answer №1

Similar questions

What is the process for managing multiple selections using checkbox code?

Distributing a library of components using Vite, Vue 3, and Typescript to npm

Having trouble loading AngularJS 2 router

How can you alter the background color of a Material UI select component when it is selected?

Setting up Tarui app to access configuration data

Using TypeScript, you can utilize RxJS to generate a fresh Observable named "Array" from a static array

What is the best way to convert Observable<Observable<{...}>[ ]> to Observable<{...}[ ]>?

Invoke a component's function in a different component

Differences between JSX.Element, ReactNode, and ReactElement: When should each be utilized?

Experimenting with Typescript, conducting API call tests within Redux actions, mimicking classes with Enzyme, and using Jest

Dragging element position updated

Three.js - spinning texture applied to spherical shape

Break apart the string and transform each element in the array into a number or string using a more specific type inference

Tips for creating cascading dynamic attributes within Typescript?

Deciphering the intricacies of AWS-Config Rules and Alterations in Configuration

How can I dynamically replace a specific element inside a .map() function with a custom component when the state updates, without replacing all elements at once?

What is the best way to inject a custom Angular service into a test in TypeScript without needing to mock it?

Dependency injection in Angular 2 service not functioning as expected

Unable to assign to 'disabled' as it is not recognized as a valid attribute for 'app-button'

Experiment with Observable in fakeAsync, applying a delay and tick functions through Jasmine testing framework