FewV minutes of Type Aliases in Typescript

» What are Type Aliases?

  1. Type aliases is important features in TypeScript which is used to define custom types.

  2. Type aliases are used to give a name to a specific type that is reused. For ex: It can give a name to a union type, object, function or an array which is being used again and again.

  3. Type aliases are defined using the type keyword followed by the new name we want to give to that type, an equal sign, and then existing type that we want to alias. Like this:

type userID = string | number;

  1. In above example, we said that we have type alias called userID which is a union type that can be either a string or a number.

  2. When TypeScript will see this Type Aliases, it will assume that we have typed the actual union type.

  3. The difference now

let myUserID: string | number; //actual union type
type userID = string | number; //type aliased to union type
  1. In above example, and myUserID is the actual union type and the userID is aliased to union type.

» Why use Type Aliases?

  1. Ok, to answer this question, let’s look at the example below.
let firstPersonID: string | number | null;
let secondPersonID: string | number | null;
let thirdPersonID: string | number | null;
let fourthPersonID: string | number | null;
let fifthPersonID: string | number | null;

  1. So here we have five variable which have same three possible type, they can be string or number or null. These are just five variables, what if we have thousand, wouldn’t it be difficult and frustating to write every person’s ID again and again? where in case it just repeating itself again and again.

  2. So to our rescue TypeScript gave us “Type Aliases” which will save our time and wouldn’t be frustating and it will typed like this.

type PersonID = string | number | null;
let firstPersonID: PersonID;
let secondPersonID: PersonID;
let thirdPersonID: PersonID;
let fourthPersonID: PersonID;
let fifthPersonID: PersonID;

  1. Here we just reduced our work by saying we have a type called PersonID which is aliased to union type.

  2. So PersonID is a union type which has 3 type, it can be string or an number or it can be null.

  3. This is just the simple example, type Aliases are mostly used when things gets more complex than this.

» Let’s Look at Type Aliases With a simple Object Type.

type Person = {
  name: string;
  birthyear: number;
  email: string;
};

  1. Here we used an type called Person which is aliased to an object type. In this object we have name, birthyear and email as it’s three properties with type such as string, number and string respectively.

  2. Let’s declare their values now and look at this in console.

type Person = {
  name: string;
  birthyear: number;
  email: string;
};

const PersonInfo = {
  name: "John",
  birthyear: 1997,
  email: "[email protected]",
};

console.log(PersonInfo);
  1. This console.log(PersonInfo); will give us the full object.

Console:

{ name: 'John', birthyear: 1997, email: '[email protected]' }
  1. What if we want a specific value, we can use dot notation.
console.log(`The Person's email is ${PersonInfo.email}.`);

Console:

The Person's email is [email protected].

I hope this cleared - What is Type Aliases? and why do we use it. Thank You!!😊

Topics