By 06/07/2015 17 Comments

Function Overriding In TypeScript

Definition Of Function Overriding:

  • In TypeScript inheritance when derived classes re-declares or re-implements the same function of its base class that process is called function/method overriding.
  • For override a function a derived class must implements that function which matches the name of the function, parameter-list, return type or signature in its base class.
  • The functions of the base class can be re-declared or re-defined in one or more derived classes, each derived class defines its own version of function.
  • Function overriding allows to derived classes for add extra, new features, operations and its own updated implementation in exists functions of its base classes.
  • In TypeScript, like functions, properties/variables can also be overridden.

Example:

// 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()));






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 .