TypeScript – Type System

TypeScript supports type checking for all static types i.e. Primitive types and Object types. It also supports generics, decorators and ES6 module types as well.

It is important to learn that the type system in typescript is designed to be optional. So all JavaScript programs are TypeScript programs as well.

Table of Contents

1. Static types
	1.1. Primitive Types
	1.2. Object Types
2. Generics
3. Decorators

1. Static Types

In the context of language semantics and type systems, static types usually means “at compile time” or “without running a program”, while dynamic types means “at runtime”.

In a statically typed language (e.g. TypeScript), variables, parameters, and members of objects have types that the compiler knows at compile time. The compiler can use that information to perform type checks and to optimize the compiled code.

Static types in TypeScript can be divided into two sub-categories:

1.1. Primitive Types

TypeScript has 5 primary primitive types –

1. number
2. string
3. boolean
4. void
5. any

				let num: number = 123;
				num = 123.456;
				num = '123'; 	// Error
			

				let str: string = 'hello';
				str = 'world';
				str = 123; 	// Error
			

				let bool: boolean = false;
				bool = true;
				bool = 123; 	// Error
			

				let val: any = 'hello';
				
				val = 123; 		// OK

				val = true; 	// OK
			

1.2. Object Types

TypeScript supports following object types.

			var names:string[];	//declaration 

			names = ["how","to","do","in","java"];	//initialization
			

			var items;	//declaration 

			items = ["how", 2, "do", 1 , true];	//initialization
			

			interface ICalc { 
				add (first: number, second: number): any;
			} 

			let Calculator: ICalc = {
				add(first: number, second: number) {
					return first + second;
				}
			}
			

			class Person { 

			   //field 
			   name:string; 
			 
			   //constructor 
			   constructor(name:string) { 
			      this.name = name; 
			   }  

			   //function 
			   speakName():void { 
			      console.log("Name is  :   "+this.name) 
			   } 
			}
			

			enum Direction {
			    Up,
			    Down,
			    Left,
			    Right
			}

			let go: Direction;
			go = Direction.Up;
			

				let fun: Function = () => console.log("Hello");

				fun = 123; //Error
			

2. Generic Types

Generics allows to create a component that can work over a variety of types rather than a single one. e.g.

function throwBack<T>(arg: T): T {	//Function return the parameter as it is
    return arg;
}

let outputStr = identity<string>("myString"); 	//OK

let outputNum = identity<number>( 100 ); 		//OK

3. Decorators

In general sense, decorators are annotations. They are used with '@' symbol. It allows us to decorate classes and functions, similar to annotations in java and decorators in python.

Decorators is a new feature that will probably make it into the ES7 version of JavaScript. However the functionality is available in TypeScript (experimental), so we can already make use it.

3.1. How to use Decorator

It is important to learn that every decorator is javascript function. To create decorator, create function like this:

function printable ( target ) {
	Object.defineProperty(target.prototype, 'print', {value: () => "Lokesh Gupta"});
}

@printable
class Person {
    
}

let admin = new Person();
console.log(admin.print()); // Lokesh Gupta

That’s all for type system in typescript. Drop me your questions in comments section.

Happy Learning !!