Getters and Setters

programming
1

The properties we have been working with so far are known as data properties. These are the properties where we give them a name and assign a value to them:

This is a companion discussion topic for the original entry at https://www.kirupa.com/javascript/getters_setters.htm
1 Like
2

Nice summary article. Your readers should find i it very useful.

1 Like
3

Thanks! You can credit @senocular for making me write it as part of addressing feedback on the upcoming edition of the JavaScript: A Beginner’s Guide :desert_island:

1 Like
5

And…there is a video I recorded to go along with this tutorial:

:video_camera:

6

Hi There. I have some questions about the use of underlines in this Getters and Setters tutorial. I’ve Googled around to understand why one would use a _ at the beginning of a variable in JS and I find chatter about the underline being an indicator of a private variable. I think in this instance you are using it for a different reason maybe? Using the Shout Generator section as a basis for these questions, I see you create a _message property and create a setter named ‘set message’. If I throw out putting a _ in the message property, then the this.message = value.toUpperCase(); creates strange behavior (like recursive). If I leave it in, I see later when I issue shout.message = “This is sparta!”; that the setter is called. So, we are somewhat hiding the implementation of the setter, right? We are not directly setting _message, but secretly calling the setter? Also, the setter doesn’t necessarily have to have the same name as the property it sets as in the zorb example, right? I’m trying to understand the sudden appearance of the underline before the property name in this section.

7

I’ve Googled around to understand why one would use a _ at the beginning of a variable in JS and I find chatter about the underline being an indicator of a private variable. I think in this instance you are using it for a different reason maybe?

It’s related to the explanations you’ve found. Kirupa’s creating some backing storage for the getters and setters, but it’s an implementation detail, so it doesn’t need to be public.

Something subtle between the zorb example and the shout example is that in the zorb example, the backing property is named message, but the getters and setters are called greeting. By contrast, in the shout example, the backing property is _message and the getters and setters are message. When you take out the leading _, you’re creating a naming conflict so that the set message setter calls itself in its own definition, leading to the recursive behavior you described.

The part that’s hidden is the name (and storage) of the _message property. The public interface is the accessors (getters and setters) that don’t start with _. So you’re not hiding the fact that you’re calling the setter, you’re hiding what the setter is doing in its implementation.

Right; it’s almost always going to be a bug if it does.

I think the main problem is that Kirupa swapped from message+greeting to _message+message without explaining the rationale.

2 Likes
8

Hi Kirupa,

thank you so much for all your effort and help with the Tutorials.
I just want to say, that your YouTube video is not the correct on the JavaScript 101, getter and setter Getters and Setters!
It should be the Getters and Setters in JavaScript - YouTube
Best regards,
Marco

9

Hi @Marco_L - glad you liked the content! The links you shared seem to be the same. One is the video itself and the other is the article with the video embedded. Am I missing an important detail? :grinning:

Thanks,
Kirupa

10

Hi Kirupa, maybe it was due to a cookie or something similar, but just to be completely sure, I tried using another browser, and the Youtube video in the Getter and Setter article did not display the correct video. It’s likely a bug on my end!

By the way, the visuals and explanation are really great! :+1:

1 Like