ES6: Use getters and setters to Control Access to an Object - questions

JavaScript
21

@robertgroves, while I do appreciate your suggestion that I find a mentor and I will explore that option, in the meantime I will persist in trying to understand the concepts in this exercise in order to solve the challenge.

After considering this challenge for a while, and reviewing the material you referred me to, I think that a good part of the barrier to my understanding is that getters and setters are introduced in this challenge, but no explanation is provided, as to how they actually work. Example code is given, but there is no explanation of the example code. The challenge is given, and we are told what the output should be, and that we are expected to use getters and setters to solve the challenge…but again…there is no explanation of how getters and setters work, nor any explanation of the example code.

After doing some review of previous FCC exercises and reading through the MDN links you provided, I think I do understand enough about objects to take on this challenge. I just don’t understand how getters and setters work.

I did read this

Including the explanation of getters and setters, and I am able to follow the explanation…but I still don’t understand it well enough to solve the challenge.

The below was helpful also, especially in helping to understand JS prototypes and inheritance, and the this keyword.

But it does not explain getters and setters.

I have watched a few YouTube videos on getters and setters but I am still not clear on how they work.

Can you (or anyone else):

  1. Explain how getters and setters work, and/or refer me to other resources that provide a good explanation of getters and setters;
  2. Explain what is happening in the example code.

It is a mystery to me why FCC would introduce a new concept (in this case getters and setters) yet provide no explanation of it. (I have encountered this issue with several other exercises, especially in the ES6 section). In fact I think there are some things in the explanation that can trigger more confusion than enlightenment. For example, the first sentences states:

You can obtain values from an object and set the value of a property within an object. These are classically called getters and setters.

From the above explanation it would seem that the only way to obtain values from an object and set the value of a property within an object would be to use getters and setters, and that is what I initially thought after reading it - but is this true? If getters and setters were introduced in ES6, how did coders obtain values and set the value of a property, prior to ES6?

As you know, the term classically was also confusing to me - I don’t think that classically was introduced prior to this challenge and I was initially thinking it referred to the standard dictionary definition - which in my Websters, makes no reference to object oriented terminology. So I’m glad I asked…but I think the explanation in the challenge was presuming that I knew more than I did.

That is my rant for now, in the hopes that maybe someone will take it into consideration when revising the curriculum in future.

Thanks for all your help with this.

23

Hey @Sharad823, I’ll try to come up with better examples when I have some extra time. Or maybe someone else viewing this thread will have a different way of explaining it that makes more sense to you.

Props to you! I’m glad that you are sticking with it and trying to work through it.

Also, just as a side note, I’m a volunteer forum moderator here and one of my main goals in that role is to help people who are stuck on problems or need clarification. That said, freeCodeCamp is open source and there are other volunteer coders and actual members of the freeCodeCamp organization in this forum.

You could try to make these comments/curriculum recommendations over in the freeCodeCamp Support subforum and maybe someone who works on the improving the curriculum will take up a conversation with you on how it can be improved.

24

They are just alternative ways of getting and setting values. Take a look at the example Book class in the challenge. Traditionally, if you wanted to get the value of _author you would create a method called getAuthor (or getWriter) and it would do one thing, return the value of _author. And then to use the method you would do:

const author = lol.getWriter();

The getter syntax allows you to make that a little nicer. With the getter you can now do

const author = lol.writer;

Isn’t that cool, you are technically calling a method (the getter) but it doesn’t look like a method call because you don’t need to use parens at the end. It’s as if you are directly accessing the variable in the class. That’s all a getter is, an alternative syntax for a method that allows you to access a variable in a class. You don’t have to use them if you don’t want. As I mentioned above, some people think they add more confusion than they are worth.

The same concept applies to setters. Instead of writing

lol.setWriter('William S.');

You can write

lol.writer = 'William S.';

Again, just a more convenient syntax to accomplish the same thing.

Don’t over think this. Getters/Setters provide no other special properties that a regular old method won’t do for you. They just allow you to have a more concise syntax when getting/setting variables in the class (or object).

1 Like
25

