Introduction to Typescript and 
Everything about Types

Introduction to Typescript and Everything about Types

Muthu valli's photo
Muthu valli
·Feb 3, 2021·

7 min read

Subscribe to our newsletter and never miss any upcoming articles

Play this article

Getting started with Typescript

download (1).png

Typescript is typed javascript. Typescript is an open-source programming language from Microsoft for building web applications. The code is written in Typescript and compiles down to plain javascript.

  • Typescript eventually at the end of the day, gets converted into javascript only.
  • Typescript actually serves your way better in ANGULAR when compared to anything else.
  • It works on any browser, any os that javascript runs.

We are gonna dive into the TS

Setting up Typescript

To install typescript make sure that you have installed NPM [ Node Package Manager ].

write this to terminal

npm install -g typescript

Assigning types in TS

Typescript is a typed language where we can specify the type of variables.

To assign a type, use let or const then use: then the name of the type then an equal sign, and then value of it. Like this

let varName : type = value ;

Typescript includes all the core types of javascript - number , string , boolean .

Mentioning types allows you to write less buggy code.

TS-Variable

TS encourages us to use var, let const keyword for variable declaration.

var

variables in TS can be declared using var keyword as in JS.

var myVariable : number = 3 ;

let

let declarations can be done without initialization. a variable declared with let have a block-scope and cannot be re-declared.

let myVariable: number = 3 ;

const

const declarations are always initialized with a value. variable declared with const have a block-scope and cannot be re-declared .

const myVariable : number = 3 ;

The Data Types in TS

Typescript Number

Numbers in TS are either floating point or integers.

let myNumber : number = 3 ;

let decNumber : number =3.3;

let bigNumber : bigint =333333333333333333333333;

Typescript String

TS uses (') or (") to surround literalz.

(`) uses to create a multiline string.

let name : string = ' Harry potter ' ;
let role : string =" React native developer " ;


//Multiline string

let experience = ` 3 yearz of experience 
             as react native developer ` ;

Typescript Boolean

It allows two values true and false.

let isGood : boolean ;

isGood = true ;

Typescript ArrayType

It is an ordered list of data.

There are two ways to declare an array variable

//using square brackets 

let list1 : number[ ] = [1,2,3];

//using a generic array type

let list2 : Array<number> =[1,2,3];

Typescript Tuple

A Tuple can contain two values of different data types.

let student : [ string , number ] = [ ' Harry potter ', 3 ] ;

Typescript Enum

An enumerated data type is a group of named constant values.
enum is a way of giving more friendly names to a set of numeric values;

enum color {yellow , purple , blue} ;

let fav : color = color.blue ;
console.log(fav) ; // output is 2

Typescript Any

If you are unsure what the variable type would be then make use of any type.

If you are expecting a value from a third-party library, user inputs, and when the value is dynamic then any type comes in handy here.

This allows you to reassign type of variable to any type .

let numberOne : any =10 ;
numberOne = true ;
numberOne = "hello" ;

// Compiler doesn't throw an error here.

Typescript Void

void is used where there is no data .

Use the void type as the return type of function that does not return a value.

function log(harry) : void {

console.log(harry);

}

Typescript Union

Union allows us to use more than one data type for a variable.

let animal : ( boolean | string ) ;

animal = "Rabbit" ;

animal = true ;

Typescript null,undefined

In TS null and undefined are classified as a subtype of all other types.

let n : null = null ;
let u :undefined = undefined ;

You can assign a value of null and undefined to either boolean, number or string.

let isGood : boolean = null ;
let myName : string = undefined ;

Let us recall the core types of TS

TypeValuesDescription
number3,3.3,-3All numbers . No diff between integers and floats .
string"Hoi",'Hoi',HoiAll text values
booleantrue , falseTruthy and falsy values only .

Tips to compile and run

for example The file is saved as Lco.ts .


Compile it by using tsc Lco.ts  .

Then run it by using node Lco.ts .

Thanks for reading...😀
You can also visit my Linkedin profile...

Did you find this article valuable?

Support Learn Code Online by becoming a sponsor. Any amount is appreciated!

Learn more about Hashnode Sponsors
 
Share this