I finally got fed up with being confused about and just tested the following three snippets:
class A {
constructor(height, width) {
this.height = height;
this.width = width;
}
calcArea = function() {
return this.height * this.width;
}
}
class B {
constructor(height, width) {
this.height = height;
this.width = width;
}
calcArea = () => {
return this.height * this.width;
}
}
class C {
constructor(height, width) {
this.height = height;
this.width = width;
}
calcArea() {
return this.height * this.width;
}
}
As you can see, each class uses a different syntax to declare its calcArea
function. I understand well the difference between normal functions and fat arrow functions with regards to lexical scoping vs dynamic scoping, but I don't see any difference in this case. In all three cases, the result of calcArea
is as expected. In all three cases, this
correctly points to the instance of the class.
It's also unclear to me whether the syntax in class C is a shortcut for A or for B.
Is there any difference between declaring methods in these different ways?