# Typescript - Tips & Tricks - Conditional Type

> In some cases, we need to detect if an object/type has specific properties or characteristics. Let me...

- **Author**: Luca Del Puppo (@puppo92) — AI Native Engineer at Nearform
- **Published**: Mar 24, 2021
- **Canonical URL**: https://delpuppo.net/blog/ts-tips-and-tricks/typescript-tips-tricks-conditional-type/
- **Series**: TypeScript - Tips & Tricks (Part 17 of 21) — https://delpuppo.net/blog/series/ts-tips-and-tricks/
- **Series LLMs.txt**: https://delpuppo.net/blog/series/ts-tips-and-tricks/llms.txt
- **Category**: TypeScript
- **Tags**: typescript, webdev
- **Hashnode Mirror**: https://blog.delpuppo.net/typescript-tips-tricks-conditional-type
- **Dev.to Mirror**: https://dev.to/playfulprogramming/typescript-tips-tricks-conditional-type-5gll
- **Blog Index LLMs.txt**: https://delpuppo.net/blog/llms.txt

## Series Context: TypeScript - Tips & Tricks

- Part 1: [Typescript - Tips & Tricks - typeof](https://delpuppo.net/blog/ts-tips-and-tricks/typescript-tips-tricks-typeof/)
- Part 2: [Typescript - Tips & Tricks - Literal Types](https://delpuppo.net/blog/ts-tips-and-tricks/typescript-tips-tricks-literal-types/)
- Part 3: [Typescript - Tips & Tricks - keyof](https://delpuppo.net/blog/ts-tips-and-tricks/typescript-tips-tricks-keyof/)
- Part 4: [Typescript - Tips & Tricks - Union and Intersection](https://delpuppo.net/blog/ts-tips-and-tricks/typescript-tips-tricks-union-and-intersection/)
- Part 5: [Typescript - Tips & Tricks - Overloaded Functions](https://delpuppo.net/blog/ts-tips-and-tricks/typescript-tips-tricks-overloaded-functions/)
- Part 6: [Typescript - Tips & Tricks - this parameter](https://delpuppo.net/blog/ts-tips-and-tricks/typescript-tips-tricks-this-parameter/)
- Part 7: [Typescript - Tips & Tricks - any vs. unknown](https://delpuppo.net/blog/ts-tips-and-tricks/typescript-tips-tricks-any-vs-unknown/)
- Part 8: [Typescript - Tips & Tricks - Optional modifier](https://delpuppo.net/blog/ts-tips-and-tricks/typescript-tips-tricks-optional-modifier/)
- Part 9: [Typescript - Tips & Tricks - Index Signature](https://delpuppo.net/blog/ts-tips-and-tricks/typescript-tips-tricks-index-signature/)
- Part 10: [Typescript - Tips & Tricks - readonly modifier](https://delpuppo.net/blog/ts-tips-and-tricks/typescript-tips-tricks-readonly-modifier/)
- Part 11: [Typescript - Tips & Tricks - Readonly Array](https://delpuppo.net/blog/ts-tips-and-tricks/typescript-tips-tricks-readonly-array/)
- Part 12: [Typescript - Tips & Tricks - Tuple](https://delpuppo.net/blog/ts-tips-and-tricks/typescript-tips-tricks-tuple/)
- Part 13: [Typescript - Tips & Tricks - Non-null assertion operator](https://delpuppo.net/blog/ts-tips-and-tricks/typescript-tips-tricks-non-null-assertion-operator/)
- Part 14: [Typescript - Tips & Tricks - Never type](https://delpuppo.net/blog/ts-tips-and-tricks/typescript-tips-tricks-never-type/)
- Part 15: [Typescript - Tips & Tricks - Assert Function](https://delpuppo.net/blog/ts-tips-and-tricks/typescript-tips-tricks-assert-function/)
- Part 16: [Typescript - Tips & Tricks - Type Guard](https://delpuppo.net/blog/ts-tips-and-tricks/typescript-tips-tricks-type-guard/)
- Part 17: [Typescript - Tips & Tricks - Conditional Type](https://delpuppo.net/blog/ts-tips-and-tricks/typescript-tips-tricks-conditional-type/) **(Current Article)**
- Part 18: [Typescript - Tips & Tricks - infer keyword](https://delpuppo.net/blog/ts-tips-and-tricks/typescript-tips-tricks-infer-keyword/)
- Part 19: [Typescript - Tips & Tricks - Mapped Types](https://delpuppo.net/blog/ts-tips-and-tricks/typescript-tips-tricks-mapped-types/)
- Part 20: [Typescript - Tips & Tricks - Advanced Types](https://delpuppo.net/blog/ts-tips-and-tricks/typescript-tips-tricks-advanced-types/)
- Part 21: [Typescript - Tips & Tricks - Rest Parameters & Rest Arguments](https://delpuppo.net/blog/ts-tips-and-tricks/typescript-tips-tricks-rest-parameters-rest-arguments/)

---

In some cases, we need to detect if an object/type has specific properties or characteristics.
Let me show you a simple case
```ts
type TypeName<T> =
    T extends string ? "string" :
    T extends number ? "number" :
    T extends bigint ? "bigint" :
    T extends boolean ? "boolean" :
    T extends undefined ? "undefined" :
    T extends symbol ? "symbol" :
    T extends Function ? "function" :
    T extends null ? "null" :
    "object";

const typeName = <T>(obj: T): TypeName<T> => {
  if (obj === null) return "null" as TypeName<T>;
  return typeof obj as TypeName<T>;
};

const stringType = typeName('string'); // "string"
const numberType = typeName(10); // "number"
const bigIntType = typeName(10n); // "bigint"
const booleanType = typeName(true); // "boolean"
const undefinedType = typeName(undefined); // "undefined"
const symbolType = typeName(Symbol()); // "symbol"
const functionType = typeName(() => 'result'); // "function"
const nullType = typeName(null); // "null"
const objectType = typeName({ name: 'name'}); // "object"
```
In this example, we return the type of the parameter as a string, but I want to focus on the TypeName type. This type as you can see, returns the values based on some conditions. In this case, the conditions are based on the parameter's type, but my goal is to show you that you could check if a type respects some conditions or not and act accordingly.
This feature is called Conditional Types.
To show you the power of this feature here a funny example found in the net :)
```ts
type SnackBars = {
  name: "Short Chocolate Bars";
  amount: 4;
  candy: true;
};

type Gumballs = {
  name: "Gooey Gumballs";
  color: "green" | "purples";
  candy: true;
};

type Apples = {
  name: "Apples";
  candy: true;
};

type Cookies = {
  name: "Cookies";
  candy: true;
  peanuts: true;
};

type SnickersBar = {
  name: "Snickers Bar";
  candy: true;
  peanuts: true;
};

type Toothpaste = {
  name: "Toothpaste";
  minty: true;
  trick: true;
};

type Pencil = {
  name: "Pencil";
  trick: true;
};

type HalloweenTricksAndSweets =
  | SnackBars
  | Gumballs
  | Apples
  | SnickersBar
  | Cookies
  | Toothpaste
  | Pencil;

type AllCandies<T> = T extends { candy: true } ? T : never;
type AllTricks<T> = T extends { trick: true } ? T : never;
type AllCandiesWithoutPeanuts<T> = T extends { candy: true } ? (T extends { peanuts: true } ? never : T) : never;

type Candies = AllCandies<HalloweenTricksAndSweets>; // SnackBars | Gumballs | Apples | SnickersBar | Cookies
type Tricks = AllTricks<HalloweenTricksAndSweets>; // Toothpaste | Pencil
type CandiesWithoutPeanuts = AllCandiesWithoutPeanuts<HalloweenTricksAndSweets>; // SnackBars | Gumballs | Apples
```
In this example, you can see how the AllCandies type creates a new type (Candies) composed of all the HalloweenTricksAndSweets that contain the candy property with the true value. The AllTricks type creates a new type (Tricks) composed of all the HalloweenTricksAndSweets that contain the trick property with the true value. The last case AllCandiesWithoutPeanuts is interesting: we get all the candies that don't contain the peanuts property with the true value.
I think this funny example can express best the potential of the Conditional Type, and it can help you to understand better all the benefits it can lead to.

It's all for today.
I hope this feature will help you in the future as it helped me in some cases.

See you soon Guys!