Typescript: Type Utilities for the goodness and reusability

How to use Pick/Omit/Exclude/etc.. to do cool stuff..

The pick is a utility .. utility type that allows you to select specific properties from an object type and create a new type with only those properties .. cool?

// Define a User interface
interface User {
  name: string;
  age: number;
  address: string;
  email: string;
  single: boolean;
  job: string;
  degree: string;
}

// Now we r sliccccing 😀
type UserBasicInfo = Pick<User, 'name' | 'age'>;

const newUser: UserBasicInfo = {
  name: 'Taric Ov',
  age: 28
};

console.log(newUser); // { name: 'Taric Ov', age: 28 }
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0pyy0r737d6rqeyd9u79.png)

In the above example:

1. We have an interface User that defines their properties.
2. We used the Pick<User, 'name' | 'age'> type to create a new type called PersonBasicInfo that only includes the name and age properties from the whole User interface.
3. We then created an object of the type UserBasicInfo called newUser with the selected properties.

got it? if yes? that sounds great cuz u know what? you now got Omit/Exclude as well 😮💪 congrats 😉

if still need more explanation? try it in code and follow the comments 😊

So..

Omit is also a utility type that does the opposite of Pick. It allows you to exclude specific properties from an object type and create a new type without those properties.

— The terms “omit” and “exclude” can be used interchangeably in the context of utility types in TypeScript. Both Omit and Exclude are utility types that provide similar functionality but with slight differences.

// Omitting 
interface User {
  name: string;
  age: number;
  address: string;
}
type UserWithoutAddress = Omit<User, 'address'>;

//Excluding numbers from a literal
type Numbers = 1 | 2 | 3 | 4 | 5;
type ExcludedNumbers = Exclude<Numbers, 1 | 3 | 5>;
// ExcludedNumbers: 2 | 4

What About the other utility types in TypeScript?

1. Partial: This utility type creates a new type that makes all properties of the original type T 👉 optional.

2. Required: This utility type creates a new type that makes all properties of the original type T 👉 required.

3. Readonly: This utility type creates a new type that makes all properties of the original type T 👉 read-only.

4. Record: This utility type creates a new type with keys of type K and values of type T 👉 It's often used to define dictionaries or mappings.

These utility types, along with Omit and Exclude, provide powerful ways to manipulate and transform types and even to do cool tricks in TypeScript.. and that's what we are to explore in the next tutorial.
till then.. keep ur types tight 💪

Next: Type Templates 🤘(…out the oven)

Comments

[Sebastian Wessel]

Thanks for sharing this.
Think many developers - even experienced ones - are not using this great features.
You very often see full typescript definition instead of simply re-using existing ones.
But the re-usage can really help to keep things consistent.
Because for example you add only one prop in one definition, and propagate it to all depending ones.

[Taric Ov]

totally agree w/ Sebastian .. the perks of these utilities combined w/ generics could ease woking w/ types sooo simple, increasing readability and efficiency.