作家
登录

网络之美 JavaScript中Get和Set访问器的实现代码

作者: 来源:www.28hudong.com 2013-03-30 01:17:45 阅读 我要评论

标准的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" 在如下浏览器能正常工作: 本文总结   尽管微软的IE只是支持了Object.defineProperty,没有完美的实现Get和Set访问器,但是我们已经看到了IE有了很大的进步,特别是刚发布的IE9使用的新的javascript引擎,支持HTML5和CSS3,支持硬件加速等等,相信有一天各个浏览器都能完全拥抱标准,带来一个完美的WEB世界。 参考文献: 1. Getters and setters with JavaScript2. JavaScript Getters and Setters作者:梦想

  推荐阅读

  JQuery UI DatePicker中z-index默认为1的解决办法

在网上也没能找到有效的解决办法,下面我提供一种看似投机的办法: 复制代码 代码如下: $("#txtFillInDate").datepicker({ monthNames: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月'>>>详细阅读


本文标题:网络之美 JavaScript中Get和Set访问器的实现代码

地址:http://www.17bianji.com/kaifa2/JS/25687.html

关键词: 探索发现

乐购科技部分新闻及文章转载自互联网,供读者交流和学习,若有涉及作者版权等问题请及时与我们联系,以便更正、删除或按规定办理。感谢所有提供资讯的网站,欢迎各类媒体与乐购科技进行文章共享合作。

网友点评
自媒体专栏

评论

热度

精彩导读
栏目ID=71的表不存在(操作类型=0)