how to create subclasses in javascript

Solutions on MaxInterview for how to create subclasses in javascript by the best coders in the world

showing results for - "how to create subclasses in javascript"
Camilla
10 Jun 2016
1// parent class animal
2class Animal {
3    constructor(name, weight) {
4        this.name = name;
5        this.weight = weight;
6    }
7
8    eat() {
9        return `${this.name} is eating!`;
10    }
11
12    sleep() {
13        return `${this.name} is going to sleep!`;
14    }
15
16    wakeUp() {
17        return `${this.name} is waking up!`;
18    }
19
20}
21//sub class gorilla
22
23class Gorilla extends Animal {
24    constructor(name, weight) {
25        super(name, weight);
26    }
27
28    climbTrees() {
29        return `${this.name} is climbing trees!`;
30    }
31
32    poundChest() {
33        return `${this.name} is pounding its chest!`;
34    }
35
36    showVigour() {
37        return `${super.eat()} ${this.poundChest()}`;
38    }
39
40    dailyRoutine() {
41        return `${super.wakeUp()} ${this.poundChest()} ${super.eat()} ${super.sleep()}`;
42    }
43
44}
45
46function display(content) {
47    console.log(content);
48}
49
50const gorilla = new Gorilla('George', '160Kg');
51display(gorilla.poundChest());
52display(gorilla.sleep());
53display(gorilla.showVigour());
54display(gorilla.dailyRoutine());
55
56// OUTPUT:
57// George is pounding its chest!
58// George is going to sleep!
59// George is eating! George is pounding its chest!
60// George is waking up! George is pounding its chest! George is eating! G
61/*
62The above code has 2 JavaScript classes namely Animal and Gorilla.
63The Gorilla class is a subclass or child class of Animal and it uses the extends keyword to set itself as a subclass.
64However, the super keyword has been used in two different ways.
65Did you guys notice the same? In Gorilla’s constructor (line 23 of code)
66super is used as a “function”. Whereas, Gorilla’s showVigour() (line 35) and dailyRoutine()(line 39) methods have used super as an “object”.
67The super keyword is used in two ways because of the following reasons:
68In line 24, the super keyword is used as a “function” which calls the
69parent class Animal with the parameters passed to Gorilla. 
70This is a key step to be carried out in order to make sure that
71Gorilla is an instance of Animal.
72In line 36 and 40 super is used as an “object” which
73refers to an Animal instance (parent class). The super keyword 
74here is used to call the methods of the parent class Animal explicitly.
75People familiar with languages like C#, Java, Python can pretty
76much relate to how all this works. However, JavaScript was not so simple before ES6 came in, especially for classes. So how did people code without using class syntax, super and extends keywords? Or they never used such concepts before and suddenly decided to add them? Let’s find out!
77*/
queries leading to this page
what is extend in es6class extends another class in javascriptjavascript extendsextedn class syntax jsextend in javascriptjs subclassesjavascript extands classextend a class in javascripthow to extend a class in javascriptextendable classes javascriptextends function javascriptextends function in javascriptjs extendsexplain extends keyword in javascripthow to extned to instance of class jsjs extend classwhat does extends do in javascriptwhat is inheritance in javascriptclass extension jsclass extend java scriptextend a class in jshow use class extends jsfunction extends class in javascriptclass extendsextends in jsextend javascript classextend class javascript es6the extends keyword in javascript explainedinheritance javascriptextend js classjs extends option valuesconstructor call extend jsextends in class js how to use extends in javascriptinheritance in object in jshow to make inheritance in javascriptmake subclass jsfunctional inheritance in javascriptextends keyword javascriptjavascript subclass vs extensionextend vs inherit javascriptextend class javascriptjavascript inheritance examplesubclass jshow to set a class must extends another class in jsuses of extends in jsdoes javascript use extends keywordwhy class extends objectclass jvascripthow inheritance works in javascriptextend javascriptjavascript class extensionjavascript extends classtypes of inheritance in javascriptjavascript extend class thisjavascript class extendsjavascript extends class methodjavascript class extensionsexpress extend class 22extends 22 in javascriptjavascript class extendclass extends package javascript 7e javascript class extend exampleexample extends jsinheritance example javascripthow inheritance works in javascript using functionextend class constructor javascriptjs extend class need constructorsimple inheritance in javascriptextends keyword in jsunextend class jshow to use a class extending another class javascriptclass extending jsjavascript inheritance w3schoolsclass extends in jsinheritance in javascript w3schoolswhich keyword do we use to achieve inheritance in javascriptextend class in javascripthow to extend class in jsjavascript extending classesinheritance in javascriptinheritance in jsextends keyword meaning in node jsinheritance in javascript es6js class properties access extend extending class jswhat is extends javascriptjavascript extends methodobject inheritance in javascriptclass javascript extendsextended class constructor jsfunction extends javascriptextends in javascriotinheritance using constructor in javascriptjs class extendsextend class jsextends in new javascripthow to extend a javascript classjavascript extend from classjavascript prototype inheritancejavascript extends explainedclass extends function javascriptextended class use method from extender javascriptinheritance jsextend classes javascriptsubclass in jsjs function extendsjavascript extends objectextends vs inheritance javascriptinheritance in javasscriptextends keyword in reactinheritance by call 28 29 javascriptextends definition javascriptjavascript extend classjs extend function classjs extemdsjavascript extends functionclass extends js getextends class javascriptto extend the class methods to new class in javascritphow to extend class in nodejswhich of the following keywords is used to indicate inheritance in javascriptjavascript extends with classclass extends javascripthow does extends work in jsjavascript class extends classclass extends jsjavascript class apply extendextends method javascriptwe use the extends keyword to create a subclass javascriptjavascript extend a classwhat does extends mean in javascriptjavascript 22extends 22 methodjs es6 extendsextended class use something from extender javascriptinheritance in prototype javascriptcreate subclass jsswhat happens when extends in javascriptextend a calss jsclass extends in javascriptclass extends java scriptglobal class extends in jsjavascript class extends not workingextent calsss javascriptsubclass in javascriptextends javascritp 24 extend in javascriptinheritence in javascriptjavascript extends examplehow to extend classes in javascriptclass inheritance in jsfunction extends class javascriptjavascript es6 extending a classjavascript extendsionsubclasses in javascripthow does extends work in javascriptjs inheritancejavascript extends functionwhen to use extends javascriptinheritance in node jsextends property in javascriptjavascript nodejs extendsjs extends functionwhat does extends keyword in javascriptinheritance in javascript example w3schoolsjava script extendsinline extend parent class javascriptextend keyword javascriptinheritance in function javascriptextends keyword jsextends javascriptextends jsjavascript inheritancecreate subclass jsusing extends jsdoes javascript support inheritanceinheritance in javascript with exampleextends java scriptjavascript inheritance isjavascript subclassdose javscript have class extendsjs extend constructorclass extend javascriptsubclass javascriptnodejs class extendsjs get extend name classes6 extendsjs child classextends in class javascriptextends in javascriptjavascript extend class has to have methodjs extending classjavascript class and extendswhat is extends in javascriptmust extend a class in jsjavascript class extends exampleextends keyword in javascriptextends meaning javascriptjavascript extendsinheritance from one clas to another class in javascripthow exactly extend keyword works in javascripthow to create subclasses in javascript