Getters \ setters for dummies

javascript setter getter
oksf picture oksf · May 1, 2009 · Viewed 124.1k times · Source

I've been trying to get my head around getters and setters and its not sinking in. I've read JavaScript Getters and Setters and Defining Getters and Setters and just not getting it.

Can someone clearly state:

  1. What a getter and setter are meant to do, and
  2. Give some VERY simple examples?

Answer

Matthew Crumley picture Matthew Crumley · May 1, 2009

In addition to @millimoose's answer, setters can also be used to update other values.

function Name(first, last) {
    this.first = first;
    this.last = last;
}

Name.prototype = {
    get fullName() {
        return this.first + " " + this.last;
    },

    set fullName(name) {
        var names = name.split(" ");
        this.first = names[0];
        this.last = names[1];
    }
};

Now, you can set fullName, and first and last will be updated and vice versa.

n = new Name('Claude', 'Monet')
n.first # "Claude"
n.last # "Monet"
n.fullName # "Claude Monet"
n.fullName = "Gustav Klimt"
n.first # "Gustav"
n.last # "Klimt"

Related questions

Getter/setter on javascript array?

Is there a way to get a get/set behaviour on an array? I imagine something like this: var arr = ['one', 'two', 'three']; var _arr = new Array(); for (var i = 0; i < arr.length; i++) { arr[i].__defineGetter__('value', function (…

Read More
JS getters and setters inside a class?

I'd like to create a class in JS that uses native getters and setters. I know I can create getters/setters for objects, like so: var obj = { get value(){ return this._value; }, set value(val){ this._value = val; } } I also …

Read More
JavaScript getter support in IE8

Check out this code. This is a very simple JavaScript object which is implemented using Module Pattern (and you can see the live example at this fiddle address) var human = function() { var _firstName = ''; var _lastName = '' return { get firstName() { …

Read More