typescript: member variables from super class's constructor

Question

The following code will alert undefined

class Parent {
    field: string
    constructor() {
       alert(this.field)
    }
}


class Child extends Parent {
    field = 'child'
}

new Child() #=> undefined

whereas, the following alerts 'child' as expected

class Parent {
    field: string
    constructor() {
       alert(this.field)
    }
}


class Child extends Parent {
    field = 'child'
    constructor() {
       // without referencing this.field before super(), this.field stays undefiend
       this.field
       super()
    }

}

new Child() #=> 'child'

Is there any ways to accomplish the following conditions?

omit the whole Child's constructor declaration like the first example
grab the member variable in Child class?

Pace · Accepted Answer · 2019-04-28 07:45:53Z

2

What jumps to mind is:

class Parent {
    constructor(public field: string) {
       alert(this.field)
    }
}


class Child extends Parent {
    constructor() {
       super('child');
    }

}

new Child() #=> 'child'

This doesn't meet your conditions but I feel it is fairly compact.

answered Apr 28, 2019 at 7:45

Pace

44.5k14 gold badges128 silver badges164 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Jonas Wilms · Accepted Answer · 2019-04-28 08:47:40Z

2

Well you could defer the property access to a micortask:

 class Parent {
   field: string
   constructor() {
     Promise.resolve().then(() => {
        alert(this.field)
     };
   }
 }

But while that fullfills your conditions, it is ... still the wrong approach. Pass field as a constructor argument, as other answers show.

answered Apr 28, 2019 at 8:47

Jonas Wilms

139k20 gold badges164 silver badges164 bronze badges

1 Comment

Ryo Over a year ago

woh right, the only option technically meets the conditions, but will stick to the answer above. thanks

Xie Guanglei · Accepted Answer · 2019-04-28 07:25:14Z

1

There's no way to accomplish your conditions, i'm pretty sure.

Grabbing the member variable in sub class happens after the base class constructor runs, and calling super() must be the first statement in a sub class constructor.

class Child extends Parent {
    field = 'child';
}
// the above is equal to:
class Child extends Parent {
    constructor(){ super(); this.field = 'child'; }
}

And this would cause error:

class Child extends Parent {
    constructor(){ 
        this.field = 'child'; // ERROR!
        super(); 
    }
}

answered Apr 28, 2019 at 7:25

Xie Guanglei

4563 silver badges7 bronze badges

2 Comments

Ryo Over a year ago

somehow typescript playground parsed something like ``` function Child() { var _this = this; _this.field = 'child'; _this.field; _this = _super.call(this) || this; return _this; } ``` when putting this.field before super()

Ryo Over a year ago

typescriptlang.org/play/…

Collectives™ on Stack Overflow

typescript: member variables from super class's constructor

3 Answers 3

Comments

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related