This content originally appeared on DEV Community and was authored by Pety Ialimijoro Rakotoniaina
Suppose you have a contact info type containing email and phone number in which one of them is mandatory but not both.
How are we going to tell Typescript that if email is defined, then phone number is optional or if phone number is defined then email is optional?
You may be attempting to make both of them optional as the following:
export type ContactInfo = {
email?: string;
phoneNumber?: string;
}
But with that approach, none of the email or phoneNumber property is required and the following syntax is valid:
// valid
const johnDoeContact: ContactInfo = {};
The solution
We can use Typescript Discriminated Unions to solve it:
export type ContactInfoRequiredEmail = {
email: string;
phoneNumber?: string;
};
export type ContactInfoRequiredPhoneNumber = {
email?: string;
phoneNumber: string;
};
export type ContactInfo =
| ContactInfoRequiredEmail
| ContactInfoRequiredPhoneNumber;
Now Typescript will throw error with the previous example of John Doe contact but will accept the following example:
// not valid
const johnDoeContact: ContactInfo = {};
// valid
const janeContact: ContactInfo = {
email: 'janecontact@domain.com',
};
// also valid
const jamesContact: ContactInfo = {
phoneNumber: '+261343790400',
};
This content originally appeared on DEV Community and was authored by Pety Ialimijoro Rakotoniaina
Pety Ialimijoro Rakotoniaina | Sciencx (2025-01-19T04:15:42+00:00) How to make a dependent types in Typescript. Retrieved from https://www.scien.cx/2025/01/19/how-to-make-a-dependent-types-in-typescript/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.