I know that using an underscore is just a convention to define private variables in JavaScript. But I came across a use case [while using a class] where use of _
seems mandatory to make the code work! My question is how _
is used under the hood by get
and set
.
The below code throws an error:
RangeError: Maximum call stack size exceeded
class User {
constructor(name) {
this.name = name;
}
get name() {
return this.name;
}
set name(val) {
this.name = val;
}
}
let user = new User("Jhon");
console.log(user.name);
Now, if I use _
the code works!
class User {
constructor(name) {
this.name = name;
}
get name() {
return this._name; // Added "_" here
}
set name(val) {
this._name = val; // Added "_" here
}
}
let user = new User("Jhon");
console.log(user.name);
Just look at this piece of code logically:
get name() {
return this.name
}
You read object.name
. To return a value, the get name()
getter reads this.name
, which, in turn, resolves to get name()
. And now, welcome to the infinite loop.
Hence, you need a separate variable name (to store the actual content of name
) than the getter's name. That would be a private variable, and it has become a convention to prepend an underscore in these cases.