Typescript inheritance property

Question

The code is as below:

class BaseClass {
   propertyA: KnockoutObservable<string> = ko.observable<string>();
   constructor(message: string) {
      this.propertyA.subscribe((newValue)=>{
          console.log(newValue); // not run when change propertyA in ChildClassA instance.
      });
   }      
}
class ChildClassA extends BaseClass   {
   propertyA: KnockoutObservable<string> = ko.observable<string>(); //remove it, the issue is solved.
}

I noticed that when the ChildClassA has the same property named as the BaseClass, the subscription function for propertyA will not run. Remove that line of declaration in ChildClassA will solved the issue.

Why?

Bruno Grieder · Accepted Answer · 2016-07-29 09:29:14Z

This is because you are reassigning this.propertyA in ChildClassA after assigning it in the BaseClass

When compiled to Javascript the code becomes

var BaseClass = (function () {
    function BaseClass(message) {
        this.propertyA = ko.observable();
        this.propertyA.subscribe(function (newValue) {
            console.log(newValue); // not run when change propertyA in ChildClassA instance.
        });
    }
    return BaseClass;
}());
var ChildClassA = (function (_super) {
    __extends(ChildClassA, _super);
    function ChildClassA() {
        _super.apply(this, arguments);
        this.propertyA = ko.observable(); //remove it, the issue is solved.
    }
    return ChildClassA;
}(BaseClass));

See it in playground

When instantiating ChildClassA you are calling super which calls the constructor of BaseClass which assigns this.propertyA and subscribes the listener. Fine. However right after the call to super, you are reassigning this.propertyA in ChildClassA constructor with the line

this.propertyA = ko.observable(); //remove it, the issue is solved.

Property initializations are moved to the constructor, after super calls.

There is no such thing as overriding properties (by inheritance) in Typescript.

Collectives™ on Stack Overflow

Typescript inheritance property

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related