JavaScript中Get和Set访问器的实现

       今天要和大家分享的是JavaScript中的Get和Set访问器，和C#中的访问器非常相似。
 标准的Get和Set访问器的实现
function Field(val){      this.value = val;  } Field.prototype = {      get value(){          return this._value;      },      set value(val){          this._value = val;      }};var field = new Field("test");field.value="test2";//field.value will now return "test2" 在如下浏览器能正常工作：

我们常用的实现方法可能是这样的：
function Field(val){    var value = val;         this.getValue = function(){        return value;    };         this.setValue = function(val){        value = val;    };}var field = new Field("test");field.setValue("test2")field.getValue() // return "test2" 
在DOM元素上Get和Set访问器的实现
HTMLElement.prototype.__defineGetter__("description", function () {           return this.desc; }); HTMLElement.prototype.__defineSetter__("description", function (val) {           this.desc = val; }); document.body.description = "Beautiful body"; // document.body.description will now return "Beautiful body";
在如下浏览器能正常工作：

通过Object.defineProperty实现访问器
　　将来ECMAScript标准的扩展对象的方法会通过Object.defineProperty来实现，这也是为什么IE8就是通过这种方法来实现get和set访问器，看来微软还是很有远见的，遗憾的是目前只有IE8+和Chrome 5.0+支持，其它的浏览器都不支持，而且IE8+也只支持DOM元素，不过将来的版本将和Chrome一样支持普通的Javascript对象。
DOM元素上的Get和Set访问器的实现
Object.defineProperty(document.body, "description", {       get : function () {               return this.desc;      },        set : function (val) {         this.desc = val;        } }); document.body.description = "Content container"; // document.body.description will now return "Content container"
 在如下浏览器能正常工作：

普通对象的Get和Set访问器的实现
var lost = {    loc : "Island"};  Object.defineProperty(lost, "location", {    get : function () {        return this.loc;    },    set : function (val) {        this.loc = val;    }});lost.location = "Another island";// lost.location will now return "Another island" 在如下浏览器能正常工作：

【JavaScript中Get和Set访问器的实现】相关文章

1. JavaScript中Get和Set访问器的实现

2. 基于 WebSocket 构建跨浏览器的实时应用

3. JavaScript中的原型和继承

4. 一个跨浏览器的响应式设计辅助工具类库 - CSS Browser Selector +

5. math.js ：用于JavaScript和Node.js的数据扩展库

6. 你不知道的JavaScript和CSS交互的方法

7. DalekJS – 基于 JavaScript 实现跨浏览器的自动化测试

8. 如何使用details元素和summary元素

9. 采用HTML5技术实现的远程桌面访问，Guacamole 0.6.4 发布

10. TogetherJS:一个免费开源的JavaScript库

本文来源：https://www.51html5.com/a3390.html