简体   繁体   中英

Call method from parent class inside child class

I've recently started to learn about Classes in javascript and while reading some really interesting stuff I thought of trying some of my own ideas.

If you have a parent class of Parent in which you have a method of logSomething```` and a child class of Child , with which you do class Child extends Parent , how can you then execute the inherited method from the parent class, logSomething```, inside of the child class?

If you define a method inside of the Child class and add this.logSomething() to that method, whenever the method from the child class is called, the inherited logSomething function will indeed run, but apart from that I haven't found any way of executing the logSomething directly inside of that child class.

I've tried this.logSomething() , I've tried adding it to a object, self executing (IIFE) function and everything I could thing of but to no result.

class Parent {
  constructor() {}

  logSomething() {
    console.log('I am logging something')
  }

}

class Child extends Paren {
  logSomething() // This does not work
}

Currently doing this does not work, if throws a error referring to the fact that it things your trying to define a function.

I know it should be possible in some way, if I'm not mistaking React uses something similar with life-cycle methods right? Such as componentWillMount .

How would one go about doing this?

First error is that you are extending Paren instead of Parent .
Also you cannot just throw a random statement inside in a class. It needs to be inside a function.
If you want it to run whenever you create an instance of that class it should be inside the constructor or a function that gets called by it. (note that you need to call super() at the start of the constructor.
Finally, you still need to use this.logSomething or this.logSomething

 class Parent { constructor() {} logSomething() { console.log('I am logging something'); } } class Child extends Parent { constructor() { super(); this.logSomething(); // Will use Parent#logSomething since Child doesn't contain logSomething super.logSomething(); // Will use Parent#logSomething } } new Child(); 

 class Parent { constructor() {} logSomething() { console.log('Parent Logging Called'); } } class Child extends Parent { constructor() { super(); this.logSomething(); // Will call Child#logSomething super.logSomething(); // Will call Parent#logSomething } logSomething() { console.log('Child Logging Called'); } } new Child(); 

You could also do this:

 class Parent { constructor() {} logSomething() { console.log('Parent Logging Called'); } } class Child extends Parent { logSomething() { console.log('Child Logging Called and ...'); // Careful not use this.logSomething, unless if you are planning on making a recursive function super.logSomething(); } } new Child().logSomething(); 

You can call any function or use any property of the parent class using this , as long as the new class doesn't have its own definition for that property.

Look here for more information.

class Parent {
  constructor() {}

  logSomething() {
    console.log('I am logging something')
  }

}

class Child extends Parent {
  logSomething() {
    super.logSomething(); // Call parent function
  }

}

a) you can't call a function there, you can call a function within a function declared in a class

b) you need to use this.logSomething()

example:

 class Parent { constructor() {} logSomething() { console.log('I am logging something') } } class Child extends Parent { fn() { this.logSomething() // This does work } } new Child().fn() 

See other answers for when fn is called logSomething in the child class - then you'd need super.logSomething() to call the "parent" logSomething instead of the child logSomething

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM