Typescript type alias [With examples]

In this typescript tutorial, we will see what is type alias in typescript is and how to create a type alias in typescript with different examples. Here are the examples we will cover:

  • What is a typescript type alias
    • Typescript type alias example
  • Typescript type alias vs interface
  • Typescript type alias generic
  • Typescript type alias default value
  • Typescript type alias string
  • Typescript type alias array
  • Typescript type alias async function

What is a Typescript type alias

Type aliases in Typescript give a type a new name. They are comparable to interfaces in that you may name primitives and any other types you would typically have to specify by hand. Aliasing changes the type’s name rather than producing a new one.

Aliasing a primitive isn’t very useful because primitive types make it simple to do so, although it may be done for documentation needs. Giving a type a different name is what is meant by type aliasing.

The syntax of type alias:

type alias = existingType;

Any valid TypeScript type can be used as the existing type.

Read Typescript hello world program for beginners

Typescript type alias example

Now, let’s see an example of a type alias in typescript.

For example, we will create a type alias named ‘info’. The new type in typescript is a combination of a string, a number, and a boolean. If a new variable of that type is declared, the new variable can only be given values of the types integer, string, or boolean.

Now in the code editor create and open a file called ‘typeAllias.ts’. Then write the below code:

// A new type is created
type info = number | string | boolean;

// value is declared of the new type created
let value: info;
value = 1;
console.log(value);
value = "Typescript";
console.log(value);
value = true;
console.log(value);

To compile the code and run the below command and you can see the result in the console.

ts-node typeAlias
Typescript type alias example
Typescript type alias example

Typescript type alias vs interface

Here we will see the difference between typescript type alias and interface.

Interface

Interfaces are another way to identify data structures, such as objects. The interface declaration syntax differs from that of type aliases.

Example:

In the typeAlias.ts file write the below code:

interface Person {
    id: string | number;
    name: string;
    age: number;
    gender: string;
    isWebDev: boolean;
}

const user: Person = {
    id: 12345,
    name: "Tolu",
    age: 1,
    gender: "female",
    isWebDev: true,
};

console.log(user);

To compile the code and run the below command, you can see the result in the console.

ts-node typeAlias.ts
Typescript type alias vs interface
Typescript type alias vs interface

Type alias

A type alias in typescript is just a name for any type. Type aliases can be used to represent not just primitives but also object types, union types, tuples, and intersections.

Example:

In the typeAlias.ts, write the below code

type Person = {
    id: string | number;
    name: string;
    age: number;
    gender: string;
    isWebDev: boolean;
};
const user: Person = {
    id: 123,
    name: "Alex",
    age: 1,
    gender: "male",
    isWebDev: true,
};

console.log(user);

To compile the code and run the below command and you can see the result in the console.

ts-node typeAlias.ts
 type alias vs interface in Typescript
type alias vs interface in Typescript

This is an example of type alias vs interface in Typescript.

Read Typescript Identifiers and Keywords

Typescript type alias default value

Here we will see how we can set a default value for typescript type alias.

For example, we can add a default value directly to the type declaration. So here we will create a typescript type alias with the name ‘info’, and we set some of the default values based on the type for the properties.

In the typeAlias.ts file write the below code:

// Declare the type
type info = {
    name: string;
    strength: number;
    zipcode: number;
    func: Function;
    some_other_stat: number;
}

// Create an object with all the necessary defaults
const defaultSomeType = {
    some_other_stat: 8
}
console.log(defaultSomeType)

// Inject default values into your variable using spread operator.
const infoVariable: info = {
  ...defaultSomeType,
  name: 'UK',
  strength: 5,
  zipcode: 2222,
  func: () => {}
}
console.log(infoVariable);

To compile the code and run the below command, you can see the result in the console.

ts-node typeAlias
Typescript type alias default value
Typescript type alias default value

This is an example of a Typescript type alias default value.

Read How to compare two strings in typescript

Typescript type alias generic

Here we will see how we can create generic type alias in typescript.

TypeScript supports the usage of generic type aliases. Let’s look at an example of how to achieve this.

In the typeAlias.ts write the below code:

type NumList<T> = {item:T[]};
let num : NumList<number> = {item: [1,2,3,4]};
console.log(num);

To compile the code and run the below command, you can see the result in the console.

ts-node typeAlias
Typescript type alias generic
Typescript type alias generic

This is an example of a Typescript type alias generic.

Read Typescript type annotation

Typescript type alias string

Here we will see how we can define a type alias for a string literal in typescript.

For example, we will type alias as a country, and the country type will contain a string literal.

The typeAlias.ts contains the below code:

type country = 'USA' | 'UK';
let country1: country = 'USA';
let country2: country = 'UK';
console.log(country1);
console.log(country2);

To compile the code and run the below command, you can see the result in the console.

ts-node typeAlias
Typescript type alias string
Typescript type alias string

This is an example of Typescript type alias string.

Typescript type alias array

Here we will see how we can define a type alias for an array in typescript.

For example, we will create a type alias as numArray, an array of numbers.

In the typeAlias.ts, write the below code:

type numArray= number[];
 
 
let arr:numArray=[]
arr[0]=12;
arr[1]=25;
console.log(arr)

To compile the code and run the below command and you can see the result in the console.

ts-node typeAlias.ts
Typescript type alias array
Typescript type alias array

This is an example of Typescript type alias array.

Read Typescript array

Typescript type alias async function

Here we will see how we can define the type alias async function in typescript.

For example, we define a type alias name as newType as a String or number. Then we create an async function, which will check the type of input, if the type is a number, then it will log ‘This is a number, else it will check the type and log ‘ This is a string’.

In the typeAlias.ts file write the below code:

type newType = number | string;



// ✅ Arrow function with Type

async function isNumber(num: newType): Promise<void> {

    await Promise.resolve();

    console.log("Given value: "+ num);

    if(typeof(num)==='number'){

        console.log('This is a number');

    }

    if(typeof(num)==='string'){

        console.log("This is a string");

    }

}



isNumber(5)

isNumber('5')

To compile the code and run the below command, and you can see the result in the console.

ts-node typeAlias
Typescript type alias async function
Typescript type alias async function

This is an example of a Typescript type alias async function.

Conclusion

In this typescript tutorial, we saw what is typescript type alias and with an example, we saw how we can use a typescript type alias. Here is the example we covered:

  • What is a typescript type alias
    • Typescript type alias example
  • Typescript type alias vs interface
  • Typescript type alias generic
  • Typescript type alias default value
  • Typescript type alias string
  • Typescript type alias array
  • Typescript type alias async function

You may like the following typescript tutorials:

>