Create Typescript class and object

If you are completely new to typescript, then i suggest you go through earlier post about Typescript basic syntax example, that will help you to understand this tutorial better, where we see Typescript class example, creating typescript object, instance of typescript class!

class ClassName
{
    intPropertyName: number=1;
    stringPropertyName: string = "Training";       
}

TypeScript Properties and Methods

In this tutorial, we learn how to create typescript class and its properties, methods in it. If you are familiar with c#, JavaScript, Php etc. You may find much similarity in syntax.

Define TypeScript Class

TypeScript is an open-source, object oriented programming language developed by Microsoft.

Here is an example of simple class with few properties

export class StudentComponent
{
    studentId: number=0;
    title: string = "Create";   
    errorMessage: any;  
    fullname: string="";
    address: string = "";    
    isActive: boolean = true;
}

TypeScript class Constructor

Now we see how to write constructor in TypeScript class, it starts with constructor keyword, we can have any number of parameters in constructor defination

export class StudentComponent
{      
constructor(private router: Router,
        private formBuilder: FormBuilder, private _http: Http, @Inject('BASE_URL') baseUrl: string)
    {
        this.myAppUrl = baseUrl;  
    }
}

OnInit Event implementation in TypeScript Class

We can initialize some property value when the class instance is created, and in typescript there is special way to write the on initialized event using implements OnInit .

export class CreateStudentComponent implements OnInit  {
    ngOnInit() { 
        // here we can initialize property values
    }
}

TypeScript Class Inheritance example
Here we learn how to use inheritance feature in TypeScript class

So this is a base class with one variable value can be set through constructor.

class TeamMember {
    name: string;
    constructor(name: string) {
        this.name = name;
    }
}

This is how you can inherit the above class to a new class

So extends is the keyword used for inheritance in TypeScript

class Student extends TeamMember {
memberId: number;
constructor(empcode: number, name: string) {
super(name);
     this.memberId = empcode;
    }
    displayName(): void {
        console.log("Name = " + this.name +
            ", Member Id = " + this.memberId);
    }
}

Using super we are calling the constructor of base class

You may be interested to read following posts:

TypeScript Tutorial | JavaScript Course

TypeScript Class Methods, Properties Syntax

Learn typescript programming with real-time examples.

Popular Libraries

Javascript Course Online

Learn TypeScript programming

TypeScript and JavaScript Examples