I would like to create a class in JavaScript wich is later extended by multiple subclasses.

I was able to create a closure for what I need but since code is growing more and more it is becoming obfuscating to have one huge file.

Let's say I have a person.
A person can be a student, a footballplayer, ...
But a person can also be a student AND a footballplayer.

I have a working closure that can represent this:

var jack = (
  function() {
    var name = jack;
    var age = 24;
    return {
      student: function() {
        var subject = 'computer science'
        return {
          driveToUniversaty: function() {
            // drive for a while...
          },
          study: function() {
            // read books and stuff...
          },
        }
      },
      footballPlayer: function() {
        var footballClub = 'unbeatable lions'
        return {
          driveToFootballTraining: function() {
            // drive for a while in a different direction...
          },
          playFootball: function() {
            // kick a ball with the guys
          },
        }
      },
    }
  }
)();

I now tried to achieve this using js classes. This is the basis:

class Person {
  constructor(name, age) {
    this.name = name
    this.age = age
  }
}

From what I know I have two options in general to extend this class somehow.

A:

Person.prototype.driveToUniversaty = function() {
  // drive for a while...
}
Person.prototype.study = function() {
  // read books and stuff...
}
Person.prototype.driveToFootballTraining = function() {
  // drive for a while in a different direction...
}
Person.prototype.playFootball = function() {
  // kick a ball with the guys
}

This would be lacking further grouping of the activities.

B:

class Student extends Person {
  // do whatever a student does
}
class FootballPlayer extends Person {
  // do whatever a footballPlayer does
}

That option would be lacking the possibility of assigning more than one activity to a person.

Is there a way to create as many subclasses as I like to a certain object?

I have now split the closure into multiple files and put them together on the server according to what "activities" I need. But I do not like this solution.

Thanks in advance
André

1 Answers

0
MrJ On

you have a bad understanding of javascript classes

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
    this.WhatFor = {};
  }
  WhatIsFor(){
    console.log('WhatFor', this.WhatFor);
  }
}

class Student extends Person {
  study(subject) {
    this.WhatFor.subject = subject;
    console.log (this.name,this.age, 'study');
  }
  driveToUniversaty(UniversatyName) {
    this.WhatFor['UniversatyName'] = UniversatyName;
    console.log (this.name,this.age, 'driveToUniversaty');
  }
  
}
class FootballPlayer extends Person {
  constructor(name, age, footballClub) {
    super(name, age);
    this.footballClub = footballClub;
  }
  playFootball() {
    console.log (this.name,this.age, 'playFootball');
  }
  driveToFootballTraining() {
    console.log (this.name,this.age, 'driveToFootballTraining');
  }
}

var Paul = new Student('Paul',24);
var John = new FootballPlayer('John',12, 'unbeatable lions' );

Paul.study('computer science');

Paul.WhatIsFor();