Just as with objects, we may want to add methods to our classes in addition to properties.
So far, we have learned how to set the values of the class's properties inside the constructor.
When assigning methods in classes, we can either create them outside or inside the constructor.
constructor¶When assigning methods outside of the constructor, we simply declare our methods the same way we would normally do for objects.
1class ClassName {
2 constructor(parameters) {
3 //assign properties with this.key = value
4 }
5
6 methodName(parameters) {
7 //function code
8 }
9}
Example
1class Astronaut {
2 constructor(name, age, mass){
3 this.name = name;
4 this.age = age;
5 this.mass = mass;
6 }
7
8 reportStats() {
9 let stats = `${this.name} is ${this.age} years old and has a mass of ${this.mass} kg.`;
10 return stats;
11 }
12}
13
14let fox = new Astronaut('Fox', 7, 12);
15console.log(fox.reportStats());
Console Output
Fox is 7 years old and has a mass of 12 kg.
We declared our method, reportStats() outside of the constructor.
When we declare a new instance of the Astronaut class, we can use the reportStats() method to return a concise string containing all of the info we would need about an astronaut.
constructor¶When declaring methods inside the constructor, we need to make use of the this keyword, just as we would with our properties.
1class ClassName {
2 constructor(parameters) {
3 this.methodName = function(parameters) {
4 //function code
5 }
6 }
7}
Example
Let's consider the Astronaut class that we have been working with.
When assigning the method, reportStats(), inside the constructor, we would do so like this:
1class Astronaut {
2 constructor(name, age, mass){
3 this.name = name;
4 this.age = age;
5 this.mass = mass;
6 this.reportStats = function() {
7 let stats = `${this.name} is ${this.age} years old and has a mass of ${this.mass} kg.`;
8 return stats;
9 }
10 }
11}
12
13let fox = new Astronaut('Fox', 7, 12);
14
15console.log(fox.reportStats());
Console Output
Fox is 7 years old and has a mass of 12 kg.
Initially, this may seem to produce the same result as assigning reportStats() outside of the constructor.
We will weigh the pros and cons of both methods below.
Try It!
Try comparing the outputs of fox and hippo to see the effect of assigning a method inside the constructor versus outside the constructor.
1// Here we assign the method inside the constructor
2class AstronautI {
3 constructor(name, age, mass){
4 this.name = name;
5 this.age = age;
6 this.mass = mass;
7 this.reportStats = function() {
8 let stats = `${this.name} is ${this.age} years old and has a mass of ${this.mass} kg.`;
9 return stats;
10 }
11 }
12}
13
14// Here we assign the method outside of the constructor
15class AstronautO {
16 constructor(name, age, mass){
17 this.name = name;
18 this.age = age;
19 this.mass = mass;
20 }
21
22 reportStats() {
23 let stats = `${this.name} is ${this.age} years old and has a mass of ${this.mass} kg.`;
24 return stats;
25 }
26}
27
28let fox = new AstronautI('Fox', 7, 12);
29let hippo = new AstronautO('Hippo', 25, 1000);
30
31console.log(fox);
32console.log(hippo);
In the case of assigning the method inside the constructor, each Astronaut
object carries around the code for reportStats(). With today's computers,
this is a relatively minor concern. However, each Astronaut has extra code
that may not be needed. This consumes memory, which you need to consider since
today's businesses want efficient code that does not tax their systems.
Because of this, if a method is the same for ALL objects of a class, define that method outside of the constructor. Each object does not need a copy of identical code. Therefore, the declaration of a method outside of the constructor will not consume as much memory.
Question
What is the assignment for the grow method missing?
1class Plant {
2 constructor(type, height) {
3 this.type = type;
4 this.height = height;
5 }
6
7 grow {
8 this.height = this.height + 1;
9 }
10}