JavaScript中setter和getter方法介绍

JavaScript Setter和Getter概述

JavaScript中的setter和getter并非标准方法，仅在非IE浏览器中得到支持（IE内核可能通过其他方式实现，具体机制尚不明确）。尽管存在兼容性限制，合理利用这些方法可以实现多种功能，例如：

1、对数据的访问限制：

通过调用a.value触发value变量的getter方法，若在getter实现中抛出异常，即可阻止对value变量的直接访问。

2、对DOM变量进行监听：

window.name是一个常用于跨域操作的DOM属性。通过覆盖window.name的setter实现，可以实现跨页面的内存异步通信。

3、发挥想象力，可实现更多功能。

Getters和Setters基础

以下内容为转载整理： 首先，快速了解Getters和Setters的概念及其价值，并查看当前支持这些特性的平台。

Getters和Setters

Getters和Setters允许快速获取或设置对象数据。通常，对象包含两个方法，分别用于获取和设置值，例如：

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

使用这种方式编写JavaScript的一个明显优势是：可以隐藏不希望外部直接访问的属性。最终代码结构如下（利用闭包保存新创建的Field对象的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;
});
};
}

请注意以下几点：

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

平台支持情况

平台

支持的浏览器包括：

Firefox Safari 3+ Opera 9.5

以上介绍了JavaScript中setter和getter方法的全部内容，希望对大家有所帮助。如需了解更多内容，敬请关注本站。