How to remove a specific type from a generic type in Typescript without using Exclude<>?

Question

How to remove a specific type from a generic type in Typescript without using Exclude<>?

I am looking for a solution to prevent my function from working with Moment objects when storing values in local storage. Currently, the function dynamically stringifies and stores values, but I want to exclude Moment objects from being processed. Here is an example of the syntax:

public static set<TValue>(
       key: LocalStorageKeyEnum,
       value: TValue,
       ...keySuffixes: string[]
   ) {
       localStorage.setItem(
           LocalStorage.buildKey(key, keySuffixes),
           JSON.stringify(value)
       )
   }

If the second argument passed to the function is a Moment object, it works fine, but I want to restrict this behavior by excluding Moment objects from <TValue>. Is there a way to achieve this using Typescript without resorting to run-time checks? One approach could be to create two types, one that includes all values and another that excludes Moment objects, like this:

type Variants = {
   value: TValue,
   date: moment.Moment
}

type ExcludeDate = Exclude {typeof Variants, "date"}

However, I am curious if there are alternative methods to achieve this goal. Any suggestions or advice would be greatly appreciated! As I am new to Typescript, I apologize if my question is unclear.

javascript typescript types

Answer 1

Answer №1

If you want to exclude a specific type, you can use conditional types like this:

type CustomType = { data: string } // just an example simulation of a custom type

function process<TValue>(
       key: string,
       value: TValue extends CustomType ? never : TValue, // check this condition
       ...additionalKeys: string[]
   ) {
       // custom implementation here
}

process('key', { data: 'example' }) // will trigger an error as it matches the CustomType
process('key', { value: 'example' }) // valid because it does not match the CustomType

The crucial line is

value: TValue extends CustomType ? never : TValue

. This means that if the passed type matches our CustomType, the value will be of type never, which indicates that no value can be passed. Never is an empty type with no instances.

In this example, CustomType is used for illustration purposes, but you can replace it with any other type you wish to exclude.

Answer 2

If you want to exclude a specific type, you can use conditional types like this:

type CustomType = { data: string } // just an example simulation of a custom type

function process<TValue>(
       key: string,
       value: TValue extends CustomType ? never : TValue, // check this condition
       ...additionalKeys: string[]
   ) {
       // custom implementation here
}

process('key', { data: 'example' }) // will trigger an error as it matches the CustomType
process('key', { value: 'example' }) // valid because it does not match the CustomType

The crucial line is

value: TValue extends CustomType ? never : TValue

. This means that if the passed type matches our CustomType, the value will be of type never, which indicates that no value can be passed. Never is an empty type with no instances.

In this example, CustomType is used for illustration purposes, but you can replace it with any other type you wish to exclude.

How to remove a specific type from a generic type in Typescript without using Exclude<>?

Answer №1

Similar questions

A Simple Guide to Setting a Background Image in React Native with the Nativebase.io Library

Error message encountered when deploying a Discord bot on Heroku: "SyntaxError: Unexpected token '??='"

Tips for retrieving multiple data outputs from an ajax success function

Execute javascript code 1.6 seconds following the most recent key release

Enhancing the efficiency of a Puppeteer web scraping operation

The click event is activated following the :active selector being triggered

What is the best way to send data into functions?

TypeORM is failing to create a table upon initialization

Guide to invoking the NPM request multiple times within the mocha before hook

Capturing mouse clicks in Javascript: a guide to detecting when the mouse moves between mousedown and mouseup events

Attempting to conceal image previews while incorporating pagination in Jquery

Leveraging Webworkers in an Angular application for efficient data caching with service workers in the Angular-CLI

What should be transmitted to the front-end following the successful validation of a token on the server?

Chrome and Internet Explorer are not prompting to save passwords after the input type has been altered by a script

Switching Tabs When a Button is Clicked

Tips for rearranging table columns using drag and drop in react js

What is the best method for inserting the HTML content from a specific div into a textarea?

Can you explain the functionality of isolate scope in angularjs?

Enhancing nouislider jQuery slider with tick marks

Conduct a unit test to verify that a function successfully connects to an API and accurately stores the retrieved data in a variable