From John Resig's early writings, it was roughly translated to make a memo.
Happily, I think I can finally say, "Now, the getters and setters use of JavaScript is very extensive, and it is closely related to the immediate interests of every JavaScript developer." Damn, I've been waiting a long time to say this.
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 what platforms now support gettets and setters.
getters and Setters
Getters and setters enable you to quickly get or set an object's data. In general, an object has two methods for getting and setting a value, such as:
Copy Code code as follows:
{
Getvalue:function () {
return this._value;
},
Setvalue:function (val) {
This._value = val;
}
}
One obvious benefit of writing JavaScript in this way is that you can use it to hide attributes that you don't want the outside world to access directly. The final code looks like this (save the value of the newly created filed object with a closure):
Copy Code code as follows:
Function Field (val) {
var value = val;
This.getvalue = function () {
return value;
};
This.setvalue = function (val) {
Value = val;
};
}
So we can use this:
Copy Code code as follows:
var field = new Field ("Test");
Field.value
=> undefined
Field.setvalue ("Test2")
Field.getvalue ()
=> "Test2"
Let's simulate the "hidden value attribute" in the example above, and our code is like this:
Copy Code code as follows:
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, and you tend to define getters and setters in the prototype of the object (where the private variable is written is not important), we can use another syntax.
Copy Code code as follows:
Function Field (val) {
This.value = val;
}
Field.prototype = {
Get Value () {
return this._value;
},
Set Value (val) {
This._value = val;
}
};
This syntax looks incredible, but it's easy to accept it after a while.
Next is another example that allows the outside world to get a username array, but cannot get the original, hidden user object.
Copy Code code as follows:
function Site (users) {
THIS.__DEFINEGETTER__ ("Users", function () {
JS 1.6 Array Map ()
Return Users.map (function (user) {
return user.name;
});
};
}
As a benefit, I've written a method that will help you implement the object's inheritance and also take into account the getters and setters
Copy Code code as follows:
Helper method for extending one object with another
function Extend (a,b) {
for (var i in B) {
var g = b.__lookupgetter__ (i), s = b.__lookupsetter__ (i);
if (g | | s) {
if (g)
A.__definegetter__ (I, g);
if (s)
A.__definesetter__ (i, s);
} else
A[i] = B[i];
}
return A;
}
In my extend () method, you will find two new methods: __lookupgetter__ and __lookupsetter__. Once you really start using getters and setters, this will be useful.
For example, when I first wrote the Extend () method, I met a variety of errors, I was completely dizzy. Then I found out that the problem was on a simple statement: a[i] = b[i];
If object A has a setter, name I, object B has a getter, and the name is also called I,a[i] is not assigned through other setter methods, but is from the getter method of B. These two __lookup*__ methods allow you to get the original function. (This paragraph is a bit obscure, the original text is as follows)
If a setter existed in object A, named I, and a getter existed in object B, named I, A[i] ' s value is being set not to the Other setters function, but to the computed value from B ' Getter function. The two __lookup*__ methods allow you to access the original-functions used for the methods (thus allowing your to write a Effective Extend method, for example).
remember the following points：
Within an object, each variable can have only one getter or setter. (so value can have a getter and a setter, but value is never two getters)
The only way to remove a getter or setter is to delete object[name]. Delete can remove some common properties, getters and setters.
If you use __definegetter__ or __definesetter__, it overrides the getter or setter, or even the property, that was previously defined with the same name.
Platform
the supported browsers have：
Firefox
Safari 3+
Opera 9.5
(the original did not write Chrome, not yet)
I test the browser with the following code：
Copy Code code as follows:
Javascript:foo={get Test () {return ' foo ';}}; alert (foo.test);
In addition, the following two types of engines also support getters and setters:
SpiderMonkey
Rhino 1.6R6 (New)
