javascript：类继承方法调用

Question

I am new to JS, I am particularly confused by following code:

class One{
    constructor(num){
        this.num = num;
    }

    add(){
        this.num += 1;
    }

    showInfo(){
        this.add();
        console.log(`The result is ${this.num}`);
    }
}

class Ten extends One{
    constructor(num){
        super(num);
    }

    add(){
        this.num += 10;
    }
}

let t = new Ten(1);
t.showInfo();
// The result is 11

I thought the result should be 2, because showInfo is executed in One so add should be executed in One as well, furthermore, showInfo is only defined in One , but why is One.showInfo calling Ten.add instead of One.add ?

I will be so glad if someone offer some explanation.

Answer 1

The showInfo () is inherited by the Ten class and it is executed on the Ten class calling the add () of the Ten class; Yielding 11;

To return 2 add () implementation in Ten Class should call super.add() instead

Answer 2

add(){
        return super.add();
    }

Go through the below :)

https://javascript.info/class-inheritance