JavaScript Setters and Getters

In classical OOP languages, getters and setters seem to get set up as a normal way of creating classes. In JavaScript, we have to be intentional in setting them up.

What we have to do is create a constructor and within the constructor, we create functions that perform the getting and setting. Here is our constructor…

// Lets create a horse constructor because I like horses...lol
function Horse(name) {
    let color = '';
    this.name = name;
    // Function property to set the color variable
    this.setColor = function(newColor) {
        color = newColor;
    }
    // Function property to get the color variable
    this.getColor = function(){
        return color;
    }
}

We can then instantiate the constructor into a new instance, which gives us access to the getter and setter property methods.

let silver = new Horse('Silver');

Now we can run the property methods to set the color.

myHorse.setColor('white'); // 'white' becomes the vaule of the newColor parameter

Now that we have the color property set, we can get it.

myHorse.getColor(); // Returns 'white'

So what if we try to get the color before it was set? In our example, it will return an empty string, but we can provide a helpful message.

this.getColor = function(){
    if(color !== ''){ // Check if the color property is empty or not
        return color;
    } else {
        // Return a string message if the color property has not been set.
        return 'You have not given your horse a name yet! Run setColor() first.';
    }
}

If we have not run setColor(), then it will return the string message we have in our else statement.

Happy Coding!

Clay Hess