@robertgroves, thanks for the encouragement and also for making the ongoing effort to help. FCC is the best, because there are people like you here who are willing to go the extra mile. Thanks for that. I will check out the FCC Support subforum to see if maybe there is an appropriate place to post there.

1 Like
26

@camperextraordinaire, thanks for the info/review. I think I now see that getters and setters are just one of a few (many?) different ways of accessing and changing values, and that getters/setters have some inherent advantages compared to the other ways - is that right?

27

@bbsmooth, thanks for the additional clarification, this is helpful.

28

@robertgroves, @camperextraordinaire, @bbsmooth:

Here’s the (apparently passing) code I finally came up with, after much blind trial and error and tinkering. I think I understand it. My “aha” moment in all this was when I became aware of how bad the instructions were and stopped trying to make sense of them.

However, all the help and encouragement provided here by you all was (if not always directly relevant to this particular challenge), definitely helpful in advancing my knowledge of, and understanding of JS. Thanks for the support.

// Only change code below this line
class Thermostat {
    constructor(farenheit) {
        this._farenheit = farenheit;
    } 

    get temperature() {
    return 5/9 * (this._farenheit - 32);
    }

    set temperature(celsius) {
        this._farenheit = celsius * 9/5 + 32;
    }

}

// Only change code above this line

const thermos = new Thermostat(76); // Setting in Fahrenheit scale
let temp = thermos.temperature; // 24.44 in Celsius
thermos.temperature = 26;
temp = thermos.temperature; // 26 in Celsius
1 Like
29

Way to go!

I have a feeling your gonna be one of the people who make the most of freeCodeCamp. You have what it takes to persevere where others may not have. It’s that willingness, ability, and drive that is going to get you through this and into something great. Good luck on the rest of your journey.

2 Likes
30

@robertgroves, thank you for the kind words and encouragement, as well as all your help.

31

Wow - thank you so much for your considerate replies to Sharad’s questions! I really appreciate the time and care you spent explaining those things. Much appreciated!!!

1 Like
32

Ah - THAT is very good to know! Thank you so much for chiming in!

33

I agree, Sharad. I had the same frustration when I got to these exercises. I love that we have this free resource (FCC) , so I take it for what it is, but it sure would be nice if these ES6 lessons were incorporated into the curriculum so that we had the background information we needed to do the lessons. It’s also SUPER good to know WHY we are learning something. Robert’s replies were absolutely wonderful, and I am extremely grateful that he and others take time to help like this. But it’s not quite like starting a car without knowing how the ignition system works. You still know WHY you want to start the car. That’s the part we need to know - whether we should be spending a day or two mastering a particular lesson, or whether we won’t ever use it again. I plan on learning React once I learn basic JavaScript, and I have no idea if I’m wasting my time trying to understand stuff like this.

3 Likes
34

No, you are not wasting your time. ES6 came about in 2015, five years ago, that’s ancient in computer years :slight_smile: The ES6 lessons are standard practice today and you will encounter all of them and more if you plan on doing this stuff professionally. So definitely take the time to learn it because you won’t be able to escape it if you intend to do any serious web development.

3 Likes
35

@robertgroves @Sharad823 @Audracity I just spent 5 days pulling my hair out trying to pass this lesson. I know that part of learning is the struggle so I’ve been going back and trying to figure out what I didn’t comprehend, and using outside sources (mozilla and youtube). Today, I gave up and looked at the answer to try and compare my answer with the answer supplied and try to learn what I was doing wrong that way.

Well, after all that, the only thing I missed was naming the getter and setter “temperature” .

In hindsight I can see that I could have deduced this by looking at the use of thermos.temperature beneath the //only change code above this line but I didn’t.

@robertgroves Do you think it’s worth suggesting an edit to the lesson that communicates the necessity of naming the getter and setter “temperature”?

Keep up the good work everyone!

1 Like
36

I’d say it’s always worth making a suggestion—the best outcome is it improves the curriculum and the worst is the suggestion is rejected.

The good news is, there is an issue open for this lesson and it is currently open to being reworked. You can always add your comments in the issue if you think it would add to the current work being done there.

1 Like