Introduction to setter and getter methods in JavaScript

The setters and getters in javascript are methods that are rarely used in daily life. They are not standard methods themselves and are only supported in non-IE browsers (Ie kernel may have other methods to do it? I don’t know the solution yet) , but you can do many things by using it, such as:

1. Access restrictions on data:

a.value is the getter method call for the value variable. If it is thrown in the getter method implementation If an exception occurs, you can prevent access to the value variable

2. Monitor the dom variable:

window.name is a very useful cross-domain dom attribute (famous, see Baidu for details) , if you overwrite the setter implementation of window.name, you can achieve cross-page memory asynchronous communication

3. Use your imagination, there are many things you can do

The following are reproduced:
First, let’s take a quick look at what Getters and Setters are and why they are useful. Then, let's take a look at which platforms currently support Gettets and Setters.

Getters and Setters

Getters and Setters allow you to quickly get or set the data of an object. Generally speaking, an object has two methods, used to get and set a certain value, such as:

{
getValue: function(){
return this._value;
},
setValue: function(val){
this._value = val;
}
}

An obvious benefit of writing JavaScript in this way is: you can use it to hide those Properties that you don’t want the outside world to access directly. The final code looks like the following (use a closure to save the value of the newly created Field object):

function Field(val){
var value = val;
this.getValue = function(){
return value;
};
this.setValue = function(val){
value = val;
};
}

So we can use it like this:

var field = new Field("test");
field.value
// => undefined
field.setValue("test2")
field.getValue()
// => "test2"

Let’s simulate the above example "Hidden value attribute", our code looks like this:

function Field(val){
var value = val;
this.__defineGetter__("value", function(){
return value;
});
this.__defineSetter__("value", function(val){
value = val;
});
}

But, you don't like to write like this, but prefer to define getters and setters in the prototype of the object (it doesn't matter where the private variables are written) ), we can use another syntax.

function Field(val){
this.value = val;
}
Field.prototype = {
get value(){
return this._value;
},
set value(val){
this._value = val;
}
};

This syntax seems incredible, but after using it for a while, it is easy to accept it.

The following is another example, which allows the outside world to obtain a username array, but cannot obtain the original, hidden user object.

function Site(users){
this.__defineGetter__("users", function(){
// JS 1.6 Array map()
return users.map(function(user){
return user.name;
});
};
}

Remember the following points:

In an object, each variable can only have one getter or setter. (So ​​value can have a getter and a setter, but value never has two getters)
The only way to delete a getter or setter is: delete object[name]. delete can delete some common properties, getters and setters.
If you use __defineGetter__ or __defineSetter__, it will override the previously defined getter or setter of the same name, even the property.

Platform

Supported browsers are:

Firefox
Safari 3+
Opera 9.5

The above is given by the editor The entire description of the setter and getter methods in JavaScript that you have introduced, I hope it will be helpful to you. If you want to know more, please pay attention to the PHP Chinese website.

For more articles related to the introduction of setter and getter methods in JavaScript, please pay attention to the PHP Chinese website!