Post
Ask Question

Variables, Data Types, Type Annotation And Enum In TypeScript

In this article, we will see Variable Declaration, Type Annotation, different Data Types, Array and Enum in TypeScript.

Variable Declaration

We declare variables using the let keyword.

Type the following command in command prompt,

code datatype.ts

 

 

Press enter, VS Code window will appear.

Write the following code,

  1. lettotalCount=10;  

 

So, here I am assigning the number 10 to variable totalCount. Now, if I assign some string data to it then it will give compilation error:

  1. lettotalCount=10;  
  2. totalCount='Sunday';  

Error

Type '"Sunday"' is not assignable to type 'number'.

We can do this perfectly in JavaScript because in JavaScript we can change the data type on the fly.

We have not defined any data type for the variable totalCount, here TypeScript identifies the data type from the content which is being assigned to the variable totalCount. You can also define a variable by mentioning the data type as shown below:

  1. lettotalCount:number=10;  

We can also define a variable without mentioning data type and without assigning any value:

  1. letcustomerName;  

See the above variable declaration, here we have not mentioned any data type for variable ‘customerName’ and we have not assigned any data to variable ‘customerName’, it is similar to a variable defined in JavaScript.

Now, we can assign any type of data to ‘customerName’ variable.

  1. letcustomerName;  
  2. customerName='Ravi';  
  3. customerName=10;  
  4. customerName=true;  

All of the above statements are correct and it will be compiled without any error. Here type of variable ‘customerName’ will be ‘any’, so the below 2 statements are equivalent :

  1. letcustomerName;  
  2. letcustomerName:any;  

Type Annotation

If we don't know the value of variable then we can use type annotation. Below is the syntax for declaring a variable using Type Annotation:

  1. letcustomerName:string;  

After variable declaration we can assign values:

  1. customerName='Ravi';  

Using type annotation, we have declared that customerName will be of type string so now it will accept only string data and the statements where we have assigned a number and boolean values will give a compilation error.

Data Types

In TypeScript we have different data types:

  • Number
  • String
  • Boolean
  • Any

We have number datatype which can include integer as well as a float. We have a string data type. We have Boolean which can have true and false values. We also have ‘any’ which can hold any type of data.

  1. letage: number = 30;  
  2. letfullname: string = 'Rajesh Verma';  
  3. letisActive: boolean = true;  
  4. letx: any;  

Array

Now, we will see the syntax for declaring the array, in the below code we have declared an array of numbers,

  1. letorderAmounts:number[];  

We can also initialize the array at the time of declaration, below is the syntax for initializing an array,

  1. letorderAmounts:number[]=[1000,2000,3000];  

We can also declare an array with type ‘any’ which can hold multiple data types,

  1. letcustomerDetails:any[]=['Ayush','[email protected]',true,29,8876712121];  

Enum

Enum is a group of related constants, we can put all related constants into a container.

Now we will see the syntax for declaring Enum in typescript,

  1. enumWorkingDays {Monday,Tuesday, Wednesday,Thurday};  

In Enum, the first element automatically gets value 0 and all subsequent elements are assigned value incremented by one.

  1. enumWorkingDays {Monday=0,Tuesday=1, Wednesday=2,Thurday=3}; 

We should assign values explicitly in enum to avoid further mistakes when someone else is adding some constant value in the existing enum.

Now, we will see the syntax for using an enum,

  1. letworkingDay=WorkingDays.Monday; 

You can visit my below articles if you want to understand installation of TypeScript and VS Code,
Next Recommended Reading Typescript - Usage of Extend ,Enum And Read Only Keywords