DEV Community

Cover image for Mastering Advanced Types in TypeScript.
Ahmada Khalid
Ahmada Khalid

Posted on

Mastering Advanced Types in TypeScript.

TypeScript, a superset of JavaScript, provides several advanced types that can be used to improve the safety and readability of your code. Some examples include:

  1. Intersection Types: These are used to combine multiple types into a single type. For example, if you have a variable that should be both a number and a string, you can use an intersection type:
let x: number & string;
Enter fullscreen mode Exit fullscreen mode
  1. Union Types: These are used to specify that a variable can be of one of several types. For example, if a variable can be either a number or a string:
let x: number | string;
Enter fullscreen mode Exit fullscreen mode
  1. Tuple Types: These are used to specify the types of the elements of an array. For example, if you want to create an array of a specific length with specific types of elements, you can use a tuple type:
let x: [string, number];
Enter fullscreen mode Exit fullscreen mode

4.Type Aliases: These are used to give a type a specific name. For example, you can create a type alias for an intersection or union type:

type MyType = number | string;
Enter fullscreen mode Exit fullscreen mode

5.Enum Type: Enumerated type is a way of defining a set of named values. For example, you can create an enumeration of the days of the week:

enum Days {Monday, Tuesday, Wednesday, Thursday, Friday, Saturday, Sunday};
Enter fullscreen mode Exit fullscreen mode

6.Generics: These are used to create a type that is independent of other types. For example, if you want to create a function that can accept any type of argument and return any type of value, you can use generics:

function identity<T>(arg: T): T {
    return arg;
}
Enter fullscreen mode Exit fullscreen mode

In TypeScript, the Omit type is used to create a new type by picking a set of properties from an existing type and then removing a set of properties from that type. For example, if you have an interface like this:

interface Person {
    name: string;
    age: number;
    address: string;
}
Enter fullscreen mode Exit fullscreen mode

You can use Omit to create a new type that excludes the "address" property:

type PersonWithoutAddress = Omit<Person, "address">;
Enter fullscreen mode Exit fullscreen mode

Now, PersonWithoutAddress is a new type that has all the properties of Person except "address".

Another useful type utility is Pick, this creates a new type by picking a set of properties from an existing type.

type PersonName = Pick<Person, "name">;
Enter fullscreen mode Exit fullscreen mode

There are other utility types such as Exclude, Extract, Record and InstanceType that can help you manipulate and create new types.

interface Person {
    name: string;
    age: number;
    address: string;
    phone: number;
}
Enter fullscreen mode Exit fullscreen mode

You can use Exclude to create a new type that excludes the properties "name" and "age":

type PersonWithoutNameAge = Exclude<keyof Person, "name" | "age">;
Enter fullscreen mode Exit fullscreen mode

Now, PersonWithoutNameAge is a new type that includes all properties of Person except "name" and "age".

Extract: This type is used to extract a set of properties from an existing type. For example, if you have an interface like this:

interface Person {
    name: string;
    age: number;
    address: string;
    phone: number;
}
Enter fullscreen mode Exit fullscreen mode

You can use Extract to create a new type that includes the properties "name" and "age":

type PersonNameAge = Extract<keyof Person, "name" | "age">;
Enter fullscreen mode Exit fullscreen mode

Now, PersonNameAge is a new type that includes only the properties "name" and "age" of Person.

Record: This type is used to create a new type that maps keys of a certain type to values of another type. For example, you can use it to create a dictionary-like object:

type PhoneBook = Record<string, number>;
let phoneBook: PhoneBook = {"John": 123456, "Jane": 789012};
Enter fullscreen mode Exit fullscreen mode

InstanceType: This type is used to obtain the type of an instance of a class. For example, if you have a class like this:

class Person {
    name: string;
    age: number;
}
Enter fullscreen mode Exit fullscreen mode

You can use InstanceType to obtain the type of an instance of the class:

let person: InstanceType<typeof Person> = new Person();
Enter fullscreen mode Exit fullscreen mode

You may ask What is difference between omit and exclude?

The Omit and Exclude utility types in TypeScript are similar in that they both allow you to create a new type by removing properties from an existing type. However, there is a subtle difference between them.

Omit is used to create a new type by picking a set of properties from an existing type, and then removing a set of properties from that type. For example, if you have an interface like this:

interface Person {
    name: string;
    age: number;
    address: string;
}
Enter fullscreen mode Exit fullscreen mode

You can use Omit to create a new type that excludes the "address" property:

type PersonWithoutAddress = Omit<Person, "address">;
Enter fullscreen mode Exit fullscreen mode

Exclude is used to exclude a set of properties from an existing type. For example, if you have an interface like this:

interface Person {
    name: string;
    age: number;
    address: string;
    phone: number;
}
Enter fullscreen mode Exit fullscreen mode

You can use Exclude to create a new type that excludes the properties "name" and "age":

type PersonWithoutNameAge = Exclude<keyof Person, "name" | "age">;
Enter fullscreen mode Exit fullscreen mode

So in summary, Omit allows you to create a new type with a specific set of properties removed, while Exclude allows you to create a new type with a specific set of properties removed from a set of properties.

It's like Omit is a more specific version of Exclude, it allows you to create a new type by picking some properties from an existing type and remove other properties from it.

In conclusion, TypeScript is a powerful superset of JavaScript that provides several advanced types that can be used to improve the safety and readability of your code. These advanced types include Intersection Types, Union Types, Tuple Types, Type Aliases, Enum Types, and Generics. They allow you to create new types from existing ones, and to specify more precise types for your variables and functions.

Furthermore, TypeScript also provides other utility types such as Omit, Exclude, Extract, Record and InstanceType that can help you manipulate and create new types. These types can be very useful when working with complex types, providing a way to manipulate and create new types from existing ones.

In this article, we have covered the basics of these advanced types, and we have provided examples of how they can be used in practice. With this knowledge, you will be able to write more robust and maintainable code in TypeScript, making your development process more efficient.

Top comments (0)