[翻译] JavaScript之Getters和Setters

来自John Resig早年的文章，大致翻译了一下，以作备忘。

令人高兴的是，我想我终于可以说，“现在，JavaScript的Getters和Setters使用非常广泛，它和每个JavaScript开发者的切身利益息息相关”。靠，我为了说这句话已经等了很久了。

首先，我们先来快速了解什么是Getters和Setters，以及它们为什么很有用。然后，我们来看看现在都有哪些平台支持Gettets和Setters。

Getters和Setters

Getters和Setters使你可以快速获取或设置一个对象的数据。一般来说，一个对象拥有两个方法，分别用于获取和设置某个值，比如：

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

用这种方式写JavaScript的一个明显的好处是：你可以用它来隐藏那些不想让外界直接访问的属性。最终的代码看起来就像下面这样（用闭包保存新创建的Filed对象的value）：

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

于是我们可以这样使用：

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

我们来模拟上例中的 “隐藏的value属性”，我们的代码就像这样：

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

但是呢，你不喜欢这样写，而倾向在对象的prototype中定义getters和setters（私有变量写在哪并不重要），我们可以用另一种语法。

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

这种语法看起来很不可思议，但是使用过一段时间之后，接受它也很容易。

接下来是另一个例子，它允许外界获取一个username数组，但是却不能获取原始的，隐藏的user对象。

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

作为福利，我写了一个方法，它可以帮你实现对象的继承，并且还考虑到了getters和setters

// 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;
}

在我的extend()方法中，你会发现两个新方法：__lookupGetter__和__lookupSetter__。一旦你真正开始使用getters和setters，这将很有用。

比如，当我第一次写extend()方法时，我遇到了各种errors，我彻底晕了。后来我发现问题就出在一个简单的语句上：a[i] = b[i];

如果对象a存在一个setter，名字叫做i，对象b存在一个getter，名字也叫做i，a[i]不是通过别的setter方法赋值的，而是来自b的getter方法。这两个__lookup*__方法使你可以获取原始的函数。（这段翻得有点晦涩，原文如下）

If a setter existed in object a, named i, and a getter existed in object b, named i, a[i]'s value was being set not to the other setter function, but to the computed value from b's getter function. The two __lookup*__ methods allow you to access the original functions used for the methods (thus allowing you to write an effective extend method, for example).

　　

记住以下几点：

1. 一个对象内，每个变量只能有一个getter或setter。（因此value可以有一个getter和一个setter，但是value绝没有两个getters）
2. 删除getter或setter的唯一方法是：delete object[name]。delete可以删除一些常见的属性，getters和setters。
3. 如果使用__defineGetter__或__defineSetter__，它会重写之前定义的相同名称的getter或setter，甚至是属性(property)。

平台

支持的浏览器有：

Firefox

Safari 3+

Opera 9.5

(原文没写Chrome，还没出呢)

我用下面的代码测试浏览器：

javascript:foo={get test(){ return "foo"; }};alert(foo.test);

另外，以下两种引擎也支持Getters和Setters：

SpiderMonkey

Rhino 1.6R6 (New)