欢迎您访问我爱IT技术网,今天小编为你分享的javascript教程:【网络之美 JavaScript中Get和Set访问器的实现代码】,下面是详细的讲解!
网络之美 JavaScript中Get和Set访问器的实现代码
标准的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"
在如下浏览器能正常工作:

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 JavaScript
2. JavaScript Getters and Setters
作者:梦想
关于网络之美 JavaScript中Get和Set访问器的实现代码的用户互动如下:
相关问题:C#属性定义。GET与SET访问器是怎么一回事,
答:1.属性的声明 总的来说,只要注意属性声明或者在使用是的一些规定就可以了,还有最为重要的:属性的操作过程。 声明是用如下语法: 类型 属性名 {访问器声明} 注意:属性还可以跟方法一样有参数,当然限制的是,参数必须是值参数外,参数的列表... >>详细
相关问题:javascript数据属性和访问器属性
答:_year 是属性:静态的 只读 year 是方法:可以理解为私有函数 var descriptor1=Object.getOwnPropertyDescriptor(book,"_year");//获得book._year的属性2004 var descriptor2=Object.getOwnPropertyDescriptor(book,"year");//获得book.year方法 ... >>详细
相关问题:C#get和set访问器代码有问题,vs2012无法辨识get
答:最好在class前面加上public。不然可访问性不一致。 >>详细
- 【firefox】firefox浏览器不支持innerText的解决
- 【Extjs】Extjs学习过程中新手容易碰到的低级错误
- 【clearInterval】js clearInterval()方法的定义
- 【ComboBox】ComboBox 和 DateField 在IE下消失的
- 【dom】javascript dom追加内容实现示例-追加内容
- 【checkbox】让checkbox不选中即将选中的checkbox
- 【Array】js中更短的 Array 类型转换-类型转换
- 【append】append和appendTo的区别以及appendChil
- 【ExtJs】ExtJs 表单提交登陆实现代码-表单提交-
- 【ajax清除浏览器缓存】Ajax清除浏览器js、css、
- 评论列表(网友评论仅供网友表达个人看法,并不表明本站同意其观点或证实其描述)
-
