Inheritance in TypeScript


In a previous entrance, you already knew that Classes doesn’t exist in Javascript. Also, JavaScript does not have the concept of true inheritance (object-oriented inheritance).  Let’s go …

Inheritance in TypeScript

Javascript does support prototyping and that is a type of object-based inheritance. TypeScript supports an inheritance model that is more aligned with other object-oriented languages. It’s easy to work with and under the covers it’s leveraging the normal JavaScript prototyping functionality. The inheritance model that TypeScript supports aligns to the work being done in ECMAScript 6.

ECMAScript 6 supports the extends keyword. That is, one class can extend another which means that the second class can leverage the properties and methods of the first and then add some of its own. That’s inheritance.  (It’s worth mentioning that by learning TypeScript you’re setting yourself up for the future of JavaScript. As JavaScript changes to align to ECMAScript 6, TypeScript authors can continue to maintain consistency in their code base and the TypeScript compiler will take care of the alignment.) You can only inherit from one base class. This is very similar to what you would do in C#, in Java, and other modern object-oriented languages.

To work with a base class, you have to imploy the super keyword. This is similar to how inheritance works in Java. The super method actually calls the base class’s constructor which allows you to leverage the work the base class is doing in that constructor rather than rewriting that functionality. Subclasses can also override methods in the base class to extend their functionality.

A derived class inherits all members from its base class it doesn’t override. Inheritance means that a derived class implicitly contains all non-overridden members of the base class. Only public and protected property members can be overridden.

A property member in a derived class is said to override a property member in a base class when the derived class property member has the same name and kind (instance or static) as the base class property member. The type of an overriding property member must be assignable to the type of the overridden property member, or otherwise a compile-time error occurs.

Keep in mind the following when working with inheritance:

  • Base class instance member functions can be overridden by derived class instance member functions, but not by other kinds of members.
  • Base class instance member variables and accessors can be overridden by derived class instance member variables and accessors, but not by other kinds of members.
  • Base class static property members can be overridden by derived class static property members of any kind as long as the types are compatible, as described above.

But .. we can go further

Overloads and Overrides

As with other object-oriented languages, TypeScript supports function overloads (functions with the same name but different parameter signatures) and overrides (creating a function in a subclass with the same name as the function in the base class but with different functionality). Overloads can be used in a base class or a subclass. Overrides can only be used in a subclass.

I stop here becuase this topics are complicated, but at least, I want you to know that they exist in TypeScript.

Happy coding!