Extending the objects from Parent class to child class in Javascript

Question

I have two classes in which the student extends from Person via inheritance. I can call the walk () method of parent from the child class. Is there any way I can call the run method in same fashion which is inside an object for both the classes, Since I’m new to JavaScript let know if I’m making mistake?

//Parent Class

class Person {
  athlete = {
    name: "ronald",
    age: 27,
    run: function () {
      console.log("parent cal")
    }
  }
  walk() {
    console.log('parent call');
  }
}

//Child Class
class Student extends Person {
  athlete = {
    name: "ronald",
    age: 27,
    run: function () {
      //is there any way i can call the run method present in person class ??
    }
  }

  walk() {
    super.walk();// this would call the method present in person 
  }
}

athlete is part of an instance, IOW: does not exist unless your create an instance of Person, so it's not possible to call something that does not exist yet. — Keith
– Keith, Commented Apr 7, 2022 at 11:08
athlete is more or less just an object, so you should create a separate class for it (e.g. Athlete). If you want, you can then create another class called something like StudentAthlete, which extends the Athlete class. The run method can then use super.run(). — Emil Karlsson
– Emil Karlsson, Commented Apr 7, 2022 at 11:14
it seems you are missing the point. You cannot call a function defined inside a class unless it's a static method (a static method is defined as such and can't deal with object properties because there's no object to deal with). Once you have an object (that should be create as let object = new Class();) you can call the function defined in the class the object was instantiated from: object.function(). What kind of invocation do you expect to do? on which object? to which method? — Diego D
– Diego D, Commented Apr 7, 2022 at 11:22
doesn't your code already works like that? if you do: let o = new Student(); o.walk(); it will indeed log on console "parent call" as expected because the call on o.walk() will linvoke the function in the base class that logs that string on console. I still don't get what's wrong. Sorry I got it now.. I'm going to rephrase soon... — Diego D
– Diego D, Commented Apr 7, 2022 at 11:29
people before me suggested already what I'm going to tell you now.. it took longer for me to get it. By the way you could refactor those class in several ways adding a contructor or getters but the point is that's not the way to deal with inheritance. Your Person class (and Student also) holds a value for the athlet property like it was a static property and you want to access to that object from an object instantiated by the child class. There are ways to achieve that but it will be messed up because it won't work as you expect. I'm afraid I can't help you further here — Diego D
– Diego D, Commented Apr 7, 2022 at 11:47

Oris Sin · Accepted Answer · 2022-04-07 12:16:09Z

Well, my approach here may seem a bit different from what you have already done but I think it can be more concise and explanatory for being able to do efficient code maintenance in a future.

First of all, I created a class Person_params for declaring all properties which I will pass directly to my Person Class.

After this I also declared self = this; at the beginning of my Class Person which actually acquires all object properties and saves them to the self.

By using self, you can refer to the global scope in a way that will work not only in a window context (self will resolve to window.self) but also in a worker context (self will then resolve to WorkerGlobalScope.self). This part is from the documentation https://developer.mozilla.org/en-US/docs/Web/API/Window/self

At the end, when I call console.log('${self.name} hides!'); at my Student Class, it actually inherits the properties of Person Class which I passed with the Person_params Class. In this case Person_params is basically used as a Class which serves as a constructor for the Person Class.

//Params for Person Class
class Person_params {
    //constructor params to pass to the Person class
    constructor() {
        this.name;
        this.age;
   }
}

class Person {
  self = this;
  constructor(Person_params) {
     self.name = Person_params.name;
     self.age= Person_params.age;
     this.run();
  }
  
  walk() {
    console.log(`${self.name} walks!`);
  }
  
  run() {
      console.log(`${self.name} runs!`);
  }
}

class Student extends Person {
  // self inherits from its parent class
  hide() {
    console.log(`${self.name} hides!`);
  }
}


let personParams = new Person_params();
personParams.name = "Raul";
personParams.age = 27;

let person = new Person(personParams);
let student = new Student(personParams);

student.walk();
student.hide();

thanks a lot for finding time and replying to my question, but the structure which I have is totally different from the solution you have given .run method is present the object athlete, that's where I'm stuck up.

Collectives™ on Stack Overflow

Extending the objects from Parent class to child class in Javascript

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related