Learn how to effectively exclude `{} ` from union types in TypeScript, utilizing the `ExcludeExact` utility type. This guide provides a clear solution with examples.
---
This video is based on the question https://stackoverflow.com/q/63867001/ asked by the user 'P Varga' ( https://stackoverflow.com/u/579078/ ) and on the answer https://stackoverflow.com/a/63871296/ provided by the user 'LiuXiMin' ( https://stackoverflow.com/u/7025361/ ) at 'Stack Overflow' website. Thanks to these great users and Stackexchange community for their contributions.
Visit these links for original content and any more details, such as alternate solutions, latest updates/developments on topic, comments, revision history etc. For example, the original title of the Question was: How to exclude {} from another type?
Also, Content (except music) licensed under CC BY-SA https://meta.stackexchange.com/help/l...
The original Question post is licensed under the 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ) license, and the original Answer post is licensed under the 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ) license.
If anything seems off to you, please feel free to write me at vlogize [AT] gmail [DOT] com.
---
Excluding {} from Union Types in TypeScript: A Complete Guide
In TypeScript, working with union types can sometimes lead to unexpected results, especially when it comes to excluding specific types. A common challenge faced by developers is how to remove the empty object type ({}) from a union of types. If you’ve ever encountered this issue, you’re not alone! In this guide, we’ll explore the problem and break down an effective solution.
Understanding the Problem
Imagine you have a union type defined as follows:
[[See Video to Reveal this Text or Code Snippet]]
You might want to create a new type that is similar to Z, but without the empty object type ({}). The goal is to define a type Y that retains all other property types, but excludes {}.
[[See Video to Reveal this Text or Code Snippet]]
However, this simple usage of Exclude results in Y being never. This happens because all variants in our union type Z are assignable to {}, leading to their exclusion.
The Solution: Creating ExcludeExact
To tackle this issue head-on, we can create a new utility type called ExcludeExact. This type allows us to exclude a specific type from a union without falling into the trap of unintended exclusions.
Defining the ExcludeExact Type
Here’s how you can define ExcludeExact:
[[See Video to Reveal this Text or Code Snippet]]
Explanation of the code:
T extends any: This checks if T falls within any of the possible types.
U extends T: It checks if U is one of the types in T.
(T extends U ? never : T): This condition determines if T should be excluded. If it matches U, it returns never; otherwise, it returns T.
: T: If U is not part of T, it retains T in the resulting type.
Applying the ExcludeExact Type
Now, let’s see how we can utilize ExcludeExact to achieve our goal.
Step 1: Exclude {}
Using the ExcludeExact type, we can easily exclude the empty object as follows:
[[See Video to Reveal this Text or Code Snippet]]
Here, Y correctly reflects our desired output by excluding the {} type from the union.
Step 2: Exclude Another Type
ExcludeExact is versatile! We can also use it to exclude other types. For instance, if we wanted to exclude {a: number} instead, we simply update the function call:
[[See Video to Reveal this Text or Code Snippet]]
This demonstrates the flexibility of ExcludeExact for various scenarios.
Conclusion
By defining your own ExcludeExact type, you can effectively manage union types in TypeScript, providing clear control over which types to include or exclude. The approach is not only cleaner but also intuitive, allowing for the precise handling of union types without the unwelcome surprises commonly faced with the built-in Exclude utility.
Unlocking this capability opens up more robust and maintainable code when working with TypeScript's type system. So, the next time you face the challenge of excluding specific types, remember this solution!
Feel free to reach out if you have any questions or would like to delve deeper into TypeScript types. Happy coding!
Информация по комментариям в разработке