TypeScript Tutorial: Types in TypeScript (Chapter 3)

A TypeScript Tutorial for beginners on TypeScript

Types in TypeScript

Types are the biggest addition to the TypeScript over JavaScript, which makes it much superior. During this post we will be seeing most of the types in typescript. This post will bring you to a levelled ground for the remaining of the building blocks of the TypeScript language.

Primitive Types

Like many other matured programming languages, TypeScript also supports these basic types. Here are the primitive data types in TypeScript.

  • String: when an array of characters are required to be stored, like name, email, password etc, this type is used.
  • Number: like integer, decimal, hex, float, binary etc are stored in this type of variable.
  • Boolean: when a true or false value has to be stored in TypeScript we have to use this type of variable.

We can create these variable as shown in the snippet below.

// string
let color: string = "blue";

// number
let age: number = 6;

// boolean
let isDone: boolean = false;

Note the word “let” as compared to “var”. We will see the difference of this in the upcoming chapters.

Arrays and Tuple

Array type in TypeScript is now typed, means as compared to JavaScript, you can define the data type of the member elements of a given array variable. However there is a fallback option available for storing any type of data in array in TypeScript. We will learn about that later in this post. So, an array can be defined as shown in the snippet below.

// JavaScript Style
let colors: string[]

// Generic Type
let colors: Array<string>

Tuple is very similar to array with only difference of having the first few number of elements with predefined data type. Say for example, you can have a tuple something like below snippet.

// tuple
let person: [string, string, number] // firstname, lastname, age

// allowed assignments string
person[0] = "John";
person[1] = "Doe";

// allowed assignments number
person[2] = 28;

// out of know indices 
person[3] = 1984 // outside of known indices [string | number]
person[4] = "Bangalore" // outside of known indices [string | number]

// invalid assignments;
person[0] = 28; // should be a string
person[3] = true; // only string | number as that's known to this variable

Enum

While the above datatypes might have shown you the strengths of TypeScript, enums can be an additional arm itself. Here is an example of enum datatype.

enum Weekdays {
    Sunday,
    Monday,
    Tuesday,
    Wednesday,
    Thursday,
    Friday,
    Saturday
}
// get the weekday number
console.log(Weekdays.Monday);

// get the weekday name as string
console.log(Weekdays[Weekdays.Monday]);

Any

When we say that TypeScript is an extension of JavaScript, there should be some flexibility also like JavaScript. With “any” type, we get that, where we can store any type of data, while remaining within TypeScript bounds. Here is the example of this.

// initialised with number
let someData: any = 30;

// can store string
someData = "John Doe";

// can store boolean too
someData = false;

Though we have seen many of few types in TypeScript, the possibilities are not over yet. You can always refer to the official documentation of ever evolving TypeScript when and where you have doubts. Comments on this post will always remain open and I will try to keep this post under a watch for your questions and feedbacks.

You can also subscribe to the blog if you are interested to follow and get notified of upcoming chapters of this tutorial. I will be posting the next chapter in this tutorial very soon. Till then … enjoy coding.

Go to Beginning with TypeScript Tutorial Index page.

Published by

Anant Anand Gupta

Microsoft Technology Professional

Leave a Reply