By 06/07/2015 14 Comments

Inheritance In TypeScript

Definition Of Inheritance:

  • It is the one of the basic principal of object oriented programming.
  • Inheritance describes the hierarchically classifications between the objects.
  • In general terms inheritance defines the “IS A” relationship between objects such as a Mark sheet IS An university mark sheet, a saving account IS A type of bank account, dog IS AN animal IS A mammal and an employee IS A person etc., so we can easily find inheritance situation by recognized a “IS A” relationship between objects.
  • We can implement inheritance principal in our TypeScript programs by defining multiple classes.
  • In TypeScript, inheritance can be implemented by inherit one class into other classes, the class which is being inherited is called base, father, parent or super class and the class which is inheriting is called a child, sub or derived class.
  • When a base class is being inherited into its derived class all members (functions and properties) of base class automatically exist into its derived class except those members which has their “private” access because private members do not inherit, now all base class public members can also be accessed by derived class object, derived class is free and can also be defined its own members (functions and properties) and can also override/modified any member of a base class in it. The base class does not have knowledge about any it’s derived class and it cannot access its derived class members but base class is free and can access its own members.


class derived-class extends base-class{
  // class body, any members can be defined...
class derived-class
  • Name of a class which is inheriting also called derived class.
  • The keyword “extends” is indicating that one class (base class) is being inherited into other (derived class).
  • Name of a class which is being inherited also called base class.
  • body of a class, any class member can be declared/defined here.
// a class declaration. This is a base class.
class MarkSheet {

    // properties declaration of different types.
    studentName: string;
    tsMarks: number;
    aspMarks: number;

    /* function declaration which returns student name. It has string as its return type, empty parameter-list and public access by default. */
    getName(): string {
        return (this.studentName);

    /* function declaration which returns total marks. It has number as its return type, empty parameter-list and public access by default. This function is re-implemented by a derived class. */
    totalMarks(): number {
        return 300;

    /* function declaration which returns obtain marks. It has number as its return type, empty parameter-list and public access by default. This function is re-implemented by a derived class.*/
    obtMarks(): number {
        return (this.tsMarks + this.aspMarks);

    /* function declaration which returns percentage. It has number as its return type, 2 number type parameters and public access by default. */
    percentage(total: number, obtain: number): number {
        return obtain / total * 100.0;


/* Following is another class BcsMarksheet declaration, notice its syntax here it is inheriting a MarkSheet class means BcsMarksheet class is a derived or child class of MarkSheet and MarkSheet class is a base or parent class of BcsMarkSheet, so all the public members of base MarkSheet class is now exists in derived BcsMarksheet class and can be access through BcsMarksheet object reference. */
class BcsMarksheet extends MarkSheet {

// 2 properties are declared in this derived class.
    htmlMarks: number;
    javaMarks: number;

/* following functions is re-implemented in this class. This process is called function overriding. */
    obtMarks(): number {
        return (this.tsMarks + this.aspMarks + this.htmlMarks + this.javaMarks);

/* following functions is re-implemented in this class. This process is called function overriding. */
    totalMarks(): number {
        return 400;

// object creation of Bcs mark sheet with default constructor.
var bcsMarksheet: BcsMarksheet = new BcsMarksheet();

/* Following statements call the different functions of above class through its derived class reference (reference variable) and also print them. */
document.write("Bcs Mark sheet: <br/>");

bcsMarksheet.studentName = "Abc";
bcsMarksheet.tsMarks = 85;
bcsMarksheet.aspMarks = 70;
bcsMarksheet.htmlMarks = 65;
bcsMarksheet.javaMarks = 55;

document.write("Student name: " + bcsMarksheet.getName() + "<br/>");
document.write("TypeScript marks: " + bcsMarksheet.tsMarks + "<br/>");
document.write("Asp marks: " + bcsMarksheet.aspMarks + "<br/>");
document.write("Html marks: " + bcsMarksheet.htmlMarks + "<br/>");
document.write("Java marks: " + bcsMarksheet.javaMarks + "<br/>");
document.write("Total marks: " + bcsMarksheet.totalMarks() + "<br/>");
document.write("Obtain marks: " + bcsMarksheet.obtMarks() + "<br/>");
document.write("Percentage: " + bcsMarksheet.percentage(bcsMarksheet.totalMarks(), bcsMarksheet.obtMarks()));

More Points About Inheritance:

  • In TypeScript only multilevel inheritance is supported which means we can inherits only one base class for derived class at a time and cannot inherits more than one/multiple base classes into a single derived class at a time.
  • Same base class can inherits the several numbers of derived classes.
  • In inheritance any derived classes can become the base classes of another classes, for instance class A can inherits into class B, class B can inherits into class C, class C can inherits into class D and so on that chain is called multilevel inheritance or hierarchy.
  • There are two main advantages of using inheritance those are: if we works on multiple classes and we find some common members in these classes than we create a base class for those classes, second inheritance prevents duplication and re-writing of class members.

← Previous Tutorial

Leave your valuable Comment

Have a natural attraction for women cosmetics and replica watches uk clothes, no
more than two for men the most attractive one, is to make their own driving experience, happy and can serve as the facade of the car, another is to highlight the taste edify sentiment rolex replica watch. The replica rolex is undoubtedly the most fashionable accessories, wear a suit to attend the activities, but also get a decent match on the replica watches .